Create a Static Web App on Microsoft Azure
Tags: cloud, azure, tutorial
Published: 2023-04-14 11:41:54

Today, we will be learning how to create a static web app on Microsoft Azure. In this step by step procedure, you will realize that it easier than you actually thought.

**1. Log in to your Azure portal and search for static web apps**
After logging in to your account, input 'static web apps' on the search bar and enter. This will lead you to the static web app module and you can create a static web app from here.


![create static webapp](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7c81f4kw3b7q8ggzq4yq.PNG)

**2. Fill in the necessary static web app details**
First, we have to fill out the subscription and choose a resource group. If you don't have an existing resource group, proceed to create one and make sure you give it a globally unique name.


![resource group static](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zgrcb6pgder1nedjazuw.PNG)
After that we fill in the static web app details by giving it a name. 

![static name](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8cgtgmn06kpfsdxey5n8.PNG)
We also look at the different hosting plans with two different types which is the free plan for hobbies and personal projects and the standard plan for general production plan. Choose whichever you want.

![plans](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mzxxcy0rqr5urt136d71.PNG)
You can also look at the different plans available, compare them and choose what suits you most.

![available plans](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gfeyyh85i0osgz9bgznl.PNG)
Next is choosing the region you want it to be hosted.

![region](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ydsn0b6bog8x50w1s5s8.PNG)
For the deployment details, you will have to choose between GitHub, Azure DevOps or another platform, but in this case we will go with GitHub. Sign in to access your GitHub account.

![Deployment Details](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/621qfg77brthu15kgtjt.PNG)

Fill in the next steps with the repository, branch and build details of your repository that is to be deployed.

![Git details](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xy1qy1m2f1n0ec7xflnn.PNG)

Preview your workflow file, then review and create.

![review create](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z1gixxldelhyeqfsqu44.PNG)

Details of your static web app will be shown and you can proceed with create.

![create](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/igjentpavaird9801gyz.PNG)

After a few seconds, your deployment will be complete.

![deployment complete](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b2y2t94jkbcp2ex3kgvl.PNG)

Head over to your resource and check the details of the static web app, you will see that a URL is provided for you if the deployment was successful.

![static web app](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1zjgt05kli60htwk41ug.PNG)

Click on the URL and there you have it, your static web app has been created and deployed!

![purple haze link](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mfb1urxb4fegxnf100qr.PNG)

I hope you liked this tutorial. If you have any questions please feel free to ask :)