React Patterns Course: Hooks, Next.js, Redux & Forms
Learn React patterns from real open-source code: MUI, Ant Design, Redux Toolkit, Next.js and AG Grid. 130+ lessons on hooks, forms, state and rendering, each with the broken first try and the fix.
What you will learn
- Composition: compound components, slots, asChild
- Hooks and concurrent UI (React 18 / 19)
- Forms, stores, routers, and query caches
- Headless primitives and accessibility
- Performance, SSR, and hydration
- How open-source kits actually style
How it works
A failed first try, then the pattern the library actually ships. Source links on every chapter.
MUI composition
React core, 18 and 19
Library internals
Next.js App Router
Ant Design and MUI X
Headless primitives
Stores, search and loaders
Springs and feature layout
Form libraries
Common form patterns
TV UI
Redux Toolkit
Advanced React
Web performance
- lazy + preload
- Request waterfalls
- Yield to main
- CSR blank vs SSR
- React Compiler
- Where LCP time goes
- CLS: reserve the space
- INP: the three parts of a click
- Bundle size: why tree shaking fails
- Put the LCP element on the critical path
- Field data picks the fire
- Make the LCP image discoverable
- Break the render-blocking chain
- Choose preload or preconnect
patterns.dev
CSS in React libraries
AG Grid internals
basics
More courses
- Jobs, linked to lessons — Browse jobs where every requirement links to the chapter that teaches it. See how ready you are, how long the gap takes to close, and which listings look stale.
- Match a job post to courses — Paste a job post. Each skill is matched to a track here and put in learning order, foundations first.
- Database in depth — How a query becomes work. Indexes, isolation, locks, and the plans that explain why a page is slow — not an ORM tour.
- System Design — Eight interview case studies, from a flash sale and Tatkal to a live final and a chat model, plus JWT in separate chapters.
- Microservices — Microservice patterns one diagram at a time: how to split a monolith, how services talk, and how data stays consistent without distributed transactions.
- Kafka — A beginner-to-senior path through event logs, reliable delivery, production operations, and disaster recovery.
- Frontend system design — How a UI is sliced when it is a product, not a page: ownership of state, cache, routes, and what happens when the network lies.
- CSS in depth — See the box, then the page. Visual chapters from the box model through Flexbox surprises, Grid, selectors, and units, then backgrounds, shapes, and visual effects, each with a playground.
- Accessibility — HTML labs first, then a full pass of WAI-ARIA 1.3: naming, every state, widget and structure roles, live regions, ariaNotify, and relationships.
- Docker — What an image is, why layers cache, and how containers find each other on a network.
- Redis — Fifteen Redis patterns, one picture each: cache, session, lock, counter, rate limiter, queue, and when Redis is the wrong tool.