Trevor Morris 8 posts

I've been tinkering with a new Eleventy project and decided to fire it up using the 3 beta version.

After organising Eleventy filters, shortcodes etc I had an idea to tidy the code even more and make it dynamic. I wanted to automatically import any new functions that were added, including new when using files.

If you're building up a custom Eleventy collection using addCollection, you may need to use existing filters to create the desired data.

I work a lot with the Laravel framework, which scaffolds much of your initial setup and has conventions for where code should be stored. Starting a brand new Eleventy project from scratch doesn't give you this boilerplate and means you have to make decisions about where everything lives.

When working with dates in JavaScript, you probably reach for a library to help you parse, manipulate and display the values. For a recent Eleventy project, I used Luxon – the successor to the popular JavaScript date/time library Moment.js.

I recently took an existing codebase and ported it over to Eleventy. The main purpose was to recreate the website with existing markdown files and CSS. Creating the collections and templates was the bulk of the work, but I also needed the CSS to work.

For a small Eleventy-based project, I wanted to output an example.json file – stored in the data folder – in a Nunjucks template. If you simply output the variable example, you'll see the unhelpful [object Object] text.

I have recently been building a few websites using Eleventy. This is a static site generator, built using Jamstack methodology.