Reference · 40 terms
Glossary
Every short form used across the series. Inside a lesson, hover or tap any dotted term to see the same entry in place.
React basics
- JSXJSX
- A syntax that looks like HTML inside JavaScript; a build tool turns each tag into a function call that returns an element.Lesson 0 →
- one-way data flowOne-way data flow
- Data goes down from parent to child as props; events go up through functions the parent passed down.Lesson 0 →
- propsProps
- The read-only inputs a parent passes to a component, collected in one object.Lesson 0 →
- pure componentPure component
- A component that gives the same output for the same inputs and changes nothing outside itself while rendering.Lesson 0 →
- React componentComponent
- A function that takes props and returns UI; its name starts with a capital letter.Lesson 0 →
- Strict ModeStrict Mode
- A development-only wrapper that renders components twice and re-runs effects once to expose impure code and missing cleanup.Lesson 0 →
State and rendering
- keyKey
- A stable, unique identity for a list item or component that tells React which is which between renders.Lesson 1 →
- re-renderRe-render
- React calling your component function again, usually because its state or its parent changed.Lesson 1 →
- reconciliationReconciliation
- How React compares the new tree of elements with the old one to decide what to change in the DOM.Lesson 1 →
- stateState
- Data a component remembers between renders; changing it with a setter makes React render the component again.Lesson 1 →
Effects and hooks
- custom hookCustom hook
- Your own function starting with use that calls other hooks to share logic, not state.Lesson 3 →
- dependency arrayDependency array
- The list of values an effect or memo uses; React re-runs it only when one of them changes.Lesson 2 →
- stale closureStale closure
- A function that remembers an old value of a variable from the render where it was created.Lesson 2 →
- useEffectEffect
- Code that runs after render to keep something outside React in sync with props and state, with an optional cleanup.Lesson 2 →
- useReducerReducer
- A pure function (state, action) => newState that keeps all the ways a piece of state can change in one place.Lesson 3 →
- useRefRef
- A stable { current } box that survives renders; changing it does not cause a re-render, and it can hold a DOM node.Lesson 3 →
Forms
- controlled inputControlled input
- A form field whose value comes from React state through value and onChange.Lesson 4 →
- optimistic updateOptimistic update
- Showing the expected result right away while the server request is still running.Lesson 4 →
- uncontrolled inputUncontrolled input
- A form field that keeps its value in the DOM; you set defaultValue and read it with FormData or a ref.Lesson 4 →
- useActionStateuseActionState
- A React 19 hook that returns the result state, an action to pass to a form, and a pending flag.Lesson 4 →
Data fetching
- AbortControllerAbortController
- A built-in tool to cancel an in-flight fetch; the cancelled fetch rejects with an AbortError.Lesson 5 →
- query keyQuery key
- The array a cache library uses to name one piece of data, such as ["user", 1].Lesson 5 →
- race conditionRace condition
- A bug where the result depends on which of two things finishes first, such as an old slow request arriving after a newer one and overwriting it.Lesson 5 →
- server stateServer state
- Data whose real home is a server, so the copy on screen can be old, shared, late or missing.Lesson 5 →
- staleTimestaleTime and gcTime
- In TanStack Query, staleTime is how long data counts as fresh and gcTime is how long unused data stays in the cache.Lesson 5 →
- SuspenseSuspense
- A React component that shows a fallback while something below it, like a promise read with use(), is not ready.Lesson 5 →
State management
- prop drillingProp drilling
- Passing a prop through many components that do not use it, only to reach one deep component.Lesson 6 →
- React contextContext
- A React feature that lets a parent give a value to every component below it, and re-renders every reader when the value changes.Lesson 6 →
- reducerReducer
- A plain function (state, action) => newState that gathers all the rules for how a piece of state changes.Lesson 6 →
- selectorSelector
- A function that picks one part of a store so a component re-renders only when that part changes.Lesson 6 →
Performance
- code splittingCode splitting
- Cutting your JavaScript into several files that load only when needed, in React with lazy and Suspense.Lesson 7 →
- memoReact.memo
- Wraps a component so it skips rendering when its props are shallowly equal to last time.Lesson 7 →
- React CompilerReact Compiler
- A build-time tool that adds memoization to components and hooks automatically.Lesson 7 →
- transitionTransition
- An update React may interrupt so urgent work like typing stays smooth; useDeferredValue gives a lagging copy of a value for the same goal.Lesson 7 →
- virtualisationVirtualisation (windowing)
- Rendering only the rows you can see plus a few more, instead of every row in a long list.Lesson 7 →
Patterns and testing
- error boundaryError boundary
- A class component that catches errors thrown while rendering its children and shows a fallback instead.Lesson 8 →
- hydrationHydration
- React attaching event handlers to HTML the server already produced, by running the same components in the browser.Lesson 8 →
- portalPortal
- Renders children into a different DOM node while keeping them in the same place in the React tree, so events still bubble to React parents.Lesson 8 →
- Server ComponentServer Component
- A component that runs only on the server or at build time and never ships its code to the browser; 'use client' marks where client code starts.Lesson 8 →
- Testing LibraryTesting Library
- A family of tools for testing UI the way a user uses it, by finding elements by role, label and text.Lesson 8 →