From Metalsmith to Eleventy

A Natural Progression

For the past several years, Metalsmith has been my static site generator of choice. I built client sites with it, created starters, wrote plugins, and lately published the Metalsmith Redux blog series. Metalsmith taught me a lot about how static sites work under the hood. Its transparent, pipeline-based architecture forces you to understand every step of the build process. It also helped keep my sanity amid the framework explosion that has inundated developers.

That understanding doesn't go away when you move to a different tool. It travels with you.

I recently rebuilt my art website using Eleventy, and I want to share why I made that shift and what it looked like in practice.

Why Move?

Metalsmith is elegant. Its core idea—files in, transformations applied, files out—is as clean as it gets. But elegance alone doesn't sustain a project. The community has thinned, plugin maintenance has slowed, and I've found myself solving problems other ecosystems addressed years ago.

I wasn't looking to abandon Metalsmith. I was looking to apply what I'd learned somewhere with more momentum.

Eleventy turned out to be that place. It shares Metalsmith's philosophy of transparency and simplicity, but with a larger community, active maintenance, and sensible defaults for the things I was rebuilding from scratch in every Metalsmith project.

What Carried Over

The component architecture I developed for Metalsmith—frontmatter-driven sections, co-located styles and scripts, dynamic template composition—wasn't tied to Metalsmith at all. It was a Nunjucks pattern that happened to run on Metalsmith.

Porting it meant writing an Eleventy-compatible bundler plugin and adjusting some variable names. The components themselves, all fifty-plus of them, work in both environments. I've since published them as a standalone library at nunjucks-components.com, available for any Nunjucks-based static site generator.

The build pipeline I'd copied from project to project in Metalsmith? Most of it is built into Eleventy. Less to maintain, fewer decisions to make on each new project.

What's Different

Eleventy's data cascade takes some getting used to. In Metalsmith, you explicitly pass data through the pipeline and into templates. In Eleventy, data from _data files is available automatically in templates. This is convenient but requires understanding the cascade's inheritance rules.

Nunjucks macro scope isolation works the same way—macros don't inherit template scope—but Eleventy's richer data environment means you think about it differently. I settled on passing a single context object to macros rather than long parameter lists, with data files organized under _data/data/ to keep namespacing clean.

What's Next

This post is the first in a short series. I'll follow up with the story of how the component library turned out to be platform-agnostic—an accidental abstraction that made the migration possible—and then walk through the actual process of porting my art website, including building a bilingual version and implementing SEO using Eleventy's native capabilities.

Suppose you're a Metalsmith user, exploring other options: how skills or mental models transfer, you're not starting over; you're applying what you know in a new context.

And if you're happily building with Metalsmith: keep going. It still works. The choice to move isn't about Metalsmith being wrong—it's about finding where the momentum is for the kind of work you want to do.

Scroll to top