JavaScript, when is this?
JavaScript’s “this” keyword trips up all developers — junior and senior. In the first of two parts, Mat Marquis goes deep on the groundwork you need to better understand “this” and how it works.
Simplify sharing with built-in APIs and progressive enhancement
Instead of leaning into heavy social sharing widgets, you can create a truly user-friendly social sharing component that works for everyone, using built-in APIs and progressive enhancement.
What I learned from migrating a Vue project from Vuex to Pinia
Big refactors and migrations for key infrastructure like global state are not to be taken lightly. Michelle Barker is here to show us how she did exactly that — migrating from Vuex to Pinia for global state in a huge, single page app — using a pragmatic, considered approach.
A guide to destructuring in JavaScript
Mat “Wilto” Marquis walks us through JavaScript destructuring, the rest syntax and spread syntax in a jam-packed guide.
A handful of reasons JavaScript won’t be available
It’s always safe to assume JavaScript will not be available, so here’s a quick list of very realistic reasons it won’t be.
Event currentTarget to the rescue
A really quick tip to hopefully save you from throwing your computer out of the window due to JavaScript events.
A CSS project boilerplate
For the many folks who ask how I write CSS since removing Sass, this is how I and the Set Studio team do it in 2024.
It feels like React is getting a bit of a kicking recently
I talk about an apparent attitude shift in attitude towards React in the community and also make some recommendations about decision-making for your projects.
Low-tech Eleventy Categories
Eleventy has built-in tagging and collections capabilities that I’m riffing on to show you how to build a super simple category system with RSS feeds for each one.
Convert a 2D array into a flat, 1D array of unique items
Convert a messy multidimensional array into a nice single dimension array of unique items.
Build a fully-responsive, progressively enhanced burger menu
In this premium tutorial, we’re going to build a burger menu from the ground up, using progressive enhancement, ResizeObserver, Proxy state and of course, super-solid HTML and CSS that pull from the CUBE CSS principles.
Load all focusable elements with JavaScript
A handy helper function that will load all user-focusable elements inside a parent element for you.
Build a light and global state system
Using Proxies and subscriber functions, we can create an observable, reactive state system with a tiny footprint.
Create a user controlled dark or light mode
Automatic dark and light themes, based on system user-preferences, are handy but in this tutorial, we take that one step further and give our users control.