Here we are giving the information on step-by-step process of hosting a static website in Azure cloud platform, and the best part is, it’s completely free! We will also demonstrate how to integrate a custom domain into your static website, making it easily accessible to your audience. Static websites, built using HTML, CSS, and JavaScript, have gained popularity for various purposes like fancy font generators, age calculators, and more.
Prerequisites
Before we begin, make sure you have the following:
- A domain name (You can purchase one from domain providers like Namecheap).
- A Microsoft Azure account (Sign up on portal.azure.com).
- A GitHub account with your static website code repository.
Uploading Static Code to Azure Cloud
- Log in to your Azure portal and search for “Static Web Apps.”
- Click on “Create Static Web App,” select the subscription and resource group.
- Name your web app and choose the hosting plan (Free for hobby/personal projects).
- Select the region that is nearer to your target audience.
- Choose the source as GitHub and authenticate your GitHub account.
- Select the repository and branch that contains your static website code.
- Proceed and create the web app; it will take a few minutes to deploy.
Also Read: How to Connect A Custom Domain to Google Sites in a Simple Steps
Custom Domain Integration
- Go to the “Custom Domains” section in your web app portal.
- Copy your domain name from the domain provider (e.g., www.example.com).
- Click on “Add” under “Custom Domain on Other DNS.”
- Paste your domain name (with www) and proceed.
- Create a CNAME entry with your domain provider using the provided value (site URL).
- Wait for the DNS changes to propagate (may take a few minutes to hours).
- After validation, your website will be accessible via the custom domain.
Adding Root Domain to Azure Web App (Optional):
- For the root domain (example.com), create a CNAME record with the target value.
- Wait for the DNS changes to propagate (similar to the www subdomain).
Troubleshooting SSL Certificate Installation
If you encounter an SSL privacy error, it means the SSL certificate installation is in progress. Wait a little longer and try accessing the website again.
Also Read: Top Image Hosting Websites for Effortless Sharing and Storage
Conclusion
Congratulations! You have successfully hosted a static website on Azure cloud and integrated a custom domain, making it accessible to the world. Static websites are a fantastic way to share information, create interactive tools, or showcase your portfolio. With Azure’s free hosting option, you can explore and experiment without worrying about costs. So, take advantage of this opportunity and create something amazing on the cloud.
Leave a Reply