Eleventy tutorials (8)

In this series, I will explore the Eleventy static site generator. I will give some guidance on how to make some cool things with Eleventy.

1. Eleventy - Zero JS charts

   It’d be cool to be able to sprinkle in some charts to your website easily. And without a lick of client-side JavaScript.

2. Eleventy - Add CSV data file support

   It would be cool to be able to drop a CSV file into a project and use it in a page. My motivation was to show bookshelves from my library database

3. Eleventy - Convert a RSS Feed to a collection

   I want to create an archive of all my writing. One source is the author RSS feeds of blogs I wrote for. How about I turn it into an eleventy collection?

4. Eleventy - Merge data with an existing collection

   I wanted to make an archive of my writing, merging content I wrote for other websites with my exising ‘posts’ collection. Here is how I did it.

5. Eleventy - Group posts by year

   A common organisation pattern for a blog is to group posts by year. I will show you how to do this efficiently and succinctly in JavaScript.

6. Eleventy - Differentiate between dev and production builds with unique favicons

   It is easy to mix up the dev and production versions of a website in the browser. Let’s make them look unique by using different favicons.

7. Eleventy - Fetch data from the Github REST API to populate a projects page

   We will populate a page with data from GitHub. We will use the eleventy-fetch plugin to do this with minimal code and refresh the data every 2 days.

8. Eleventy - Create a global production flag

   A production flag enables you to run activites in production only e.g. minifying assets. There isn’t a built-in flag in eleventy. How can we add one?