Building with Eleventy

Morning thoughts about @eleven_ty — I’ve talked a little about it, but it’s worth noting that “collections” in Eleventy are a fundamental unit of organization, but they’re also very malleable. (see https://www.11ty.dev/docs/collections/)

The last static generator I’d used (jekyll, natch) was fairly rigid — you could organize things into very explicit collections by folder, you could tag them, or you could iterate through the global collection and filter inside your big ol loop.

11ty lets you define arbitrary collections with whatever filters and sorts you’d like, which is cool! Switching from jekyll, it’s tempting to take the collections it provides (a global one, and tag-specific ones) and manually define equivalents — but that masks the REAL magic…

…AKA, filtering collections. Defining arbitrary filters is pretty easy in 11ty — stuff like “process this text as markdown” or “format this date” is common. But you can also define filters that operate on collections, and take parameters.

The end result: rather than hard-coding a bunch of highly specific collections, you can group them into a couple of big buckets, then rely on expressive filters that put the flexibility in your templates without a bunch of template logic.

For example, on the @autogram_is site, we have one big collection called “clippings” for stuff we’ve written, or stuff that was written about us. Another called “links” contains stuff on other sites we’ve mentioned.

On our bio pages, the content blocks are populated with short snippets like:

{% for talk in collections.clippings | byAuthor(currentBio) | byType(‘talk’) | noUpcoming %}

The result is a LOT of flexibility when tweaking templates without rewriting a bunch of collection code.

It took some early discussions about how we wanted to standardize the frontmatter across a number of disparate types of posts — classic content modeling questions like ‘what do we call that data?’ and ‘will X always have a Y?’ but it pays off.

Now, it’s very easy to pull up an item and format it using any number of layout templates; pull up items with similar tags to the current post but by a different author; show topically related links when we post a discussion…

The super smart folks at @OddBird actually have a public list of a bunch of the utility functions and filters they use in building their site — very much worth checking out for inspiration if you’re about to start one. https://www.oddbird.net/sample/filters/pages/