Over at The 260 Bowler I’ve added a handful of diary entries (just blog posts), so now I want a diary page (think recent posts). I started simply, iterating over all the entries, summarizing them, then starting to add nice styles so that they look vaguely like a diary page. I’ll make it look really nice before I move on.

I thought, “Hey! I should show these in reverse order, and then limit then to something like 5 or 10 entries.” When I thought about how to do that, I immediately jumped to writing Nunjucks filters, since that’s how I did things with Jekyll and Liquid. I had in mind something like this:

{% for entry in collections.diary_entries | reverse | limit(5) %}
[...]

I started trying to build some Nunjucks filters, when I realized that I could simply things considerably by writing the whole thing natively in Javascript. (This is one of the primary advantages of 11ty: the configuration is Javascript, which removes 99% of the resistance to extending the “language” of the site.) This opens up the opportunity to do something that we know and love: programming by intention.

Don’t remember what programming by intention means? Click here.

We program by intention when we focus on the overall workflow and defer implementing the parts. We simply invoke the functions or methods that we wish existed, then implement them later. I often find it helpful to do this when I worry about becoming bogged down in the implementation details. Programming by intention relates strongly to the Composed Method pattern that Kent Beck wrote about in Smalltalk Best Practice Patterns.

Programming by intention generally means attending to names, so I started there:

{% for entry in collections.recent_diary_entries %}
[...]

After that, I felt free to express myself completely in Javascript, rather than feel restricted by the syntax of a template language such as Nunjucks or Liquid.

// Inside a function that uses eleventyConfig as a Collecting Parameter

// shouldPublishDiaryEntry :: Post -> Boolean

const collectRecentDiaryEntries = (collection) =>
  collection.getAllSorted().filter(shouldPublishDiaryEntry).reverse();

eleventyConfig.addCollection(
  "recent_diary_entries",
  collectRecentDiaryEntries
);

In this case, I typed in the Obvious Implementation and it just worked.

References

11ty Documentation, “Shortcodes”. A reference on adding shortcodes, which act like library functions.

Kent Beck, Smalltalk Best Practice Patterns. I recommend this, whether you ever intend to write Smalltalk or don’t.

Jeff Langr, Essential Java Style: Patterns for Implementation. If you just can’t read a book on Smalltalk, then read this one, which is very much the same book, but in Java. From 1999. It’s fine.