Continuous Deployment with Azure App Service

Automate your development workflow and ensure your applications are always up-to-date with continuous deployment. This tutorial guides you through setting up continuous deployment from a GitHub repository to Azure App Service.

Diagram illustrating continuous deployment flow

Prerequisites

Before you begin, ensure you have the following:

An active Azure subscription.
A GitHub account with a repository containing your web application code.
Your web application is compatible with Azure App Service (e.g., Node.js, Python, .NET, Java).

Step 1: Create an Azure App Service

If you don't already have an App Service, create one. Navigate to the Azure portal, search for "App Services", and click "Create". Fill in the required details like subscription, resource group, app name, runtime stack, and region.

Step 2: Configure Continuous Deployment

Once your App Service is created, navigate to its overview page. In the left-hand menu, under the "Deployment" section, select "Deployment Center".

In the "Deployment Center", choose your source provider. For this tutorial, select GitHub.
Authorize Azure to access your GitHub account if prompted. This is necessary for Azure to read your repositories.
Select your organization, repository, and the branch you want to deploy from.
Configure the build provider. Azure can often detect the build settings automatically based on your project type. If not, you may need to specify build commands and output locations. For example, for a Node.js app, the build command might be npm install && npm run build.
Review your settings and click Save. Azure will now set up a GitHub Actions workflow (or a similar CI/CD pipeline) to build and deploy your application whenever changes are pushed to the selected branch.

Step 3: Test Your Deployment

Make a small change to your application's code in your GitHub repository and push it to the branch you configured for deployment. You can monitor the deployment progress in the Deployment Center. Once the deployment is successful, your updated application should be live on your Azure App Service URL.

Example GitHub Actions Workflow (.github/workflows/azure-app-service.yml)

Azure will typically generate a workflow file similar to this. This is a simplified example:

                
name: Build and Deploy to Azure App Service

on:
  push:
    branches:
      - main # Or your primary branch

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest

    steps:
    - uses: actions/checkout@v3

    - name: Set up Node.js
      uses: actions/setup-node@v3
      with:
        node-version: '18' # Or your project's Node.js version

    - name: npm install, build, and test
      run: |
        npm install
        npm run build --if-present
        npm run test --if-present

    - name: Azure WebApp Deploy
      uses: azure/webapps-deploy@v2
      with:
        app-name: your-app-service-name # Replace with your App Service name
        slot-name: production # Or your staging slot
        publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE }}
        package: . # Or the path to your build artifacts
                
            

Note: Ensure you have configured the AZURE_WEBAPP_PUBLISH_PROFILE secret in your GitHub repository settings.

Troubleshooting Common Issues

Deployment Fails: Check the build logs in the Deployment Center for specific error messages. Common causes include incorrect build commands, missing dependencies, or environment configuration issues.
Application Not Starting: Verify your application's startup command in the App Service Configuration. Ensure all environment variables are correctly set.
Incorrect Content Displayed: Clear your browser cache or try deploying to a staging slot first to test. Ensure the correct branch is being monitored.

By setting up continuous deployment, you can significantly streamline your development process and deliver new features and bug fixes to your users faster and more reliably.