Type your React code: props, state, hooks, events, and generic components.
You can already write React. You can manage its state, design its components, and split them into pieces a team can reuse. What you cannot do yet is tell anyone, including yourself in six months, what any of it expects. That is the gap this course closes, and it closes it without asking you to learn a new framework: every line you write here is React you have already written, with a second description of itself attached.
You start with what an annotation actually is and, more importantly, when it is checked, because the browser preview beside you compiles TypeScript by deleting it and a learner who does not know that will misread every result for the rest of the course. From there it is props, optional values and children; unions that let a component have exactly three variants and no fourth; state that cannot contradict itself; the event objects that trip up every React developer in their first week; and the hooks where types stop being decoration and start being useful, because a reducer's switch that narrows its own action is the moment most people decide this was worth it.
The last sections are the ones that separate an annotated codebase from a described one. You write a component that works for any item and keeps knowing what that item was, model data arriving from a server you do not control, and learn exactly what an assertion promises and what it does not. You do all of it on Crew Kit, the component library you finished React Patterns with, which ends this course as Crew Types: the same kit, every file converted, one shared types module, and nothing left that only you understand.
47 Lessons • 51 Practices • 18 Quizzes • 4 Projects · ~10h Total
Not just theory. You finish this course with real work to show.
This is the same in-browser editor every lesson uses. Edit the code, hit Run.
Run code in the browser and see the result immediately. Every lesson works this way.
Stuck? Puff explains the error and nudges you forward, without giving the answer away.
Streaks, diamonds, and certificates. Your progress saves automatically, forever.
Every completed course issues a certificate with a public verification link.
Every certificate has a public verification link employers can check.
One certificate per course. Finish a program and earn its program certificate too.
LinkedIn-ready, with a PDF you can download and attach.
You write React fluently and the listings keep adding one more word. This course adds it to the code you already write, not to a tutorial app.
You have pasted the pattern, it worked, and you moved on. Here you find out what it declares, why react.dev stopped showing it, and what to write instead.
You hit a red underline you could not read, added `any`, and never went back. Reading an error is a skill, and this course spends a whole section on it.
React TypeScript is free to start, no credit card needed. Some later sections are part of Pro, and finishing every section, including the certificate, needs a Pro plan.
No. React TypeScript on Devpuff starts from what a type annotation is and assumes nothing beyond the React courses before it. It is a TypeScript course written for people who can already write React, so nothing new happens in React while you learn it.
No, and the course says so in its first section rather than letting you find out later. The preview compiles TypeScript by deleting the annotations, so a wrong type still runs. Everything you write is real TypeScript that a real editor and a real build will check, and the course points you at where that checking lives.
No. React TypeScript runs entirely in your browser, with React 18.3.1 and a real bundler. There is no terminal, no npm install, and no build configuration to set up.
Because typing a reducer's action union, a context value, and a custom hook's return is where TypeScript stops being annotations and starts being useful, and none of those three exist until Advanced React has taught them. Taking TypeScript earlier would type props and state and then leave the hardest parts untyped for four courses.
Crew Types: the Crew Kit component library from React Patterns, converted file by file to TypeScript, with typed props, state, events, reducers, context, refs, custom hooks, a generic list component, and one shared types module the whole kit imports from.
Yes. Finish every item in React TypeScript and Devpuff issues a course certificate with a public verification page and an ID you can put on a CV or a LinkedIn profile.
How this course connects to the bigger picture, and what to explore next.
Give your React app real URLs: routes, links, params, nested layouts, and protected pages.
Start programming for real: variables, strings, decisions, arrays, loops, functions, and objects.
Free to start, no credit card required. Write real code from the first lesson and keep your progress forever.
Start Learning FreeCompose, split, and speed up React components: children, compound components, boundaries, and Suspense.