The good, the bad, the web components
An excellent overview of the current state of web components, including suggestions on how they could be […]
Archives
PWA quickstart
An interesting – albeit flawed – attempt at a zero-dependencies, web standards focused, PWA based UI framework, and a potentially useful quick-start template for using web components and native […]
Compare front end framework code patterns
A brilliant site for comparing common component patterns across most of the major front end frameworks. Want to learn Svelte and already know React? Select both, pick the pattern you're wanting to […]
One Neat CSS Trick
Using pseudo-selectors like :where and :not to invert style rules, allowing for better code encapsulation and context sharing across a codebase.
HTML web components
An excellent look into the new trend of no-or-low-JavaScript web components, which almost operate more like HTML fragments, with graceful fallbacks to native elements. Jeremy proposes terming these […]
There's a web component for that
The Component Kitchen is a sort of app store for web components; a digital directory of useful packages, recipes, and one-shots that can be imported into your […]
TypeScript string literal arrays
A useful trick when working with tokenised values is that you can generate an "immutable tuple" within a "const context" (computer science gibberish overload 😂) and reference that. So if you have […]
React modal using <dialog> element
An extremely detailed overview of how to use the native <dialog> element in React to build a state-driven modal component. As ever, the answer is significantly more complicated than it would be […]
Track design system use & adoption
A new tool that allows an organisation to check how, where, and why components are being used across shared codebases, and gain insights into their usage and […]
Styling on the Server
The increasing use of React Server Components is meaning the end of the CSS-in-JS era. But what options exist to fill that gap? I've been pleasantly surprised with what I've found.
Making sense of React Server Components
A superb breakdown of the changes being made in React 18+ around the new React Server Components paradigm. Josh has a knack for explaining complex problems in simpler ways, and this is no exception; […]
React server components tips
A quick overview of React Server Components and some of the mental models that are useful when thinking about how they might be applied, in […]
Modern CSS for dynamic component-based architecture
A lovely overview of much of the new CSS that has landed (or is landing) in browsers recently, and how that relates to component-led […]
The modern way of serving images
A very thorough overview of how to write a modern, performant, HTML-driven image component that is as optimised to serve the most appropriate image as possible. There are some very neat tricks in […]
Inclusive tabbed interfaces
I've been digging into tabbed interfaces ("tabs") recently. As usual, Heydon's Inclusive Components has one of the best overviews and write-ups of the techniques used. I particularly love […]
Clickable Confusion with NVDA
Understanding why non-interactive Storybook components are often announced as clickable by NVDA and other screenreaders.
Styled Component Quirks
Styled Components have tripped me up a few times today, but I ended up learning some useful tricks as a result.
Stacks of stacks
Heydon's video is an excellent overview of their much-loved owl selector and "stack" layout pattern. I actually didn't realise that Heydon was the original "inventor" of the owl, though it makes a […]