• Using Flow Diagrams to Manage State in Complex Applications

    A few days ago I blogged about managing state in Vue apps with Vuex modules. I’m currently grappling with some fairly complex state management in a Vue app, and I wanted to share a bit about my process and how I’ve made it more manageable.

    Read more

  • Published on MDN

    Getting Started with Container Queries

    As of this year, container queries are supported in all major browsers. But what are they, and how can we use them to build more robust, flexible layouts? Do we still need media queries? Let's find out.

    Read it on MDN

  • Quick note

    The Joy of Lists

    I’m a big fan of lists. I like to think of myself as a fairly organised person. I make lists for a lot of stuff, at work and home, and get a little kick out of crossing things off. Yes, I’m one of those people who add tasks to a list post-completion, just for the pleasure of seeing it crossed off. This sounds completely pointless, but it’s actually a good motivator! I’m more motivated to tackle the rest of the list if I already have the sense of achievement that comes from already-completed tasks.

    Read more

  • Demo

    Radial Gradients and CSS Trigonometric Functions

    I’ve been playing around with layering radial gradients in CSS to create flower shapes, with the help of CSS trigonometric functions. For a primer on what trigonometric functions are, and why they’re useful in our code, I’ve written a three-part series for Codrops.

    Read more

  • Better Vue Application State Management with Vuex Modules

    If you use Vue you might be familiar with the state management library Vuex. It used to be the state management library recommended by Vue, until the team developed Pinia. But lots of applications still use Vuex, including the one I work on. This post contains some tips for handling state in a Vue app with Vuex. Some familiarity with building with Vue and Vuex will be assumed.

    Read more

  • Quick note

    Programming as a Craft

    Last week I had the pleasure of attending FF Conf in Brighton. I was partly inspired to go to the conference after watching a talk from last year’s event: Programming With Yarn by Lily Madar.

    Read more

  • Stop Using AI-Generated Images

    Recently I’ve been doing some front end development work for a lovely project that showcases original short stories submitted by writers and climate change activists. Most of the stories are accompanied by an illustration specially created by an artist. One story did not have an accompanying image, so the author suggested using an illustration produced by an AI image generator.

    Read more

  • CSS Nesting is Here

    In case you missed it, nesting is now supported natively in CSS in all major browsers! Nesting is a popular feature of preprocessors like Sass and has been, in my opinion, on of the main reasons to keep using preprocessors. But with nesting supported natively, it might soon be time to consider dropping a preprocessor altogether.

    Read more

  • NaN or Not a Number?

    Following yesterday’s post on handling null, undefined and zero values in JS, I was asked on Mastodon:

    Read more

  • Quick tip

    Handling Null, Undefined and Zero Values in JavaScript

    In JS, it’s easy to get caught out when determining if a variable is null, undefined, or has a value of zero. I do a lot of data visualisation, and quite often I’ll need to filter out null values from an array of data.

    Read more

  • (Don’t) Mind the Gap

    I don’t see people using the gap property for flexbox out in the wild all that often, but it’s pretty cool!

    Read more

  • Quick note

    Leaving Twitter Behind

    It’s been a year since Twitter (X) went down the pan, and I finally got around to removing the Twitter link from this site. I haven’t visited the platform in months, except periodically, guiltily checking that I haven’t missed an important DM. I never post there, and the occasional fleeting glimpse of my feed is enough to convince me I’m not missing much.

    Read more