my site stack

Sep 3, 2017
3 minutes to read

Note: This article has been updated throughout time, with its latest edit in November 2019

I feel like this is the Hello World! post for every/any developer who’s managed to set up a blog with a static-site generator. Since I’m an avid generator-hopper, I’ve broken this post down to different eras:

But first…

…static sites?

I’m an avid advocate of KISS and that should also apply to your tech stack. Now, that doesn’t have to mean that you wear a tinfoil hat and command people to FTP files labelled index-old-old-old.html to your production server. But it does mean doing away with the technical overhead that your stack might be haunted by.

A great place to usually start is your project’s/company’s public website. Or a (marketing?) landing page you manage. Or even a complex app, because nowadays you can JAM-ify anything.

Since I really do love the JAM stack (and alongside it, anything static-first or progressively enhanced), I feel it’s my duty to quickly sell you on some benefits.

Metalsmith

This was my first hands-on experience with a SSG. I had looked and fiddled with Jekyll before, but to me it wasn’t really approachable or hackable, since (being a simple front-end developer then) Ruby was rather foreign to me. But Metalsmith clicked. It was simple enough out-of-the-box and had a whole universe of possibilities circling around it with its rich plugin ecosystem. I also really liked how it taught you from the getgo to write plugins on your own and there really was no magic to it. I have even published one on my own.

Metalsmith was actually my first step into the magical world of running JavaScript outside of the browser. I remember feeling such power and enthusiasm. It was truly me falling head-over-heels in love with programming all over again.

But as with most relationships, time changes its parties. As my Metalsmith config grew, so did the build times. And it was a bit limiting on the browser side. Adding turbolinks and messing with page transitions ultimately worked to achieve my goal, but at a hefty cost. After avoiding updating my home page for a bit over a year, Metalsmith didn’t pass my Do you get what's going on in this pigsty? test.

Vuepress

When Vuepress was announced, I went bonkers for it. I immediately hopped on the early beta release and refactored my whole repo.

It was not a great fit though. More on this later.

Eleventy

More on this soon.

Saber

I currently use (and love!) Saber. It strikes a perfect balance in easy setup and what it can achieve as a framework. I cannot wait for it to mature even further (given how young the project is). Definitely more on this Soon™.

Bonus round: