Setup Azure Websites & Add Domains – Node.js Express Sign-Up Site Tutorial on Azure Websites (Part 1)

As I mentioned in part 0 of the tutorial, It’s ridiculously easy to spin up a website on Azure. There are other tutorials on how to set up the site, but I’ll include a brief tutorial here for the sake of completeness. Setting up a custom domain for the site (i.e. www.ramenscafe.com instead of www.ramenscafe.azurewebsites.com) is also for some reason quite a hassle and the official tutorials did not work for me and many others, so I’ll explain how I managed to do it.

First things first, navigate to your Azure portal. Screenshot (105) - redacted

Press on the NEW button on the bottom left. Choose COMPUTE -> WEBSITE -> QUICK CREATE

Screenshot (106) - redacted

Choose a name for your site. You can later use this URL to access the site, in addition to any domains you add. For the Web Hosting Plan, choose the option to create one if there is none existing currently. Select the CREATE WEBSITE checkmark on the bottom right. Your site should be up before you can say half a mil for real.

Half a mil fo-

Half a mil fo-

Click BROWSE on the bottom to be redirected to your new website.

Screenshot (114)

As you can, there’s not much going on for now, just like when you first visit a site you launch on a traditional webhost. We’ll add content in the upcoming tutorials.

Add Domain to Azure Website

First, I’m assuming you purchased a domain already. If you haven’t, you can grab one at Namecheap for… cheap (yep, that is an affiliate link). If you’re looking for an exotic domain such as a .com.bd in my case or a .quebec domain, you might be better off contacting your national authority on web domains directly; Wikipedia will mention the regulating body for each domain (this might also be cheaper and less shady, as in my case). Go to your domain registrar’s settings page and go to DNS settings. If your registrar won’t handle DNS, you can use Namecheap’s freeDNS feature to use as a nameserver (I won’t go into detail here, but let me know if you need help with that).

Screenshot (112) - redacted

Ignore autodiscover, lyncdiscover and everything beneath it. These are records to configure Office365 domains.

Note, the exact instructions will depend on your registrar/DNS host. You should strive to make the records as much like this as possible. You’re going to have to add the domain records to the domain settings page. The first thing we add is our website’s IP on the @ record. Choose A (Address) for that, if it’s not set already. The TTL (Time-To-Live) will bet set automatically, but choosing 1800 otherwise is fine. for the www record put yourdomain.azurewebsites.net. . That double period was intentional. You will likely have to put a period after the .net for it to work properly, but this might depend on the DNS service.

These records alone will likely not be enough for your domain to function properly (depends on how finicky Azure is being). So we’re going to add two additional CNAME (Alias) records. Add an awverify record with URL awverify.yourdomain.azurewebsites.net. . Then add an awverify.www record with URL awverify.yourdomain.azurewebsites.net. . This is necessary for the www to work if entered in an address bar (without it yourdomain.com would work but not www.yourdomain.com). To add subdomains, do the same thing again, but this time add the name of the subdomain anywhere you see an awverify (check the ukil records in the picture to see what I mean).

Finally, go back to the Azure Portal and click on WEBSITES. Select the name of your website, (but don’t click on anywhere near the arrow on the website title, or it will take you to the website management page). The option to MANAGE DOMAINS should show up on the bottom. Click that. Check the picture before the last two to see what I mean.

Screenshot (110) - redacted

Now all you have to do is add www.yourdomain.com and yourdomain.com. A waiting animation should be played in the text box and if it’s successful, you’ll see a green checkmark. If you get a red x, then try exiting the page and coming back. I once had to refresh after several minutes for it to work.

Green checkmark indicates you have yet to fail in life.

Green checkmark indicates you have yet to fail in life.

And with that, you now your website up along with it’s own domain name!