React Official Tutorial: Quick Start

React's team rewrote their documentation from scratch a few years back, and Quick Start is the front door of that rewrite. It sets itself a specific target — the page says it covers about 80% of the React concepts you'll use daily — and then hits it in one sitting. There is no project, no setup, no build tooling. Just concepts, in order, with editable examples.

What makes it work is the sequencing. Components, then JSX, then styles, then displaying data, then conditionals, then lists, then events, then state, then hooks, then lifting state up. Each one is the smallest possible step from the last, and by the end you've written a component that shares state with a sibling — which is the actual thing most React tutorials fumble.

What Quick Start covers

• Creating and nesting components
• JSX syntax and its constraints
• Styling with className
• Displaying data with curly braces
• Conditional rendering with if, ternaries and &&
• Rendering lists with map() and keys
• Event handlers
• State with useState
• The rules of hooks
• Lifting state up between components

After that it hands you off to the tic-tac-toe tutorial and then to the much longer Learn section, which goes properly deep on rendering, effects and escape hatches.

Why we still send people here first

Because it's the only React resource guaranteed to be correct. The React team writes it, they update it when the recommendations change, and it doesn't carry a course author's opinions from three years ago. The interactive sandboxes on every page mean you can break an example and see what happens, which beats watching someone else type.

The honest weakness: it's austere. No project to show anyone, no dopamine, nothing you'd put in a portfolio. Quick Start assumes basic JavaScript and moves at reading speed, so if you're shaky on array methods or destructuring you'll stall on syntax rather than on React. And it stops short of the things that actually make React apps hard — data fetching, routing, forms at scale — because those live in frameworks the docs deliberately don't pick between.

Who it's for — and who should skip it

Ideal if you know JavaScript and want the mental model quickly and correctly. Also ideal as a re-orientation for developers coming back to React after a few years away, since so much of the older advice is now wrong.

Skip it if you learn by building and need a project to stay engaged, or if you want someone to tell you which router and which data library to use. The docs won't.

Our take

The best free starting point for React, with the caveat that it teaches React the library and leaves you at exactly the point where you need React the ecosystem — and gives you no help choosing. Pair it with a project-based course rather than treating it as the whole education.