Hosting: Free.
Domain Name: $12/year
Live Site: connorleech.info

Step 1: Buy your domain at Google Domains

Google Domains - Google
Search for and register a domain, get hosting, and build a site with Google Domains. The best of the internet backed by…domains.google
In my case I got "connorleech.info".

Step 2: Create a Static Website

Create a custom blog theme with Hexo.js
Hexo.js is an awesome blogging platform. If you have ever used Ruby's Jekyl it is like that but made of javascript! It…m.dotdev.co
You can do some really fancy stuff with this. I wrote a separate post about how to Create a custom blog theme with Hexo.js. For the purposes of this tutorial we'll Keep It Short and Simple (KISS) by deploying a "hello world" HTML site.

$ mkdir YOUR_GITHUB_USERNAME.github.io
$ cd YOUR_GITHUB_USERNAME.github.io
$ touch index.html

Then make you're super awesome website. Paste the following into index.html. If you are feeling adventurous you could paste some of the sites from HTML5 UP. It's your website so I'll leave that up to you!

Hello Internet!

This is a paragraph.

My github username is connor11528 so my github repo is connor11528.github.io.
Create a git repo and commit your code:

$ git init
$ git add -A
$ git commit -m 'initial commit'
$ git status
On branch master
nothing to commit, working tree clean

Step 3: Create the Repo on Github.com

Click the plus icon in top right and then 'New Repository'
Public repos are free. Leave the README box unchecked. We can create that later.

Step 4: Link your local code to the github repo

Once the repo is created on github we need to connect it to our local files that we created in Step 2. Get the remote url:
Copy that https link (you can use the button on the right to copy)Add that as the remote to your local git repo. It will be called origin and that links to github. You can have multiple remote and push to different place (like heroku) using git.

$ git remote add origin https://github.com/connor11528/connor11528.github.io.git
$ git remote -v
origin https://github.com/connor11528/connor11528.github.io.git (fetch)
origin https://github.com/connor11528/connor11528.github.io.git (push)
$ git push origin master
Counting objects: 58, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (57/57), done.
Writing objects: 100% (58/58), 962.02 KiB | 0 bytes/s, done.
Total 58 (delta 2), reused 0 (delta 0)
remote: Resolving deltas: 100% (2/2), done.
To https://github.com/connor11528/connor11528.github.io.git
* [new branch]      master -> master

Then you only have to wait a couple minutes and your site will be live! Thank you Github Pages. Head to YOUR_GITHUB_USERNAME.github.io to see the live version of your website.

Step 5: Add CNAME file

$ touch CNAME

In my case my domain is connorleech.info so my CNAME file looks like:

• connorleech.info
• www.connorleech.info

Then add the changes to git and push them to your repo.

$ git add -A
$ git commit -m 'add CNAME file'
$ git push origin master

Step 6: Configure DNS for Google Domain

Over at https://domains.google.com/registrar head to the "Configure DNS" tab and scroll to the "Custom resource records" section at the bottom of the page.
Navigate to the Configure DNS tabYou need to add two "@" type A records that point to the GitHub ips 192.30.252.153and 192.30.252.154 and one "www" CNAME record that points to your USERNAME.github.io url

How to point a domain on Google Domains to GitHub pages · Curtis Larson's Blog

Tutorial on pointing a domain on Google Domains to GitHub pageswww.curtismlarson.com

Thank you Curtis Larson (@QuackWare) for figuring this one out!

I was only able to add the one Github domain without an error so it ended up looking like this:
Add custom resource records to our configured domainFinally your site is now live! Check it out. Mine is online at http://connorleech.info/ or connor11528.github.io will redirect to it!

Thanks for reading. You can find me on twitter, linkedin and github where I share code, tutorials and job openings.
If you enjoyed the tutorial please give it a recommend! Thanks again

🚀 If you're a candidate on the job market feel free to create a profile on Employbl 🤝