React

What you'll learn

• Build React components with JSX, props, children, lists and conditional rendering.
• Manage state with useState and useReducer, including batching, updater functions and immutable updates.
• Use effects correctly for synchronisation, with cleanup and protection against race conditions.
• Build controlled forms, share data with context, and extract logic into custom hooks and refs.
• Avoid common bugs and slow renders with keys, memoisation and error boundaries.
• Test components and structure a React project for growth.

Syllabus

React Fundamentals

1. The React Mental Model
2. JSX
3. Setting Up a React Project

Components, Props and Rendering Lists

1. Components and Props
2. Children and Composition
3. Lists, Keys and Conditional Rendering

State and Events

1. useState and Event Handlers
2. Batching and Updater Functions
3. Updating Objects and Arrays Immutably
4. Lifting State Up and Derived Values

Effects

1. useEffect, Dependencies and Cleanup
2. Fetching Data Without Race Conditions
3. When You Do Not Need an Effect

Forms and Complex State

1. Controlled Forms and Validation
2. useReducer for Complex State
3. Form Actions in React 19

Sharing Data and Reusing Logic

1. Context
2. Custom Hooks
3. Refs: DOM Access and Mutable Values

Performance and Correctness

1. memo, useMemo and useCallback
2. Keys and Component Identity
3. Error Boundaries

Testing, Structure and a Checklist

1. Testing Components
2. Project Structure and Tooling
3. A React Code Review Checklist