Setting up a custom domain in CloudFront
Tags: aws, cloudfront, tutorial
Published: 2020-02-15 22:13:45

A beginner-level tutorial to demonstrate how to set up a custom domain in CloudFront, with a managed SSL Certificate and DNS via Route 53.

> _This post is part of a wider series documenting my journey in migrating a traditional LAMP website over to a Single Page Application running on the Amazon Web Services platform. Here, I will focus on configuring a custom domain for my CloudFront distribution._

**CloudFront** is Amazon’s low-latency Content Delivery Network (CDN). Using a CDN speeds up the distribution of content to visitors by serving content from edge locations that are closest to the user.

![Delivering content from Amazon S3 using CloudFront edge locations](https://dev-to-uploads.s3.amazonaws.com/i/0ipsqoh569wcs5bw6sly.png)
<figcaption>Delivering content from Amazon S3 using CloudFront edge locations</figcaption>

At the time of writing, Amazon has 216 Points of Presence (205 Edge Locations and 11 Regional Edge Caches) in 84 cities across 42 countries.

<hr>

When you set up your CloudFront distribution, straight out of the box with the default settings you will have your own **cloudfront.net** domain.

![](https://dev-to-uploads.s3.amazonaws.com/i/vg78uhblyysabbgqd40a.png)

_(that is assuming you have already configured CloudFront in front of an S3 bucket that holds your static web content, but if not check out this guide on [serving static content from S3 using CloudFront](https://medium.com/@davelms/serving-static-content-from-s3-using-cloudfront-and-origin-access-identity-c8ca667b3d71) and come back)_

{% link https://dev.to/davelms/serving-static-content-from-s3-using-cloudfront-and-origin-access-identity-1o8a %}

But what if you want to serve your content from **my-custom-domain.com**.

To use a custom domain requires a combination of **Route 53** — Amazon’s highly available and scalable cloud DNS web service — and some additional configuration CloudFront. It doesn’t take too long to set up.

Before we start, I assume that you have your domain managed in Route 53; it doesn’t matter if you don’t, but this guide assumes you do.

<hr>

There is an initial step to obtain an SSL Certificate within **Certificate Manager**. This allows you to serve your content over https and is a service provided by Amazon for free, and they’ll also take care of its renewal.

Within the Certificate Manager service, **make sure you change your region to North Virginia**; I cannot emphasize this one enough as it’s caught me out many a time. Then **Request a Certificate**.

The form is pretty self explanatory and you’ll need to provide a means to prove you own the domain — if you’re using Route 53, and we assume you are, then selecting the option that Amazon automatically manages the validation is the simplest approach. The process usually takes a few minutes.

<hr>

Now head over to CloudFront and set up your custom domain. This can be done at the time of creating the distribution, but don’t worry if you forgot — you can go back and edit all these settings later. 

The first setting is to list all your **Alternative Domain Names** in the CloudFront distribution settings.

![Add all your domain names to CloudFront distribution settings](https://dev-to-uploads.s3.amazonaws.com/i/1p3eb3o4ombl9wsirfvx.png)
<figcaption>Add all your domain names to CloudFront distribution settings</figcaption>

The second setting is to reference the SSL Certificate you created. Check the **Custom SSL Certificate (example.com)** option and pick your SSL Certificate from the list. Warning; your Alternate Domain Names must match those you specified in the SSL Certificate provisioning request — so if you don’t see your certificate in the list, that is probably the reason.

With these settings done, the final step is to configure the DNS in Route 53.

<hr>

In your domain hosted zone in Route 53, select to **Create Record Set**.

We will be creating as an **A record** for IPv4 and we’ll select the **Alias** option.

In the **Alias Target**, you will find your CloudFront distribution — select and save. Warning; your Alternate Domain Names you configured in CloudFront must match the record set name — so if you don’t see your CloudFront distribution in the target drop down list, that is probably the reason.

![](https://dev-to-uploads.s3.amazonaws.com/i/fbiq9t2vh9dd4yrs93fo.png)

Repeat to create an **AAA record** for IPv6.

And that’s it. Success. You will find that you;

:heavy_check_mark: are now able to view your website using **my-custom-domain.com**, with all the added benefits of CloudFront providing edge locations around the world to reduce latency for your visitors.
:heavy_check_mark: have an SSL Certificate that is managed by Amazon and will be automatically renewed for you (at the time of writing, it’s **free**).

![](https://dev-to-uploads.s3.amazonaws.com/i/u1qhzoipbwlmohtm5qy4.png)

<hr>

**Variations**. If you don’t use Route 53, the final step will be to add a CNAME entry in your DNS settings and set the value to your CloudFront domain.