TypeScript with React
Type props, children, state, refs, reducers, events, context and custom hooks, then build generic and polymorphic components the compiler keeps honest.
TypeScript is JavaScript plus types: little labels that say what kind of value each variable, prop and function expects. A program called the type checker reads those labels before your code runs and points at mistakes, such as a misspelled prop, a number where a string belongs, or a value that might be null. Most professional React code is written in TypeScript, and most React job interviews assume you can read and write it.
In this phase you'll set up a React + TypeScript project with Vite and learn to read the compiler's messages. Then you'll type everything a component touches: props and children, props borrowed from real HTML elements, useState, useRef and useReducer (with action types the compiler checks for you), events and handler props, context with a safe guard hook, and custom hooks. The last topic builds the components libraries are made of: generic lists and selects, a polymorphic as prop, props that change shape with a kind field, and the satisfies operator.
One rule runs through every topic: types are checked while you write, and erased when the code runs. The live examples here are real TSX, but the preview strips the types without checking them (like Vite does), so every type error is shown next to the example with the exact message the real tsc compiler prints. You'll learn what types can promise, and the places (like data from a server) where they can't.
Practise this phase
Hands-on exercises: write the code, see your page live, and press Check to have it tested automatically.