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 😍