Looking to take your hackathon project to the next level? In this tutorial, we will show you how to use Microsoft Azure to get a website hosted in 30 minutes using a free custom domain.
Want to learn more about Microsoft Cloud? Explore free interactive learning paths on the Microsoft Learn Student Hub or sign into your account and view the Microsoft quick start guides for popular solutions in the Azure Education Hub!
Hosting a Website with Microsoft Azure
Microsoft Azure has a ton of different services that can help you with all sorts of problems. We’re going to keep things simple today and just use Microsoft Azure as a host for a static website or web app.
1) Claim your free Azure credit! Students get $100 in Azure credit plus access to all sorts of free services. Not a student? You can still sign up for a free Azure account here.
2) If you’re unsure where to start, I’d recommend you Create a Static Website. If you’re looking to make a more full-featured web app, Azure has some great quick-start tutorials for creating a python or node.js web app.
3) Make sure you can access your website directly from its Azure address. The address for my project is https://mlh-custom-domain-demo.azurewebsites.net/.
Picking a Domain Registrar
MLH partners with both Domain.com and GoDaddy Registry to provide free domains to hackers. Depending on which of our Member Event Hackathons you’re at, you’ll get a free domain from one or the other.
1) Check your email for a message titled, “Everything you’ll need to know from MLH at {Your Hackathon’s Name}”.
2) Your email should have either a section for Domain.com or GoDaddy Registry. If you don’t have either, check out the GitHub Student Developer Pack for more free tools and codes! Regardless of which partner you see, note down the promo code.
3) If you see GoDaddy Registry, claim your free domain name. GoDaddy Registry offers a ton of different TLDs (top level domains) you can choose from including .co, .tv, .us, .study, .design, and many more.
4) If you see Domain.com, claim your free .tech domain name.
Connecting Your Domain to Your Website (Setting Up DNS Records)
Next, we need to connect your Microsoft Azure web app with your custom domain.
1) From your Azure homepage, click into the specific web app you’re working on.
2) Next we need to navigate to “Custom domains”. We’ll “Add custom domain” next. From there, you just need to select “All other domain services” and type in the domain name you registered.
3) Microsoft Azure will generate an A record and TXT record for you.
4) Next, you’ll need to add these records to your domain using either GoDaddy Registry (Porkbun) or Domain.com.Here are the instructions for both.
Below is what those custom records look like on Porkbun.
5) After you’ve added those custom records, you need to head back to Microsoft Azure and “Validate” the domain. Did your validation fail? Domain propagation can take time. If your domain isn’t working right away, give it at least a few hours to propagate.
6) Head to the domain you registered to see your live website with a custom domain! Congratulations, you just finished creating your very first web app! From here, you could either customize your web app or use your new skills to build another web app.
Use the technology and tools you learned through this tutorial to start your next hackathon project, and be eligible to win up to three different MLH prize categories! Visit our website to explore more benefits and perks provided by MLH’s partners, and to register for your next hackathon.