loading...

Deploy static websites on Azure App Services

govindgoel profile image Govind Goel ใƒป2 min read

Alt Text

So let's start

  • First of all open Azure Portal
  • Open Azure CLI in the portal, or you can also login in your local terminal.
  • Create a resource group:
    az group create --name myResourceGroup --location "West Europe"
  • Create an App Service Plan:
    az appservice plan create --name myAppServicePlan --resource-group myResourceGroup --sku FREE
  • Create Web App:
    #Bash
    az webapp create --resource-group myResourceGroup --plan myAppServicePlan --name  --runtime "PHP|7.4" --deployment-local-git
    #PowerShell
    az --% webapp create --resource-group myResourceGroup --plan myAppServicePlan --name  --runtime "PHP|7.4" --deployment-local-git
    
    You should see something below as the output:
    Local git is configured with url of 'https://@.scm.azurewebsites.net/.git'
    {
      "availabilityState": "Normal",
      "clientAffinityEnabled": true,
      "clientCertEnabled": false,
      "cloningInfo": null,
      "containerSize": 0,
      "dailyMemoryTimeQuota": 0,
      "defaultHostName": ".azurewebsites.net",
      "enabled": true,
      < JSON data removed for brevity. >
    }
    
  • Now navigate to
    http://your-app-name.azurewebsites.net

    And you should see page like below



  • Alt Text
      Now navigate to your project directory in your local
    • Create a new file named
      index.php
      in your project root and write the following line in the file:
    <?php
     include_once("index.html"); 
    ?>
    
  • Next, create a composer.json file in the root directory and write the following in it:
    {}
  • First, lets use git to initialize or create a version of the site we want to deploy:
    git init
  • Then, we will add all the files to the git repository.
    git add .
  • Commit the changes
    git commit -m "Initial Commit"
    
  • Add the remote of Azure Repo:
    git remote add azure your-deploymentLocalGitUrl-from-create-step
  • git push azure master
  • Navigate here and your website is live ๐ŸŽ‰๐ŸŽ‰
    http://your-app-name.azurewebsites.net
  • Posted on by:

    govindgoel profile

    Govind Goel

    @govindgoel

    GSoC'20 Mentor|| Microsoft Learn Student Ambassador|| Web Developer

    Discussion

    pic
    Editor guide