Building with Eleventy
I know, I know. I just did this at the start of the year and I usually try to give myself at least a year between rewriting the blog but I just left Glitch and this is always a fun weekend project. It’s always just a weekend, right?
My personal site has had a journey over the last few years, one that isn’t dissimilar to what has been “hot” in front end. It was a NextJS site, then Remix, then Astro.
Why Eleventy now? Well, I just helped rewrite the Glitch Blog to use it, and found it a delight. It’s been especially easy because of the newer webc template language, which replaces some of the older template languages like handlebars and nunjucks. It’s a wrapper that makes creating web components much easier (to me) than even something like lit.
It makes writing components feel just as natural as writing any other single file component:
<script webc:setup></script>
<style webc:scoped>
:host {
background-color: steelblue;
}
</style>
<p>This is an eleventy webc component!</p>Over the last few days I worked at rewriting my blog and getting it to the place that I’d like, with all of the right eleventy plugins working all in the right way. I had a little bit in memory from the recent Glitch work, but it’d already faded (it’s only been a week 😭).
Fortunately, eleventy-excellent was here to save the day. Created by the incredible Lene Saile (the click sound on her light/dark mode is so good) it saved me a lot of work. She’s already started on a v3 that uses the webc template language, so I’ll likely just continue on top of that work.
You’ll probably see pages shifting as I customize and change things, but I couldn’t have started without this package 😍
