DEV Community

Cover image for Microsoft Azure: Building My First Azure Static Web App.
Amadi Chimeremma
Amadi Chimeremma

Posted on

Microsoft Azure: Building My First Azure Static Web App.

Web App

Creating and deploying a static web app on Azure using GitHub involves several steps, which are:

  1. Create a GitHub repository: Create a new GitHub repository or use an existing one to host the code for your static web app.

Github

  1. Create an Azure account: If you don't have an Azure account, create one at portal.azure.com
  2. Create a new static web app in Azure: In the Azure portal, navigate to "Static Web Apps" and click on the "Add" button to create a new static web app. Azure1
  3. Configure your static web app: Configure your static web app by providing details such as the name of the app, the source code repository URL, build settings, etc. Azure2
  4. Connect your GitHub repository to your Azure account: In the "Deployment Center" tab of your Azure static web app, connect your GitHub repository by providing the required access and authentication details.

Azure3

  1. Enable continuous deployment: Enable continuous deployment by selecting the option to deploy changes automatically whenever new changes are pushed to the GitHub repository.
  2. Deploy your static web app: Deploy your static web app by pushing the code changes to your GitHub repository. Azure will automatically build and deploy the changes to your static web app. Azure4
  3. Verify the deployment: Verify that your static web app is deployed and running correctly by navigating to the URL of the app provided in the Azure portal. Azure5
  4. Update your static web app: Whenever you need to make changes to your static web app, simply make the changes in your code and push them to your GitHub repository. Azure will automatically build and deploy the changes to your static web app. Azure6 Following these steps will allow you to create and deploy a static web app on Azure using GitHub.

Top comments (4)

Collapse
 
jaeldev profile image
Jaël Kalvin

Short and simple. Really enjoyed reading this straight to the point article 👍

Collapse
 
chymee profile image
Amadi Chimeremma

glad you enjoyed reading through. Thanks Jael!

Collapse
 
evelyn_ita profile image
Evelyn Ita

Very easy to understand. 👏

Collapse
 
chymee profile image
Amadi Chimeremma

Thank you Evelyn!