DEV Community

Cover image for Deploying an Azure Web App: A Step-by-Step Guide
Onyemachi Doris
Onyemachi Doris

Posted on

Deploying an Azure Web App: A Step-by-Step Guide

Introduction

Deploying a web app on Azure App Service is an easy and efficient way to host web applications without worrying about managing infrastructure. All you have to do is to use an Azure platform to deploy a web app; Oh! that's why it falls under Platform as a Service. Azure App Service supports various programming languages and frameworks, including .NET, Java, Python, Node.js, and PHP. In this article, we will walk through the process of deploying a web application on Azure.

Prerequisites for Deploying a Web App in Azure
There are 3 important resources you need before deploying an Azure web app. They are;

  1. A resource group
  2. An empty web app
  3. A plan

And most importantly, you must have an Azure account and a subscription.

Now, Let's deploy a web app!

Step 1: Create an Azure Web App Using Azure Portal

a. Navigate to Azure Portal.

b. Search for App Services

Image description

b. Click on Create and Select Web App

Image description

c. Create a new Resource group or use an existing one.

Image description

d. Provide a unique name for App Name. Select a Runtime Stack. I used .NET 6(LTS) which is Windows.

Image description

e. Choose a region and an app service plan based on your budget and scaling needs. Then, Review+Create
Image description

f. Then Create.

Image description

g. After deployment, Go to Resource

Image description

To ensure that what you deployed is an empty web app. Navigate to the Web app and click on default domain.

Image description

It will take you to a page like this. That means your page is empty and awaiting contents.

Image description

Step 2: Deploy your web app. I did mine by navigating to the Web app I created on Azure portal then to Advanced tools. In advanced tools, click on Go.
You can also deploy using GitHub or Azure CLI.

Image description

a. This environment will come up. Then click on debug console.

Image description

b. Select CMD

Image description

c. Select site.

Image description

d. Select wwwroot which is the publicly accessible base folder of a website.

Image description

e. Click on the editing pen in the middle as highlighted.
Image description

f. Highlight the existing link and delete.

Image description

g. Go to ChatGPT and create a html, css and javascript code for the type of website you want to deploy. Copy it and paste. Click on Save.
If this is a real life situation, then get the code from the software engineers.

Image description

Step 3: Verify the deployment.

a. Go back to the web app on Azure portal and click on default domain.

Image description

b. Your web app should be live!

Image description

Conclusion
Deploying a web application on Azure App Service is straightforward and provides flexibility for various use cases. With CI/CD integration, custom domains, and scalability options, Azure Web Apps ensure your application is secure, performant, and highly available.

Enjoyed what you read? Please like, comment and share!

Top comments (0)