I am a fourth-year student at the University of Lagos. Currently a Microsoft Learn Student Ambassador with an interest in Cloud computing. I am very enthusiastic about the field of DevOps, as I have taken various advanced courses in the study and have acquired knowledge & skills. Areas of interest include AWS, Azure, Digital Ocean, Cloud Computing, Data Analysis, Project Management, Cloud Administration, Networking & DevOps. Whether you are new to Infrastructure as Code or have been using it for a while, you will find this helpful article.
This article is a great place to start for anyone who wants to learn Infrastructure as Code on Azure.
I will walk you through what infrastructure as Code (IaC) means, IaC Tools, Azure Native IaC tools, the basics of Bicep, and how to use it to create and deploy Azure resources.
Prerequisites
Before attempting to follow along with this tutorial, make sure you have the following things ready:
- An Azure Subscription - You can sign up for a free Azure account if you don't already have one you can apply if will need to validate as a student if you dont have an academic email apply first for a GitHub Student Developer Pack.
- Azure CLI - This tutorial will use v2.37.0 on a Linux Machine.
- Visual Studio Code - This tutorial will use v1.60.0 on a Linux Machine.
- Azure Bicep Extension for Visual Studio Code - This tutorial will use v0.4.613 on a Linux Machine.
What is Infrastructure as Code?
Infrastructure as Code (IaC) is a way to automate the deployment of various infrastructures. Iac allows you to create a blueprint of your infrastructure and deploy it as often as you want.
It is a great way to ensure that your infrastructure is always deployed in the same way. It also allows you to deploy your infrastructure to multiple environments quickly. For example, you can deploy your infrastructure to a development environment, a staging environment, and a production environment.
Types of Infrastructure as Code Tools
Infrastructure as Code (IaC) tools are used to automate the deployment of infrastructure. There are many IaC tools available in the market. Some popular Iac tools are:
- Ansible
- Chef
- Puppet
- Packer
- Terraform
- CloudFormation
- Azure Resource Manager (ARM)
- Cloudify
- CloudStack
Azure Native Infrastructure as Code Tools
Azure has its own native IaC tools. These tools are used to automate the deployment of Azure resources. Some of the popular Azure native IaC tools are:
- Azure Resource Manager (ARM)
- Azure CLI
- Azure Powershell
Azure Resource Manager (ARM)
Azure Resource Manager is a service for managing and deploying Azure resources. It provides a consistent management layer that enables you to create, update, and delete resources in your Azure subscription.
Templates for ARM are created in Javascript Object Notation (JSON) or Bicep. ARM templates can be deployed through the Azure interface, Azure PowerShell, or the Azure CLI.
What is Bicep?
Bicep is a Domain Specific Language (DSL) for deploying Azure resources declaratively. It aims to simplify the authoring experience drastically with a cleaner syntax, improved type safety, and better modularity and code reuse support.
Deploying a Todo List Website to Azure Static Web Apps
To show you how easy it is to use Bicep, we will create a Todo List static website ARM Template using Bicep and deploy it to Azure Static Web App with Azure Command Line Interface (CLI).
Creating a Resource Group using Azure CLI
A logical container for deployed and maintained Azure resources is called a resource group. To deploy the static website resources, you will need a resource group.
Run the following command in Azure CLI to create a resource group.
az group create --name static-web-RG --location westus
Different parameters used in the above command are:
- name: The name of the resource group.
- location: The location of the resource group.
You can set additional parameters like tags, subscriptions, etc.
A resource group with the name static-web-RG has been created, as seen in the screenshot below.
Creating Static Web App ARM Template using Bicep
Now that we have created a resource group, we can create a static To-do List web app using Bicep.
- The first step is to create a new file in Visual Studio Code. Name the file static-web.bicep.
- The next step is to add the following code to the file:
param location string = 'eastus2'
param staticSiteName string = 'todo-website'
param repositoryUrl string = 'https://github.com/HammedBabatunde/arm-static-website'
param repositoryToken string = <GITHUB_PERSONAL_ACCESS_TOKEN>
param branch string = 'to-do-list'
param sku object = {
name: 'Free'
tier: 'Free'
}
Parameters are used to make a template configurable. In the above code, we have defined the following parameters:
- Location: This states the region where the static To do List web app will be deployed to.
- StaticSiteName: todo-website is added as the name of the static website.
- repositoryUrl: This is the GitHub repository where the source code for the To-do List web app is stored. You can clone the To-do List web app using this link.
- repositoryToken: A GitHub personal access token is required to deploy the static web app. You can use this link to learn how to get your github personal access token.
- branch: The Todo List website source code is stored in the to-do-list branch.
- sku: SKU stands for a Stock Keeping Unit (SKU) for a product that can be purchased. We specified the name and tier of the SKU of the static web app in the parameter.
- The last step is to create the static web app resources. Add the following code to the file
resource staticSite 'Microsoft.Web/staticSites@2022-03-01' = {
name: staticSiteName
location: location
sku: {
name: sku.name
tier: sku.tier
}
properties: {
repositoryUrl: repositoryUrl
repositoryToken: repositoryToken
branch: branch
buildProperties: {
appArtifactLocation: '/'
}
}
}
The above code defines the following:
- A static web app resource with the symbolic name of StaticSite.
- The name of the static web app is set to the value of the parameter staticWebAppName.
- The resource's location is set to the value of the parameter location.
- The SKU of the static web app's name is set to the value of the parameter SKU. The SKU parameter includes an object which contains the key value of the name and tier of the SKU.
- The properties of the static web app: The properties file contains the Todo List repository url, the repository token, the branch name, and build properties.
Here is the snippet of the Bicep code:
param location string = 'eastus2'
param staticSiteName string = 'todo-website'
param repositoryUrl string = 'https://github.com/HammedBabatunde/arm-static-website'
param repositoryToken string = <GITHUB_PERSONAL_ACCESS_TOKEN>
param branch string = 'to-do-list'
param sku object = {
name: 'Free'
tier: 'Free'
}
resource staticSite 'Microsoft.Web/staticSites@2022-03-01' = {
name: staticSiteName
location: location
sku: {
name: sku.name
tier: sku.tier
}
properties: {
repositoryUrl: repositoryUrl
repositoryToken: repositoryToken
branch: branch
buildProperties: {
appArtifactLocation: '/'
}
}
}
You can use the Azure Bicep extension for Visual Studio Code to validate the Bicep code.
Deploying Static Web App ARM Template using Azure CLI
Now that we have created the Azure Resource Manager (ARM) template, we can deploy the static web app using Azure CLI.
To deploy the Todo List static web app using Azure CLI, run the following command:
az deployment group create --resource-group static-web-RG --template-file static-web.bicep
Different parameters used in the above command are:
- resource-group: The name of the resource group to which we will deploy the static web app. We will use the resource group named static-web-RG we created earlier.
- template-file: The path to the bicep file. We will use the static-web.bicep that we created.
When the Todo List static web app has been successfully deployed, the terminal will display a JSON output similar to the following.
Azure automatically generates a default URL (Uniform Resource Locator) for the static website created. To obtain the webpage address for the to-do List, enter the command below.
az staticwebapp show --name todo-website --resource-group static-web-RG --query "defaultHostname"
Different parameters used in the above command are:
- name: this is the name of the static website.
- resource-group: this is the resource group where the static website is located.
- query: this allows us to filter the output to get the URL of the to-do list website.
In my case, the command generates this URL link purple-cliff-05e63e80f.2.azurestaticapps.net.
Cleaning Up Resources
To avoid paying for any underlying Azure resources cost, you should clean up your resources if they're not being used. You can use Azure CLI to delete the static website resource group and its contents.
az group delete --name static-web-RG
Bicep VS JSON
When creating ARM Templates, the two options available to anyone are Bicep or JSON (Javascript Object Notation). We have created a To-do List static website Template using Bicep and deployed it to azure.
We will need a template with the following code to create the same to-do list static website Template using JSON.
{
"$schema": "https://schema.management.azure.com/schemas/2019-04-01/deploymentTemplate.json#",
"contentVersion": "1.0.0.0",
"parameters": {
"name": {
"type": "string"
},
"location": {
"type": "string"
},
"sku": {
"type": "string"
},
"skucode": {
"type": "string"
},
"repositoryUrl": {
"type": "string"
},
"branch": {
"type": "string"
},
"repositoryToken": {
"type": "securestring"
},
"appLocation": {
"type": "string"
},
"apiLocation": {
"type": "string"
},
"appArtifactLocation": {
"type": "string"
},
"resourceTags": {
"type": "object"
},
"appSettings": {
"type": "object"
}
},
"resources": [
{
"apiVersion": "2021-01-15",
"name": "[parameters('name')]",
"type": "Microsoft.Web/staticSites",
"location": "[parameters('location')]",
"tags": "[parameters('resourceTags')]",
"properties": {
"repositoryUrl": "[parameters('repositoryUrl')]",
"branch": "[parameters('branch')]",
"repositoryToken": "[parameters('repositoryToken')]",
"buildProperties": {
"appLocation": "[parameters('appLocation')]",
"apiLocation": "[parameters('apiLocation')]",
"appArtifactLocation": "[parameters('appArtifactLocation')]"
}
},
"sku": {
"Tier": "[parameters('sku')]",
"Name": "[parameters('skuCode')]"
},
"resources":[
{
"apiVersion": "2021-01-15",
"name": "appsettings",
"type": "config",
"location": "[parameters('location')]",
"properties": "[parameters('appSettings')]",
"dependsOn": [
"[resourceId('Microsoft.Web/staticSites', parameters('name'))]"
]
}
]
}
]
}
Enormous right!! Bicep offers a shorter and cleaner way of creating ARM Templates for Infrastructure automation on Azure than JSON.
Check out the benefits of using Bicep using this link.
Conclusion
You learned about Infrastructure as Code (IaC), Azure Resource Manager (ARM), and the types of Infrastructure as Code tools. You also learned how to create a static web app ARM Template using Bicep and deploy it with Azure CLI.
Want to know more about the Bicep? You can start using Bicep with the aid of the materials listed below.
- Deploy Azure Resources by using Bicep and GitHub Actions
- Deploy Azure resources by using Bicep and Azure Pipelines
What are the next steps? You can create more infrastructure using Bicep. The infrastructure can also be deployed using a CI/CD pipeline.