React Fundamentals

Learn React fundamentals with 23 component examples, including basic and intermediate patterns, and quickly set up a new React project.

A step-by-step decision workflow for structuring React components. Walk through each question in order -- your answers determine the architecture, patterns, and composition you reach for.

Learn to write declarative UI with JSX and TSX, using JavaScript expressions that resemble HTML. Understand syntax, fragments, and expression slots.

Learn to build reusable UI components in React using function components, props, children, and composition for clean, efficient code.

Every way to write a React function component - declaration vs. expression, arrow vs. function, default vs. named export, and when each form matters.

Learn to conditionally render UI in React using ternary operators, logical AND, early returns, and extracted variables for dynamic content.

Render dynamic collections in React using lists and keys. Learn to map arrays, filter items, and use Fragments for efficient UI updates.

Respond to clicks, input, and other user interactions with typed event handlers and React's synthetic event system.

Learn to manage user input in React using controlled components, uncontrolled refs, or new React 19 form actions and useActionState.

Learn to use refs to access DOM nodes, store mutable values, and expose child component handles, with examples for focusing inputs and ref callbacks.

Learn essential React fundamentals, including components, JSX, props, state, and event handling, to build robust and interactive user interfaces.

A single-page roundup of every highlight bullet from the 11 pages in the React Fundamentals section, grouped by source page so you can scan all 66 takeaways without opening each article individually.