React

Compound components are parts that work together and share state through context. Build an accordion, make it flexible, controlled and accessible, and learn when not to.

Build a small router from scratch, so you know what React Router does. Read the address, change it with no page load, match pages, and handle Back, queries and focus.

Measure before you make React faster. Use the Profiler component, React DevTools and the browser’s Performance panel, then find bugs with errors, logs and Strict Mode.

A list of 10,000 rows puts 10,000 tags on the page. Learn to show only the rows that fit in a box, build one from scratch, and see what it costs.

Load a component’s code only when the page needs it, with lazy and Suspense. We measure a real Vite build, then cover preloading, failed downloads and common mistakes.

Some React components run only on a server and send just their result. Learn Server Components, ‘use client’, props that can cross, Server Functions and how to keep them safe.

When a component throws while React renders it and nothing catches the error, React removes your whole app. Learn error boundaries: catch, show a message, try again.

Read a promise while rendering with use, and show a loading message with Suspense. Learn why the promise must be cached, where boundaries go, Transitions and errors.

useOptimistic shows the result of a click at once, while the server is still working. Learn how it falls back when the server says no, lists with a Sending label, and when not to use it.

Pass a function to a form’s action prop, and React calls it with the form’s data. Learn useActionState for results and errors, useFormStatus for a busy button, and the form reset.