Upgrading my blog to Gatsby + Netlify 🎉

September 04, 2018

Writing content, making site design changes, and deploying new site versions should be fast and simple. Otherwise, I’m spending less time writing content with added cognitive overhead.

My old website was the first site I ever created, and therefore not easy to create content with.

I finally decided to re-build and re-design my site with a tech stack and content management set up I want that would be developer friendly.

TL;DR

I went with Gatsby instead of Phenomic or NextJS due to its:

  • Ease of getting started
  • Simplicity for my needs as a blog
  • Large community
  • GraphQL support

I went with Netlify due to its:

  • Ease of getting started and deploying via GitHub
  • It’s free
  • Supports lambda functions

My needs were:

  • Write everything in Markdown
  • Build everything with React
  • Deploy changes quickly & easiliy

Gatsby, Phenomic or NextJS?

I tried all three of these frameworks when starting out.

Note: these are just my experiences and initial thoughts, not in-depth comparisons comparing the merits of each.

Phenomic

I first went with Phenomic because I valued that it was a less mature project, and therefore more likely for me to contribute to its source code. Getting started with Phenomic was okay, but the documentation and guides at the time weren’t as easy to follow as they could/should have been. I later put less weight on this as a decision-making factor than originally, as I figured I’d prefer to spend free time on other projects.

I knew NextJS and Gatsby were stronger alternatives with larger communities, so I moved onto NextJS.

NextJS

NextJS seemed cool to me because I’m interested in developing server-side apps, and NextJS is currently the main contender in the SSR space.

However, for my needs for a blog, I didn’t find a quick and easy go-to repo to clone that had clean Markdown support. It was a lot of emphasis on markdown-in-js when what I wanted was plain Markdown parsing.

The team was also deprecating the existing markdown plugin in favor of a better one (IIRC to better support my use case of plain Markdown), however, this was all too complicated for me to deal with.

I realized that while NextJS was great for SSR and that I wanted to become more familiar with it, what I really needed was something basic that was best for blogging and that would get me going super fast.

Winner: Gatsby

Gatsby’s docs are great. They’re super simple, detailed, and well organized. They encourage you to download starter projects from which there are a large variety.

I went with [this one] which was a blog starter. I cloned it, and just hacked away.

It’s been the easiest one to work with and the most developer friendly IMO. I think that’s the benefit of it focusing specifically for websites like this one I wanted to work on. While NextJS might be better for full scale apps, Gatsby was a simpler and easier framework for me and my needs.

Next steps

There are lots of things I need to improve for this blog. I spent a weekend’s worth of time working on this, and my intent was to get a minimum V1 set up.

Moving forward there are needs, by priority:

  • SEO optimization
  • Analytics
  • Progressive web app features / better mobile support
  • Design improvements (can be related to previous point)
  • Social Media sharing
  • Categories
  • More blog metadata
  • A/B testing
  • Better image support, thumbnails, etc
  • Tooling to scaffold blog posts easier (automatically writing out the ISO date)
  • Code clean up

Patrick El-Hage

I'm Patrick El-Hage and I live and work in San Francisco. I like to hang on Twitter.