Cloud Resume Challenge Tutorial — Part 3 of 6

Jonathan Stock
Coding in the Cloud
8 min readJan 1, 2024

Part 3: Activate a URL and Configure DNS and Azure Front Door CDN

Introduction

This tutorial is a hands-on, project-based review of web development fundamentals designed to prepare you to pass your Azure Fundamentals Certification (AZ900). You will apply the concepts from AZ900 to a real project in Azure using real processes and approaches that engineers use for real projects. You don’t need to know command line, HTML, or networking. But by the time you finish, you will have a basic understanding of these concepts. It is written for the non-technical person, starting from an absolute beginner point of view.

Based on Forrest Brazeal’s Cloud Resume Challenge, this tutorial shows you one of many possible ways to build and host a simple website in Azure. The tutorial also will show you which tools to use and how to build a software development workflow. I’ve consulted with software developers throughout so that you can have confidence that the workflow is based on real-life, best practices. With a solid workflow foundation in place, you can expand the Cloud Resume Challenge to some of the optional enhancements, or even start new your own new projects, learning, exploring and building with Azure.

Project Overview

In this six-part project, you’ll build a cloud-hosted resume by completing the following:

· Part 1 — Create Your Resume in a GitHub Workflow

· Part 2 — Activate Azure Storage Static Webpage

· Part 3 — Activate a URL and Configure DNS and Azure Front Door CDN (you are here)

· Part 4 — Activate HTTPS

· Part 5 — Automate Your Workflow using GitHub Action

· Part 6 — Add a Staging Webpage to Your Workflow

Tutorial Overview

Goals of Part 3

In the prior tutorial, you set up all the cloud services in Azure to host the website. In this tutorial, we’ll configure Domian Name Server (DNS) so that your website can be found using a domain name of your choice.

In Part 3 you will activate a domain name through a registrar, configure Domain Name Service (DNS) in Azure and activate a CDN in your resource group so that requests to your URL will route into CDN (step 1 below), in preparation for Part 4, where you’ll configure steps 2 and 3 I the graphic below to support HTTPS so users can connect to your website securely.

AZ900 — Need to Know

Azure Networking — DNS Zones and Azure Front Door CDN

Azure networking is a collection of services provided by Microsoft Azure that enable you to connect, protect, and deliver applications and resources in the Azure network. Azure Networking includes many more services that will be covered on the AZ900 exam, but for this tutorial we will focus on the following:

· Domain Name Service (DNS) is a network protocol that translates domain names to IP addresses. When you register a domain name through a registrar like GoDaddy, the registrar will also typically provide you with DNS services to support this routing. However, in this project we will use an Azure DNS zone to host the DNS records for your domain. To host your domain in Azure DNS, you need to create a DNS zone for that domain name.

· Content Delivery Networks (CDNs) are a global network of servers that improve the security and performance of web applications. In this project we’ll use Azure Front Door CDN as part of the web architecture for one main reason — to host a domain name certificate and enable HTTPS secure connectivity. With Azure Front Door CDN you can also enable advanced web performance and security features.

Components and Costs

Domain Name

· These services allow you to choose a customized URL for your website with an easy to remember .com, .net. or .whatever

· Costs vary depending on the registrar, the extension and domain name, but you can get a domain for just a couple of dollars / year

Technology Terms

URL — Universal Resource Locator

A URL is nothing more than the address of a given unique resource on the Web. For more detail on the components of a URL see: What is a URL? — Learn web development | MDN (mozilla.org)

Registrar

A registrar is an authorized provider of domain names. Microsoft Azure is not a registrar but you can buy one from a third party and using DNS (see below), still manage the domain routing in Azure.

Domain Name Service (DNS)

DNS is a hierarchical and distributed naming system for computers, services, and other resources in the Internet or other Internet Protocol (IP) networks. It associates various information with domain names (identification strings) assigned to each of the associated entities. DNS translates domain names to IP addresses so that web browsers can load Internet resources. When you enter a domain name like mycloudresume.com into your web browser, the DNS system looks up the IP address associated with that domain name and returns it to your computer. Your computer then uses that IP address to connect to the web server hosting the website and download the digital files. DNS enables anyone with a browser on an Internet-connected computer to enter a website domain name, connect to a remote server, and download the digital files from anywhere in the world. And to work, each computer that connects to the Internet must have a unique IP address. DNS is the global standard so that every computer/server knows how to find every other computer/server.

CDN

A Content Delivery Network (CDN) is a network of servers that improve performance, scalability, by caching the website closer to users. As the first point of entry for your website, with scalable capacity, they also enable security features such as Web Application Firewall (WAF) that can apply rules and block nefarious requests. At this stage of the project you are using Azure Front Door CDN to provision a security certificate on your website that enables a browser to connect using HTTPS (versus HTTP).

Part 3 Activate a URL and Configure DNS and Azure Front Door CDN

Step 1 — Purchase a Domain Name

Azure isn’t a domain name registrar, so you’ll have to buy one from a service like GoDaddy. Once you do that, go to step 2.

Step 2 — Delegate DNS Management to Azure

In this step you’ll create a DNS Zone in Azure, delegate authority to it so you can manage your DNS settings in Azure. Tutorial: Host your domain in Azure DNS | Microsoft Learn

· In Azure Marketplace, search for DNS Zone

· Select DNS Zone and create a new resource, completing the drop downs as noted below. The “name” is the URL of the domain name you registered in the prior step

· Go to the DNS Zone you just created

· On the Overview page locate the Name Server information

· In another browser tab, go to your Domain Name Registrar and Access the DNS Management Service

· Navigate to the Nameservers. I’ve included a screen shot for Godaddy

· Copy and Paste the four nameservers from Azure into your domain name registrar

· Proper nameserver syntax is to add a ‘.’ at the end of each nameserver. Some registrars like Godaddy add it for you, and will give you an error if you paste the nameservers with the ‘.’

· So just be aware you may have to make some adjustments to how you copy / paste the ‘.’ depending on the registrar you are using

· Note: It can take several hours for the DNS records to update

Step 3 — Setup Azure Front Door CDN

In this next step you’ll setup a CDN so that in Part 4 you can enable HTTPS routing to your static website in blog storage.

· Go to Azure Marketplace

· Search for Azure Front Door

· Select Front Door and CDN Profiles and Click Create

· In setup select custom create:

In the configuration:

· Give the CDN a name, such as CRCCDNPROD

· Create an Endpoint with the same name if desired

· Add a route to the endpoint

· Enter a route name such as CRCCDNPROD

· Click add a new domain

· In the next screen click add a new origin

· Give the Origin a name such as CRCProd

· In the host name select Storage (static website)

· After you add the origin, you complete the add domain step

· Add the URL into the path with this forward slash like this: /yoururl.com

· Click create, which takes you back to the add route function

· Add the URL into the pattern to match with this forward slash like this: /yoururl.com

· Give the origin group a name

Now that the CDN and endpoint are created and are configured with your static webpage as the origin, you can test it to see if it’s routing correctly. Once the CDN is created in Azure, go to the CDN resource.

Under “Overview” copy the CDN URL endpoint and test it by pasting it into your browser.

If it has been configured correctly, it should pull up your static website hosted in Azure blob storage.

Reference

Buy a domain name — Microsoft 365 admin | Microsoft Learn

Map a custom domain to an Azure Blob Storage endpoint — Azure Storage | Microsoft Learn

Setup Azure DNS for static websites — IT Insights Blog

Disclaimer

This tutorial is not an official Microsoft publication. Sources are indicated in the References section. No warranties or guarantees are implied. Links and instructions may be outdated. Use at your own risk.

--

--