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.
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.
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.
We are the founders of Techspurblog and we have been in this industry for over Four years. We pride ourselves on being the global leader in developing Technology Blog, which can create original content.
We are a team of enthusiastic people who want to share our experience, knowledge and enterprise with the world. We love what we do and we hope you will too!