How to deploy a Web App with CI/CD pipeline on Azure app service.

Deploying a web app with a Continuous Integration/Continuous Deployment (CI/CD) pipeline on Azure App Service using GitHub and Visual Studio Code involves several steps which i will be discussing below:

1. Setup Your Azure Account & Create a Web App:

  1. From the home page, search for App Service Plan as seen in the image below.
    Image description
  2. Click on create.
    Image description
  3. Fill in the required details (Subscription, Resource Group, Name, Operating system, Region, etc.).
    Image description
  4. Choose your preferred pricing plan. Then click Review + Create.
    Image description
  5. Click on create.
    Image description
  6. Click on Go to Resources.
    Image description
  7. Click on webapp-plan.
    Image description
    Image description
  8. Search and click on web app to create one.
    Image description
    Image description
    Fill in the required details (Subscription, Resource Group, Web App Name, pubish, Runtime Stack, etc.).
    Image description
    Review + Create.
    Image description
    Image description
    Image description

2. Set Up Your Local Development Environment:
Install Visual Studio Code and Git if you haven’t.
3. Initialize Git Repository and Create Web App in Visual Studio Code:
Open Git and create a new repository by clicking on New repository.
Image description
Image description
Image description

  1. Initialize Git from Visual studio code terminal:
    Image description
    Image description
    Run git init to initialize a Git repository.
    Run git add . to stage your files. Run git status Image description
    Run git clone +url (from the repository created earlier)
    Image description
    Run nano index php
    Run cat index php
    Image description

5. Back to our Azure page:
Go to your Web App in the Azure Portal.
In the Deployment section, select Deployment Center.
Image description
Select code source. Click on Github
Image description
Image description
Image description
Image description
6. Deploy the Application
Commit and Push: Commit and push your changes to GitHub. The GitHub Actions workflow will automatically start, build, and deploy your application to Azure App Service.
Needed to upgrade from the free subscription to be able to deploy as seen below:
Image description
After Upgrade, you can now add a slot.
Image description
Image description
Image description

7. Monitor Deployment
Check Deployment Status: You can monitor the progress of the deployment in the Actions tab on GitHub.
View the Web App: Once deployed, your web app should be accessible via the Azure App Service URL.

Image description
Image description

By following these steps, you will have successfully deployed a web app with a CI/CD pipeline using GitHub and Visual Studio Code on Azure App Service.


Discover more from Coursity

Subscribe to get the latest posts sent to your email.

Leave a Comment

Your email address will not be published. Required fields are marked *

Discover more from Coursity

Subscribe now to keep reading and get access to the full archive.

Continue reading

Scroll to Top