DEV Community

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

Posted on

1 1

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!!!

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

Top comments (0)

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

πŸ‘‹ Kindness is contagious

Explore a sea of insights with this enlightening post, highly esteemed within the nurturing DEV Community. Coders of all stripes are invited to participate and contribute to our shared knowledge.

Expressing gratitude with a simple "thank you" can make a big impact. Leave your thanks in the comments!

On DEV, exchanging ideas smooths our way and strengthens our community bonds. Found this useful? A quick note of thanks to the author can mean a lot.

Okay