Course Overview

Chapter 1, Context API. React Fundamentals introduced context in one lesson; this chapter takes it further on a small store page. You create a context, provide a value that comes from state, and read it with useContext or with the newer use function. You then combine context with useReducer to share a shopping cart. The last lesson explains where context fits and where it does not, measures how a value that changes often re-renders every reader, and shows why a provider value that is a new object on every render does the same.

Chapter 2, Memoization. Chapter 1 ends with components that re-render even though their data did not change. Memoization means saving a result so that the work does not have to be repeated, and this chapter applies it to rendering with memo, useMemo and useCallback. Each technique is shown with render counts before and after, and the useCallback lesson returns to the context provider from chapter 1 to remove its extra renders. The last lesson turns on React Compiler, a build tool that adds memoization automatically, runs the chapter's examples through it, and explains where it changes the chapter's advice.

Chapter 3, Concurrency. Some renders are slow even after memoization, and while React renders them, the page cannot respond to typing. This chapter shows why the input freezes and how concurrent rendering lets React interrupt a slow render to handle a keystroke first. It teaches useTransition, including async functions inside a transition, and useDeferredValue, and it compares the two. Both rely on the memoized components from chapter 2.

Chapter 4, Code Splitting and Lazy Loading. The chapter moves from rendering speed to download size. A small admin application is split into separate files that the browser downloads only when the user needs them. You use lazy and Suspense, call import() directly to load a library on demand, catch a failed download with an error boundary, and split pages with React Router's lazy route property. The last lesson treats error boundaries in full: how a boundary keeps one failing widget from removing the whole page, how to reset it, where to place it, and which errors it does not catch.

Chapter 5, React Query. Data that comes from a server behaves differently from state that a component owns, and this chapter treats it separately. It uses TanStack Query, the library that most people still call React Query, to fetch, cache and refresh that data. You declare queries with useQuery and follow one cache entry from its first request until it is deleted. A separate lesson changes server data with useMutation and query invalidation. The last lesson uses the Suspense boundaries and error boundaries from chapter 4 for data, first with React's use function and then with useSuspenseQuery, and compares that style with the loading checks used earlier in the chapter.

Chapter 6, Forms. This chapter starts from the browser's own FormData object and then uses the form features that React 19 added. You pass a function to a form's action prop, track results and pending state with useActionState and useFormStatus, and show a message before the server confirms it with useOptimistic. Form actions are built on the async transitions from chapter 3. Two lessons then work on a larger sign-up form. The first compares validation by hand, with Formik and Yup, and with React Hook Form and Zod. The second adds rows that the user can add and remove, a server check that waits until the user stops typing, and a form split into steps.

Chapter 7, Redux. This chapter returns to shared state, this time stored outside the React tree. It builds a to-do app with plain Redux first, through actions, reducers, the store, the React bindings and middleware, so that you can see what each part does. It then rewrites the same app with Redux Toolkit, the officially recommended way to write Redux. The last lesson adds memoized selectors and entity adapters, and loads the to-dos with RTK Query, which it compares with React Query from chapter 5.

Chapter 8, Designing Custom Hooks. React Fundamentals showed how to write a custom hook; the last chapter treats hooks as a design tool for the store page. You decide when to extract a hook, choose its arguments and its return value, keep the functions it returns stable with useCallback from chapter 2, and let a linter check the rules of hooks. You then build hooks from other hooks: one over the cart context from chapter 1, and one that owns the query key of a React Query search from chapter 5. The chapter ends by testing hooks with renderHook.

The tools the examples use

The examples use React 19, and each project is created with Vite, a build tool that starts a development server and produces the production files. Chapter 2 adds the React Compiler plugin in its last lesson. Chapter 4 uses React Router and the react-error-boundary package, chapter 5 uses TanStack Query v5, and chapter 7 uses Redux Toolkit with React Redux. Chapter 6 uses Formik, Yup, React Hook Form and Zod in its lessons on complex forms. Chapter 8 uses the eslint-plugin-react-hooks linter rules, and it runs its tests with Vitest and React Testing Library. Each lesson shows the install command for any package it adds.

Older tutorials often use Create React App, ReactDOM.render or the react-query package. The course replaces each of these with its current form, and a lesson points out the older form where you are likely to meet it in existing code.

Assessments

Each chapter ends with an assessment. Chapters 2, 4, 5, 6 and 7 each hold 20 questions, and every attempt draws 10 of them. Chapters 1, 3 and 8 each hold 12 questions, and every attempt draws 6. Every question has four options and one correct answer, and every option comes with an explanation of why it is right or why it is wrong. Each question also has a hint that points to the deciding idea without giving the answer. The questions ask you to apply what the chapter taught to a situation, such as predicting which components re-render after a click, rather than to repeat a sentence from a lesson.