As even a casual perusal of some recent posts to this site could easily make clear, I have become a real fanboy for the Eleventy static site generator (SSG), which I use to create and maintain the site. It offers a tremendous number of advantages over the competiion, and one of those advantages is the simplicity of templating.
For those of you who have no clue what that means and/or why you should give a rip, here’s an extremely simplified explanation.
Adding content to an SSG-generated Web site like this one usually involves giving the SSG a plain-text file, which the SSG then runs through a template to transform it into a Web page. For example, the template may look like the bare bones of the HTML for a Web page but with one or more special “placeholder” variables for the plain-text file’s content. When the SSG does its thing, it turns this combination of the plain-text file and template into Web content.
However, not all SSGs are created equal in this regard.
Watch your language
More often than not, an SSG will accept templating in only one specific computer language. So, if you know diddly about that language and can’t readily pick it up from viewing the code of other people’s sites (where those sites’ code is even publicly viewable in the first place, as this site’s code is), it doesn’t matter what cool things that SSG could have done for you; you’re going to find using it a pain.
No, what you want is an SSG that gives you plenty of templating choices. That, friends, Eleventy does, big-time—right down to even good old vanilla HTML, if you’re so inclined. Of course, some of the choices offer more power than others, and therefore, again, it’s even better to have choices.
Then, about a month ago, I saw word on the Eleventy Twitter feed of a fellow named Reuben Lillie, who had created his site almost entirely with .11ty.js templating. Even cooler: his code is stupendously well-documented. If you’re often disappointed by the documentation in other public repositories’ code, Mr. Lillie’s will make you cry for joy.
I was intrigued, and—with help from not only Mr. Lillie but also fellow Eleventy aficionado Peter deHaan—spent a few weeks working to change my templating from .njk files to .11ty.js files. I finally went live with this templating last Sunday.
Ignorance of the code is no excuse
Plus, I soon realized that, because of my inability to do much with the .11ty.js templates other than slavishly follow others’ examples (and keep begging smarter people for help they didn’t have time to give), I wouldn’t be able to do much with .11ty.js templates going forward. By contrast, I’d frequently tinkered behind the scenes with the .njk templates to see what I could do to make small improvements.
So, after a few days with the sort-of-.11ty.js-based templating setup, I decided to go back to Nunjucks.
Hoping for another try
I remain very interested in the idea of going fully to .11ty.js templates, but will have to wait until the Eleventy documentation more fully supports it with examples for schnooks like me.
If you, too, would like to see that, please note that Mr. Lillie is interested in providing such documentation that could, with the approval of Eleventy creator Zach Leatherman, become part of the official docs.
I hope that happens sooner rather than later. If it does, and if Mr. Lillie’s docs are half as good as the documentation he put in his own code—wowzers.
Update, 2020-04-15—Have now transitioned to full-.11ty.js templating (details).
Saying “SSG-generated” is like saying “ATM machine” or “PIN number,” but I think it’s clearer and more accurate than saying “SSG-based.” ↩︎