Build a Blog with Github - Part 1

- 12 mins

How it all started

I’ve owned my personal domain name for a while now, but never got around to putting anything up. As someone previously in the corporate finance world, I didn’t have any particular information or portfolio pieces I needed to put up on a personal site that LinkedIn couldn’t handle.

Once I started to feel the need for a blog, $50-$100/year in hosting fees just felt like too much for a blog that I planned on updating occasionally and only when I had something substantial to document online.

Then I joined GitHub, and realized they allow you to host a personal blog/site, and map it to a custom domain.

Problem solved!

Or so I thought.

It’s when I started to really wade deep into setting up a Github personal site and blog that I realized it can be fairly intimidating to a non-programmer. I know just enough HTML and CSS to be dangerous and break things, which makes me the kind of adventurer that will start full throttle with a project like this, and get pretty far down a path before realizing I need to start over (several times).

At this point, I’ve got this at a stable enough state that I can call it a minor success. Some of you may want the journey with the dead ends because you can learn a lot from those - I know I learned quite a bit from all the paths that didn’t work out.

That said, there are probably a lot more of you who would like a minimalist portfolio site with a blog, hosted for free, mapped to your personal domain, as quickly as possible.

So, without further ado, here’s the process that’s got me this far.


Everyone needs a starting point

… and for that, I thank Joshua Lande for his excellent post that gave me a general map to get started with.

1. Buying a domain

I had bought my domain several years ago on GoDaddy, and every time I renewed it, I re-upped for the longest possible time, so that part was set.

There are a lot of articles recommending good domain name registrars and telling you what to watch out for - everything ranging from customer service, transfer fees, selling your info to shady marketers and so on. I’d read these and do your research, especially if you find a new registrar with a great price on the domain you want, but no reviews to go on.

GoDaddy is the better known brand name, but another company I’ve seen recommended quite often is NameCheap.

     a. Private Registration

With most of the registrars out there, you pay one price per year for registering the domain, and another extra charge per year to protect your privacy, so they don’t put your name and address up publicly as the owner of the domain.

I always tack on the extra private registration charge, and GoDaddy and most other bigger companies often have good coupons and deals if you’re ready to commit to your domain for a long time.

     b. Google and Amazon are in this business too

Google Domains is a new entrant in the field, and it looks like they have a flat annual registration price starting at $12+ and free private registration. For a basic, non-premium domain, that’s a fair price, if a tad expensive in comparison to what you could pay at a bigger registrar after coupons/promotions - but you know for sure you’re getting a known entity with Google. Here’s a good review on Google Domains that covers a few other aspects I wasn’t aware of -

Same goes with Amazon 53’s domain name registration - their pricing schedule lists a flat $12/year with free private registration for .com domains. See here for the announcement

     c. Bottomline on buying domains

Basically, make sure the following is squared away:

2. Setting up your Github repository

This was one of those paths I mentioned earlier that led to a dead-end and a do over. You may end up having to do things over even after I’ve given you a heads-up, but hey, that’s the fun of this.

Let me back up a little.

So, you need to do the following to get set up on GitHub:

Now here’s a couple of reasons why I had to start over.

Lessons Learned - Forking a Repo

If you are starting with an existing github theme, especially one that’s being actively worked on, the developer of the theme may want you to ‘fork’ the theme from their repository. It creates a link from your repository to theirs, and you can also update your copy of it when they make changes to their theme.

Lessons Learned - Modifying a Theme’s Structure

I also figured I could pretty easily modify an existing blog theme that had the blog on the front page, to something that had a landing page + a link to the blog page. I ended up chasing my tail for several weeks before I decided to look for a theme already set up the way I wanted, and start over with that.

The theme I ultimately went with is the Indigo theme by Sérgio Kopplin.

Option 1 - Fork an existing repository

Option 2 - Start with an empty repository and copy a .zip theme file or DIY it

Bonus section for Option 1

If you have the patience for some git code, this will help set up a back end connection between your repository and your source theme repository, so that any changes made by the theme developer will show up in your GitHub Desktop as a clickable button that says ‘Update from sourceuser/sourcerepo’.

Note - You may not always want to make every change, especially if it overrides customizations you’ve made, but it helps when the theme developer adds new features or fixes bugs.

GitHub Help articles to get started with:

$ cd Github
$ cd
$ git remote -v
origin (fetch)
origin (push)
$ git remote add upstream
$ git remote -v
origin (fetch)
origin (push)
sergiokopplin (fetch)
sergiokopplin (push)
upstream (fetch)
upstream (push)
$ git fetch upstream
 * [new branch]      gh-pages   -> upstream/gh-pages
$ git merge upstream/gh-pages
Already up-to-date.

3. Redirecting your domain (DNS Nameservers) to point to GitHub

I dusted off my logins to GoDaddy, and after following David Ensinger’s post recommended in the article above, Setting the DNS for GitHub Pages on Namecheap and Andrew Sturges’ post on Configuring a Godaddy domain name with github pages, I had successfully redirected my domain to point to GitHub.

4. Creating a CNAME file

So, if you finished the step above to redirect your domain, you must have created or updated the ‘CNAME’ of your domain. GitHub doesn’t know what your domain is, so you now have to create a file in your new repository to connect it up from this end.

This would be a good time to download TextWrangler (Mac) or Notepad++ (Windows) or your advanced text editor of choice, if you don’t already have it installed. It’s a more advanced version of TextEdit / Notepad, and you will need this going forward if you want to maintain your blog.

You now have a live website.

Stay tuned for how you can modify content, add new pages, set custom post URLs, create a hidden draft feature, add tags, and create a dynamic tag index in the part 2 of this post.

Here’s Part 2 of this post

Arti Annaswamy

Arti Annaswamy

Data analytics, process improvement, project management, coffee drinking

comments powered by Disqus
rss facebook twitter github youtube mail spotify instagram linkedin google pinterest medium vimeo