Posts tagged with “eleventy“ (12)

  1. A grid of 6 demos are shown. Each demo has a preview image and a title.

    A glorious demo gallery

    I added a demo gallery to my website. A place to showcase some of my frontend adventures. Coupled with a dedicated RSS feed if you want to follow along!

  2. A simple bar chart is in the center of the frame. The eleventy possum is floating beside it on a balloon. It is cast againt a soft purple background.

    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.

  3. A dark purple upgrade icon, a circle with an arrow pointing up, is in the center of the frame. The eleventy possum floating beside it on a balloon. It is cast againt a soft purple background.

    Eleventy - Is it time to upgrade to version 3?

    Version three of Eleventy has some exciting new features. It is now in beta pre-release. Is it time to upgrade?

  4. A file with the label 'CSV' and an excel-like table as its content is in the center of the frame. It is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    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

  5. A section of a machine is exposed with a series of cogs showing. At the bottom is a RSS icon and at the top is a symbol for an array. It is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    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?

  6. Two different coloured strands of a mesh are twisting together in the center of frame. This is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    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.

  7. A series of posts are grouped by the year 2024 in descending order. The block has a black square bracket as an outline to the left. The first post has a date of 2024 Feb 14 and the second posts has a date of 2024 Fed 12. The title of the image says 'group posts by year. This is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    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.

  8. An exercept of a screenhot shows 2 tabs of a browser sesssion. The first tab shows a green box as the favicon with the text 'home'. the second tab shows a red box as the favicon with the text 'home'. A title says 'dev favicon'. This is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    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.

  9. A card for a GitHub repository is shown in the center in the image that closely resembles the layout on GitHub. The card has a title of 'Eleventy Tutorials' on top, it has a description of 'To the point tutorials on Eleventy' underneath, following by an orange dot beside the word HTML to indicate the language, and a star with the number zero beside it to indicate the number of stars recieved on the repository. This is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    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.

  10. A faint autocompletion scenario is show. The text 'config.' is accompanied with a suggestion list with completions beginning with 'DateTime' highlighted. This is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    Eleventy - Get autocompletion and doc info in your eleventy config in VS Code

    In VS Code, you don’t get autocompletion in your eleventy config. You don’t get info about functions when you hover over them. Here is how you add it.