React in Depth

A blog series

React in Depth: From Components to Performance

React from the first component to confident senior answers: how rendering really works, state, effects, hooks rules, forms, data fetching, context, performance, patterns, testing and a React interview Q&A. Every example was run.

Started 
2026
Lessons 
10
Reading 
~3 h

Contents

Every lesson has the same steps: what it is, how it works, a real example, common mistakes, then interview questions with answers you can say out loud.

  1. Lesson 00Thinking in React: Components, Props and JSXWhat React is, how JSX becomes function calls, components as functions, props, and the one-way data flow.12 min
  2. Lesson 01State and Rendering: What Really Happens When State ChangesState, re-renders, batching, how React compares trees, keys, and the render-then-commit steps, with a traced example.15 min
  3. Lesson 02Effects and the Lifecycle: useEffect Without the ConfusionWhat an effect is, dependencies, cleanup, why effects run twice in development, and when you do not need an effect.15 min
  4. Lesson 03Hooks in Depth: useRef, useMemo, useCallback, useReducer and Custom HooksEach hook with one small reason to use it, the rules of hooks and why they exist, and how to write a custom hook.16 min
  5. Lesson 04Forms, Events and Controlled InputsControlled and uncontrolled inputs, form actions and useActionState in React 19, validation, and accessibility basics.14 min
  6. Lesson 05Data Fetching, Caching and Server Statefetch in effects and its bugs, race conditions, loading and error states, TanStack Query ideas, and Suspense with use().15 min
  7. Lesson 06Context, State Management and Choosing Where State LivesLifting state, context and its re-render cost, reducers, Zustand and Redux Toolkit at a glance, and a simple decision table.14 min
  8. Lesson 07Performance: Memoization, Lists, Code Splitting and the React CompilerFind slow renders with the Profiler, memo, virtualised lists, lazy loading, transitions, and what the React Compiler changes.16 min
  9. Lesson 08Patterns, Server Components and Testing ReactComposition patterns, error boundaries, portals, Server and Client Components in plain words, and testing with Testing Library.16 min
  10. Lesson 09React Interview Questions With Model AnswersThe questions asked at every level: rendering, keys, hooks, state, performance, and the traps, with first-person answers.18 min

Glossary

40 terms used in this series. Inside any lesson, hover or tap a dotted term to see its meaning without leaving the page. Browse all terms →