Rebuilding the blog
This is me upholding the web developer meme of rebuilding my personal site, and writing about rebuilding my personal site!
My main motivation was to add a micro blog with tags, so I’d be incentivised to write short posts instead of long ones. But along the way I did achieve some secondary goals too:
- Try out Eleventy, which I had heard good things about. I had previously used Jekyll and Hugo.
- Simplify to a brutalist high-performance, low-maintenance design.
- Set up email subscriptions using Buttondown.
Designing the URLs:
I spent way too long thinking about URLs. Previously, it was just:
/ |
→ homepage |
/blog |
→ list of posts |
/blog/:post-slug |
→ a single post |
I wanted to separate my “long reads” which are less time-oriented, from my new microblog which is more timely. So I ended up with:
/ |
→ homepage |
/:article-slug |
→ just straight into an article |
/:year |
→ full content of microblog posts in year |
/:year/:post-slug |
→ a single post which happened in year |
I like this because:
- Knocking the slug off a blog post still results in a valid page
- Each year page has a bounded and reasonable size, and you can read all posts without clicking in
- Long reads don’t have a year in the URL, which differentiates them from the off-the-cuff posts
I also added tag pages at /topic/:tag-slug so I can share the whole story of a single topic on one page.
Hosting:
I stayed with CloudFlare Pages because of their green hosting and very snappy deployment pipeline.
Migrating content to 11ty:
Getting my existing blog content into Eleventy was pretty straightforward. There were a few small hiccups, like configuring a different markdown processor to linkify my headings correctly.
Working with Eleventy’s content system was different to the very post-centric workflow I was used to. It seems good though! I’m interested to see if I can bend it to more shapes, like adding book reviews and a sketchbook, like Tom MacWright’s site.
To be done:
- Code block styles/highlighting
- lite-youtube-embed
- Another accessibility pass
- Using my domain as my Bluesky handle (not super relevant but cool)
- Add topics as Atom
<category>tags
Thoughts so far:
Learning Nunjucks to create HTML templates was… let me just say, it’s been a long time since I used a templating engine that wasn’t Blade, and I much prefer it when they just let you embed the host language instead of coming up with their own expression language. “Filters” for everything feels very 2005.
I think I’ve abused the content system frightfully to create a collection of years to generate my blog post year pages from.
That may need to be revised…
or, I could just write more blog posts and not worry about it!