The Senior Frontend Engineer's Companion
The reference I wish I had when I started building apps for millions of users.
Core principles
Foundations
Core principles that shape how we build for the web.
All 6 foundations-
Accessibility as a Foundation
Why accessibility belongs in your architecture from day one instead of being retrofitted later.
-
Component-Driven Architecture
How frontend development moved from page-based thinking to component-based thinking.
-
Logical Separation of Concerns
Understanding the evolution from separating technologies to separating logical boundaries in component-based architectures.
-
Performance as a Foundation
Performance belongs in the architecture from day one, instead of being bolted on after users start complaining.
-
Resilience by Design
Build systems that keep working when things fail, by designing for failure and recovery from the start instead of adding error handling at the end.
-
The Progressive Enhancement Mindset
Build resilient web applications that work for everyone, even when failures occur.
Decision guides
Guides
Comprehensive guides to navigate complex frontend decisions.
All 11 guides-
Accessible Interaction Playbook
Guide to making interactive UI accessible through focus management and screen reader announcements.
-
Building with Progressive Enhancement
Guide to building web applications that keep working for everyone, whatever their browser supports.
-
Choosing a CSS Strategy
Decision framework for selecting between BEM, CSS-in-JS, Utility-first, and CSS Modules.
-
Choosing a Frontend Framework
Decision framework for selecting between React, Vue, Svelte, Angular, and other frontend frameworks based on real-world criteria.
-
Choosing a Networking Style for Realtime Apps
Decision framework for selecting between polling, Server-Sent Events, WebSockets, and CRDTs based on your application's realtime and collaboration requirements.
-
Choosing a State Management Approach
Decision framework for selecting between local state, lifted state, dependency injection, and global state libraries based on application needs.
-
Designing Component APIs
Decision framework for choosing between props, slots, render props, compound components, and other patterns when designing component interfaces.
-
Managing AI Response States
Patterns for handling the thinking and streaming states of a language model response, and the interruptions that can cut it short.
Full library
Patterns
Reusable solutions to common frontend development challenges.
All 41 patterns