React Component Library Version 2

A comprehensive guide to migrating from styled-components to CSS Modules in a React component library. Learn about our evaluation process, risk-based migration strategy, compound component patterns, and accessibility improvements. Includes technical examples and lessons learned from building Component Library MKII with Vite and TypeScript.

Position Cheat Sheet

A quick reference for positioning elements relative to other elements when they're not next to each other, or within a common container in the DOM. There are several reasons why this might be the case; mine was rendering a tooltip in a portal in React.

What's with all of the HTML?

The story of why my website is entirely hand-coded in HTML is a short and not very interesting one. Between me and CoPilot it's just faster than installing and configuring a bunch of build tools.

Higher Order Functions

In Scope, Functions and Closures we learned that JavaScript has first class functions and saw examples of functions that both took functions as arguments and returned functions. As with so many things there's a term for functions that can either take a function as an argument or return a function. Such functions are called Higher Order Functions.

Scope, Functions and Closures

It's not my intention to repeat the excellent explanations of others on the subjects of scope, functions and closures (some linked below). Instead this is meant to be a quick code focused reference for the occasions in which I find myself able to share what I've learned with others.