all posts

How to save $40/month by choosing Gatsby and GitHub

Published to Blog on 1 Mar 2018

Gatsby

Now that the clickbait title is out of the way, here are the disclaimers: YMMV. You may not actually save $40/month but I did.

I used to have a lot of personal project sites including this one. A decade ago I switched from hosting a couple of sites individually to paying for a Windows VM so I could host multiple sites easily. I was comfortable with Windows server, IIS, SQL Server, a backup strategy, etc. so it was made sense and was a good decision that worked well for a long time. However over the last couple of years I have been simplifying, letting domain names expire and shutting down those other projects. Recently I was left with just this one. It was running on the .NET stack and used SQL Server to store data. Paying for a VM for just the one site seemed like overkill and I considered moving to Azure or an alternative. But then something else crossed my path.

Static Site?

Over the last few years my focus at my day job has turned from building on .NET to building on Node. Currently I am a lot more comfortable working with Node and Javascript. I try to spend time reading and experimenting with new things, as we tend to do, and I read an article about GatsbyJS. Gatsby is a static site generator built on Node, React and lots of other goodies. At first I thought it was pretty cool but probably would not work for me because I needed a dynamic site. Then I read about how it could import data from sources like Wordpress, Contentful and other CMSes. So I began experimenting and found that Gatsby worked well for my needs.

Once I decided to make the switch I setup a new site on my VM, pasted in the artifacts of the Gatsby build process, and began testing. After I was satisfied I shut down the old .NET site and SQL server and had just the one static site hosted by IIS on my VM. Again, overkill.

Free (kind of) Hosting

I read in the Gatsby docs that Netlify (and Netlify CMS) is a good match for Gatsby sites and that I could probably use it for free assuming my traffic and storage stayed under certain limits (IIRC) so I considered that an option. I also read that using GitHub pages is supported for Gatsby and well documented. Like most of us I already use GitHub, I was not making use of my User/Organization page (danhounshell.github.io), and I was already paying $7/mo for GitHub, and I was already hosting the source for this site on GitHub. So I decided to give GitHub pages a try and it is a perfect fit for me and this site’s hosting needs. After following the instructions on GitHub and in the Gatsby docs for setting up a GitHub page, I updated some DNS records and then promptly cancelled my VM subscription thus saving me $40 per month.

Bonus: Easy Deploys

I am not doing continuous builds or automated deploys, though I could if I wanted. I do not need to – this is just my blog. But life became simpler after switching to using GitHub pages to host the site. My workflow looks like this:

  • Add a new blog posts to my Posts folder
  • run gatsby develop from the CLI to start up the development server and make sure everything looks okay
  • make any necessary changes until I’m content
  • run gatsby build and then gatsby serve and take a final look locally to confirm there were no surprises with the production build
  • run gatsby deploy and then walk away

My deploy script does all the “hard work” of pushing the results of the build to the master branch of my repo, which is the source of the GitHub page. I could even make things easier by going to Netlify, which provides for workflows and would handle the pushes to GitHub source, building and deploying, or using some other automated build and deploy tool. But I am happy where I am for the time being knowing how far I have come.

Hopefully my experience helps you. Give me a shout at @danhounshell on Twitter if it did.


Dan Hounshell
Web geek, nerd, amateur maker. Likes: apis, node, motorcycles, sports, chickens, watches, food, Nashville, Savannah, Cincinnati and family.
Dan Hounshell on Twitter