How to host a static website in Microsoft Azure

Rahul Sinha
Voice Tech Podcast
Published in
4 min readMay 9, 2020

Hosting a website creates a problem sometimes for the customers. You want good plans, good connectivity, security, and secrecy.

Microsoft Azure is the best platform to host your website. It is reliable, flexible, secure, and very fast. Azure is a Microsoft cloud computing platform that not only offers to host the website but it gives dozens of services to the customer. From creating a chatbot for the website to the Internet of things and Artificial Intelligence (A.I).

We will see a demo on how to host a simple Calculator which has been made from HTML & CSS and also used Javascript for some functionality.

Layout of Calculator

Download the website template here.

Let get started with our demo.

Step 1: First come to the Azure portal. Sign in with account or else if you don't have an azure account simply create it.

Azure Portal

Step 2: In the left upside corner, you will three lines down to each other. Click on that and scroll down and find a storage account.

Choose Storage Account

Step 3: There you will see no storage account created. In down, you will see create a storage account. Click on that to create a new storage account.

Create a Storage account

Step 4: Now choose your subscription. If there is no resource group created, create a new one. And give a name web-calculator.

Go down you will give a storage account name, name it as webcalculator. Rest leave as it is. Then click on Review + create. It will take a minute to complete all the processes.

Build better voice apps. Get more articles & interviews from voice technology experts at voicetechpodcast.com

If you get this message, Your deployment is complete. Just click on Go to resource.

Click on the go-to resource
Make it enabled.

Step 6: You will be navigated to the dashboard where we have to upload or website. Just scroll down and find the static website. It is by default disabled, make it enabled.

Step 7: Now give the name or the URL of the first page which you want open, our’s is index.html. Also, give Error document path as 404.html. Then save it. After the saving, you will two URLs just copy the primary endpoint URL. We will use that URL after uploading the file in azure.

Copy the URL

Step 8: Again scroll down and find containers. There you will see $web written something, just click on that.

choose Containers and click on $web

There you will Upload button click on that and one by one start uploading the file:

  1. index.html
  2. stylesheet.css
  3. script.js

Note: The link has been provided above. Download it and then upload the file to azure.

Step 9: Now our task is over. We have done it with Azure. Now open the copied link in your browser.

Open the copied link

This is a demo website a simple calculator website has been successfully got hosted in Microsoft Azure.

Calculator in browser

Hurray! you have successfully hosted your first website in Azure. Start creating a new website and start hosting it in Azure; its best, secure, and fast. You can host your resume, blog, or anything you want in Azure.

Something just for you

--

--

Rahul Sinha
Voice Tech Podcast

Technology enthusiast. Keen interest is in Python, Voice technology, Azure, and IoT. Keen to learn new things.