How I built this blog

An exploration of minimalism and programming jokes

July 23, 2020 · Felipe Vogel ·

NOTE: You’re reading this on a more recent iteration of my blog. This post refers to the first version from 2020.

Of all the grand plans that a fledgeling developer inevitably dreams up and expands to impossible proportions, the most urgent is (thankfully) the least impossible: to make a blog. The humble blog is the doorway into dreams, the launchpad into the infinity of all the earth-shaking projects soon to be realized. (That’s how it goes in my imagination, at least.)

So I made this blog, and here’s what I learned.

A minimalist static site generator

When it comes to static site generators, Eleventy seems to be the coolest kid on the block these days. But instead I went with zs, which is even more elegantly minimalist. Also it’s more obscure and therefore much more hip.

Here’s what I love about zs:

Here’s a snippet from layout.amber (actually it’s nearly the whole thing):

import siteheader
    h1 #{title}
        {{ lua .zs\postdate.lua }}
            {{ lua .zs\tweetbutton.lua }}

So much zen. title and subtitle come from each post’s YAML headers. The Lua scripts are plugins that I wrote: postdate.lua looks at the post’s filename to extract the date, and tweetbutton.lua creates a tweet link with the current page’s title and URL.

I wrote another Lua plugin to populate the index page with a list of posts, based on the files in the “posts” folder. (In case you haven’t noticed, I love Lua for scripting. Not only is it simple and quick to write, but it has a blazing fast startup time, beaten by only a handful of other languages. Incidentally, the creator of zs also made the luash library for more conveniently using Lua in place of shell scripts. Nice!)

Instead of zs’s default GCSS, I went with Sass and learned some of its neat shortcuts: nesting, mixins, and doing math on variables.

The upshot

Most of all, I learned that creating something simple from scratch can be more joyful than creating something more complex in a system that you don’t understand.

And now writing a new post is a breeze:

Oh, and I had fun finding programming jokes for my mascot owl up above.

👉 Next: Track your reading with read.csv 👈 Previous: Make a custom todo.txt for VS Code 🚀 Back to top