New Gatsby Blog!

Saturday, May 5, 2018

Gatsby logo

Nearly 3 years ago, I reinvented to be my professional-focused blog. For a while, I was writing a lot, mostly working on the Learning ES6 series. I learned so much writing posts for each of the ES6 features. But then towards the end of 2015 and early 2016, I started getting accepted to speak at conferences like Nodevember, NationJS, NDC Oslo, Front Porch Austin and NodeSummit. I no longer really had time to blog because my time was spent prepping for conference talks. I didn’t even blog in 2017!

Well, while speaking at various conferences, this new library called Gatsby kept coming up. It’s a highly-performant React-based static site generator. I was used to static site generators because my previous blog was Jekyll-based (Ruby). All of my blog posts were simple Markdown files, so I didn’t deal with Jekyll too much, but I still wanted to switch over to Gatsby.

For one, previewing my posts locally before I published live was surprising difficult with Jekyll. I also kind of like the idea of having my blog written in JavaScript & React. Plus, I’m pretty sure that learning Gatsby will help me at Eventbrite because our design system documentation app is a React app that really should be statically generated. Finally, I really just wanted to update the look and feel of my blog.

Here’s how it looked before:

Screenshot of old

It wasn’t terrible. It was based on a Material design theme for Jekyll. There are tons of Gatsby starter kits, including those for blogs. I chose the one you see now: gatsby-starter-personal-blog. It has a lot of slick UX coupled with pretty nice visual design.

The challenge I found with using Gatsby with the starter kit, though, was that I didn’t know where Gatsby ended and where the starter kit started. The kit did a lot for me which was great, but when I was running into issues, I could never be sure if it was just bugs in the starter kit (which there were some). In the end, I was able to get it all working to my liking and migrate over posts. I intend to do more cleanup of the code. Hopefully I’ll contribute some of the fixes back to the starter.

Last thing. For now I will continue to use Github Pages because I’m pretty invested in it for all my other repos, but I am making use of Netlify for CI/CD. I’ve set up deploy previews so that when I create a pull request for the blog repo, I’ll be able to see what it looks like in a “production” environment before actually pushing to Pretty snazzy stuff!

Ben Ilegbodu

Ben is a Christian, husband and father of 2 girls, with a dozen years of experience developing user interfaces for the Web. He currently is a Principal Frontend Engineer at Eventbrite on the Frontend Platform team, focused on improving their React-based design system and frontend infrastructure. Ben also enjoys playing basketball, DIY, watching movies, and tweeting / blogging about his experiences with new web technologies.