DEV Community

Cover image for HOST A STATIC WEBSITE ON AZURE BLOB STORAGE
Adah Okwara
Adah Okwara

Posted on

HOST A STATIC WEBSITE ON AZURE BLOB STORAGE

Deploying a static website on Azure Blob Storage is a cost-effective and scalable solution for website hosting. Azure Blob Storage offers secure and scalable object storage for unstructured data and includes the capability to host static websites directly from a storage account. This blog will walk you through the process of deploying a static website to Azure Storage, enabling you to have a publicly accessible website.

Prerequisites

  1. An active Azure account. However, if you do not have one, you sign up at Azure

Step 1: Log in Azure

Step 2: Create a storage account

  • In the middle side menu, Click on "storage account"
  • Click on "Create"

Image description

Image description

2. Configure Storage account

- Basics Tab:

  1. Select your subscription.
  2. Choose or create a new resource group.
  3. Enter a unique storage account name.
  4. Select a region.
  5. Choose "Standard" for performance.
  6. Select "Geo-redundant storage (GRS)" for redundancy
  7. Click the "Next" button and configure the remaining sections as needed, or leave the default settings in place.
  8. Click "Review + Create".

Image description

Validation and Create

  • Verify that all configurations are correct.

  • Click "create"

Image description

Deployment complete

  • After the creation of the storage account, click on "go to Resource"

Image description

Step 3: Navigate to Static website

  • In the left-hand menu, Click "Data management"

  • On the data management drop down, click "Static website"

Image description

Enable static website

  • Click "Enabled"
  • Enter 'index.html' as the index document name.
  • Enter '404.html'on the error document path
  • Click "Save"

Image description

Note Down the Endpoints:

After saving, you will see primary and secondary endpoint URLs. Copy the primary endpoint URL.

Image description

Step 4:Upload website files

1.** Navigate to containers:**

  • In the left-hand menu, On "Data storage" drop down, Click on "Containers".
    • Click on the '$web' container.

Image description

2. Upload Files from your laptop

  • Click on "upload"
  • Navigate to where 'my website' folder is saved on your PC
  • Drag and drop the website files into the upload box.
  • Click "Upload" to transfer your files to the $web container.

Image description

Image description

Image description

Step 5: Testing your Website

  1. Access your website
  • Open a web browser
  • Enter the primary endpoint URL copied earlier and paste on your browser.
  • Your static website should now be live and accessible anywhere

Image description

Conclusion
Hosting a static website on Azure Blob Storage is a straightforward and efficient process. By following these steps, you can quickly deploy and share your static website. Azureโ€™s scalability and robust security features ensure that your site performs optimally and remains secure.

Happy Hosting!!!

Top comments (0)