Visitar URL original
Now Using 11ty V3 • wonderfulfrog.com

Finally upgrading to the latest version of Eleventy.

Now Using 11ty V3

It feels like I’ve had this baking for far too long. I’m finally using Eleventy v3.

The upgrade process was so smooth. The Upgrade Helper plugin made the transition especially easy, and the only really challenging part was converting all of my JavaScript-related functions to use ESM instead of CommonJS (and that conversion process is opt-in, Eleventy still works great with CommonJS if preferred).

The upgraded version of the Image plugin means I no longer require a shortcode to use, which is great (just plain ol’ Markdown syntax). That said, I decided to add a new markdown-it plugin to give myself a bit more control over image rendering using standard HTML attributes. It works like this:

![](https://path.to.img/myimage.png){width=200}

Thanks to the Image plugin checking the width property (new in v6), this works great! As a convenience for myself, I created two new CSS classes image-shrink and image-tiny that apply percentage widths instead, and can be added using {class=image-shrink}.

I also took the time to give myself a bit of a design refresh. I’m trying to make my personal site reflect my creative developer skills, so I’ve added a dash of flair and fun to the entire site. There is more I’d like to explore, but at some point I had to decide that I’ve done enough or I’d be at it endlessly.

Finally, my Catalogue section has had a major overhaul. Each section has been given it’s own “index page” to help make browsing easier. I was heavily inspired by a bunch of other websites that have similar sections (but especially Cory Dransfeldt). I got sidetracked trying to add all content I could before launching this version of my site, but like the theme updates I had to declare a stopping point before I got carried away. While I was at it I also added some filters for each of the major catalogue sections now to hopefully make browsing easier.

Still missing is my years of music-related content. I used to be a heavy user of Rate Your Music but fell off for some reason. I’ve got a veritable treasure trove of ratings and reviews I could move over (and probably be only slightly embarrassed from my takes 10-15 years ago).

In between all of these upgrades I was testing various CMS solutions to ideally make organizing all this content simple. As before I considered options like WordPress and going headless, but gravitated more towards solutions like Sanity or Contentful. Directus looked interesting as a self-hosted solution too.

In the end though I decided to keep things where I like them: inside Obsidian. Working with flat files makes the most sense to me, even if it introduces a bit of challenge in transforming my notes into a website.

If you’d like to dig into my specific code changes, you can check out the PR. Otherwise, enjoy! Now, what should I work on next…?