A random background story

I asked a dear friend of mine to make her a website. When I was showing here my personal website, I learned that my Github pages is broken - a rather typical problem. Production issues, anyone? How to mitigate that is a story for another day. Let’s focus on the task at hand.

To that dear friend - I’m making this tutorial as a gift to you.

What’s behind this?

Can you get a website cheaper than 12 dollars a year? The answer is Github Pages + Google Domains.

I trust that you can follow tutorials, and generally DRY is better than not. I’ll only outline the isn’t so obvioius steps.

1. Folow this tutorial, and create a repository
2. You should have https://ghpages-repo.github.io
3. Pick a Jekyll template, following their tutorial and move the code to your github pages repo. Start small your friend, don’t make a ton of changes here yet.
4. Deploy your Github pages for free with Github Actions. You’ll see changes you push to your repo will be reflected to your github pages after a couple minutes.
5. Follow Github Custom Domain tutorial:

You’ll want your settings to look something like

You’ll also want a CNAME file such as

1. Go to your Google domains, set up your DNS mapping

Host name, Type, TTL, Data
<your-website>.com, A, 3600, 185.199.109.153
www, CNAME, 3600, <ghpages-repo>.github.io.

You’ll want to see something like this

Where the heck is the magical 185.199.109.153 from? I’m glad you ask. It’s the result of digging your github pages

$ dig <ghpages-repo>.github.io +nostats +nocomments +nocmd

; <<>> DiG .... <<>> <ghpages-repo>.github.io +nostats +nocomments +nocmd
;; global options: +cmd
;<ghpages-repo>.github.io.		IN	A
<ghpages-repo>.github.io.	3600	IN	A	185.199.109.153
<ghpages-repo>.github.io.	3600	IN	A	185.199.110.153
<ghpages-repo>.github.io.	3600	IN	A	185.199.111.153
<ghpages-repo>.github.io.	3600	IN	A	185.199.108.153

1. Go back to your github pages settings page, type in your new domain and check Enforce HTTPS
2. After configuring all of that, you’ll want to double check your configuration

$ dig www.<customdomain>.com +nostats +nocomments +nocmd

; <<>> DiG .... <<>> www.<customdomain>.com +nostats +nocomments +nocmd
;; global options: +cmd
;www.<customdomain>.com.		IN	A
www.<customdomain>.com.	3600	IN	CNAME	<ghpages-repo>.github.io.
<ghpages-repo>.github.io.	3600	IN	A	185.199.110.153
<ghpages-repo>.github.io.	3600	IN	A	185.199.108.153
<ghpages-repo>.github.io.	3600	IN	A	185.199.109.153
<ghpages-repo>.github.io.	3600	IN	A	185.199.111.153

That’s it. Congrats! You can now play with your brand new personal website and iteratively tweaking it.