Deploying a Web App using Azure CLI and Azure Resource Manager (ARM) Template (LAB)

Deploying a Web App using Azure CLI and Azure Resource Manager (ARM) Template (LAB)

Effortless Web App Deployment: A Step-by-Step Guide

Visit link: Deploy Linux VM with Azure ARM Templates to know more about Azure Resource Manager (ARM) template.

  1. Login to your account on github.com and create a new repository

  1. Open Git Bash

  1. Click Yes in the dialog box that comes up

  2. Run these commands below to set your username and email

    git config --global user.name "Your Name"

    git config --global user.email ""

    NB: The “Your Name” is a placeholder for your GitHub account username while the is for the email address used to open your GitHub account.

  3. To initialize your Git, you have to be in the folder where your web files are. Run the cd [folder name] to change directory. For example, cd documents, cd downloads

  4. git init - to initialize a new repository

    git add [file] - stage changes for commit.

    git commit -m “[commit message] “- commit staged changes with a message.

    git remote add origin [repository URL //*URL of the repository you created*] - adds the remote repository.

    git push origin master - Push changes to the remote repository.

  5. Check your repository and confirm the web files are present.

It is time to deploy the Web App using Azure CLI and ARM Template.

  1. Copy these two files: template.json and parameters.json one after the other

Template.json File:

{

    "$schema": "schema.management.azure.com/schemas/2019-04..",

    "contentVersion": "1.0.0.0",

    "resources": [

      {

        "type": "Microsoft.Web/serverfarms",

        "apiVersion": "2021-01-15",

        "name": "[parameters('appServicePlanName')]",

        "location": "[resourceGroup().location]",

        "sku": {

          "name": "F1",

          "tier": "Free",

          "size": "F1",

          "family": "F",

          "capacity": 1

        }

      },

      {

        "type": "Microsoft.Web/sites",

        "apiVersion": "2021-01-15",

        "name": "[parameters('webAppName')]",

        "location": "[resourceGroup().location]",

        "properties": {

          "serverFarmId": "[resourceId('Microsoft.Web/serverfarms', parameters('appServicePlanName'))]",

          "siteConfig": {

            "appSettings": [

              {

                "name": "SCM_DO_BUILD_DURING_DEPLOYMENT",

                "value": "true"

              }

            ]

          }

        }

      }

    ],

    "parameters": {

      "appServicePlanName": {

        "type": "string"

      },

      "webAppName": {

        "type": "string"

      }

    }

  }

Parameters.json file:

{

  "$schema": "schema.management.azure.com/schemas/2019-04..",

  "contentVersion": "1.0.0.0",

  "parameters": {

    "appServicePlanName": {

      "value": "myAppServicePlan"

    },

    "webAppName": {

      "value": "myPhpWebApp43564"

    }

  }

}

Creating a workspace in Visual Studio Code:

  1. Open Visual Studio Code and open a folder from file menu

You can also create a new folder.

  1. Select the folder.

  1. Click Yes, I trust the authors

  1. Create two (2) new files and name them template.json and parameters.json. Save both files using ctrl + s

  2. Paste the copied file templates in their respective places in Visual Studio Code. Refer to 8 to see templates

  1. Open the terminal

  1. Choose Git Bash

  1. Login to your Azure account from the terminal using az login command

  1. Log in your Azure account credentials

  1. Choose the Azure subscription

  1. az group create -n myRG -l eastus - creates a Resource Group

  2. az deployment group create --resource-group [resource group name] --template-file template.json --parameters parameters.json

  3. az webapp deployment source config --name [WebApp name] --resource-group [resource group name] --repo-url [url of your repository on github.com] --branch master --manual-integration

Launch WebApp from Azure Portal

  1. login to your Azure Portal and go to resource groups

  1. Click on the name of your resource group

  1. Click on the name of your WebApp

  1. In the Overview section, copy the Default domain and paste in a browser

  1. View your WebApp.