Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

Using Your Own Domain Name

5:04 with Guil Hernandez

If you've purchased a domain name for your website, you can configure it so that it points to your site hosted on GitHub pages.

Teacher's Notes
Video Transcript
Downloads

Further reading

UPDATE – Renaming the default branch from master to main

Resources

GitHub IP addresses

185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153

Video review

When configuring a custom domain name with GitHub Pages you: create a CNAME containing your custom domain name, point your custom domain's A record to GitHub's servers, then wait for the changes to take effect.
To redirect a custom domain to your GitHub Pages site, create a CNAME file that specifies the custom domain.
CNAME stands for 'canonical name'; it's a type of record used for creating aliases for domains.
In the CNAME file is where you specify that a domain name is an alias for another domain.
When creating the CNAME, you need to name the CNAME file in all uppercase letters.
The 'www.' in the domain is optional in the CNAME.
The CNAME can contain only one domain.
An A (Address) record points a domain to one or more IP addresses.
Make sure you read the instructions provided by your domain service before you create an A record.

DNS Basics

Besides being free, one of the best parts about hosting your site with GitHub Pages 0:00

is that you can use your own domain name. 0:04

If you've purchased a domain name for your website, you can configure it so 0:06

that it points to your site hosted on GitHub Pages. 0:09

So, I'm gonna show you how by configuring the custom domain name I own, 0:13

frontendcourses.com, to point to the GitHub Pages server from my site at 0:17

guilh.githug.io. 0:21

That way, when we type the custom domain in the address bar, it will go to GitHub 0:24

pages, but the web address we see will always be frontendcourses.com. 0:28

When configuring a custom domain name with GitHub pages, 0:33

you'll need to follow three simple steps. 0:36

First, create a CNAME file containing your custom domain name. 0:38

Then point your custom domain's A record to GitHub's DNS, then wait for 0:42

the changes to take effect. 0:47

So, first, to redirect a custom domain to your GitHub page's site, 0:49

you need to create a CNAME file that specifies the custom domain. 0:54

So, I'm going to create the CNAME file in the root of my course's directory first, 0:59

then commit the file to my GitHub user pages website repository. 1:05

When creating the CNAME, you need to name the c name file in all upper case letters. 1:11

CNAME stands for canonical name, and it's a type of record used for 1:18

creating aliases for domains. 1:22

In the CNAME file is where we specify that a domain name is an alias for 1:24

another domain. 1:28

So for example, the domain for my website is currently the github domain, 1:30

guilh.github.io, but 1:35

I wanna use my domain name frontendcourses.com as the alias. 1:39

So I need to write that domain name in the CNAME file, and 1:45

that's all you have to write. 1:50

Now the www in the domain is optional in the CNAME, and 1:52

it's important to remember that the CNAME can contain only one domain. 1:55

Once I push the CNAME to GitHub, it will point the GitHub page's domain, 2:00

guilh.github.io to the frontendcourses.com domain. 2:05

Back in the terminal, if I run a git status, 2:10

it lists the new untracked CNAME file. 2:14

So now I'm going to add and commit this file to my local repository by typing git 2:18

add period, and git commit -m, 2:23

and as the commit messages say add see name. 2:28

And finally, I'll push it up to the project's master branch by typing git, 2:33

push, origin, master. 2:37

So now if I go back to my github repository and 2:44

refresh, we can see that the CNAME is now inside the repository. 2:47

Although I created a CNAME file and pushed it up to github, the rest of the web 2:52

doesn't know that my custom domain name points to this GitHub account. 2:57

To do that, I have to update the DNS, 3:01

or domain system record, for the frontendcourses.com domain. 3:04

I can do that by creating an address record, also called an A record. 3:09

An A record is used to point a domain to one or more IP addresses. 3:13

So I'm going to create an A record that points to the domain, 3:19

frontendcourses.com, to GitHub Pages IP addresses. 3:22

You'll usually create an A record through your domain name provider. 3:27

Keep in mind that domain name services are different, so make sure you read 3:30

the instructions provided by your domain name service before you begin this step. 3:34

And I've also posted helpful links about creating A records 3:38

in the teacher's notes of this workshop. 3:41

I registered my domain name with namecheap.com. 3:44

Using namecheap's domain manager I created 3:48

two A records that resolve to these two IP addresses. 3:52

Now, these are the GitHub IP addresses, which you can find on GitHub's website, 3:56

and I've also posted them in the teacher's notes. 4:01

Once I create and save the new domain savings, 4:03

it will map frontendcourses.com to these IP addresses. 4:06

Now, depending on your service, 4:11

it can take up to 25 hours for this to take effect, but 4:13

it's usually much faster, and often within a few minutes, so, let's take a look. 4:16

So, I'll open up a new tab and type frontendcourses.com. 4:21

Great. So, now it points to my GitHub pages site. 4:28

So, that's it. 4:33

My site is now live on the web. 4:34

If you want to learn more about DNS, A records, and CNAME, 4:37

I've posted links to Treehouse videos on those topics in the teacher's notes. 4:41

If you've just set up and hosted your very first website via GitHub pages, 4:46

congratulations that's a pretty big deal. 4:50

Hey, even I still get excited every time I see a new project I built 4:52

go live on the web. 4:55

It's a rewarding feeling. 4:56

So now that you're site is up on the web for the world to see, 4:58

be sure to share your site with the Treehouse community. 5:00

Thanks everyone. 5:03

You need to sign up for Treehouse in order to download course files.

Sign up