Blog (Page 6 of 20)

  1. How to create a slick CSS animation from Jackie Brown

    The title sequence for Jackie Brown is simple but has some 70’s flair. Let’s recreate the reveal animation of the title card.

  2. 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.

  3. VS Code - Why you should always bundle a VS Code extension, and prefer esbuild as the bundler

    Bundled extensions load faster. I would recommend using esbuild as your bundler. Here is why.

  4. 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.

  5. YouTube embeds are bloated - use a lazy loading video or a facade instead

    The average YouTube embed clocks in at over 1MB, and that does not involve loading a single byte of the video. Is there a better way?

  6. 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.

  7. Write that unpopular post

    Do you ask yourself ‘Will this be popular?’ before you write or publish a post? This is my approach.

  8. 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.

  9. Make your RSS feed easy to find, autodiscoverable even

    If you have a web feed, be it RSS or Atom or JSON Feed, help others discover it! Here is how…

  10. 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?