Matt Pocock's Free React TypeScript Tutorial

Matt Pocock's free React TypeScript tutorial teaches typing for hooks, props, events via hands-on exercises. Covers ComponentProps, useRef, and reading React's type defs to debug errors. Bookmark this if your team is adopting TypeScript.
WHY IT MATTERS: Many teams adopt TypeScript in React projects but struggle with practical patterns like typing forwarded refs, extracting HTML props, or reading React's built-in type definitions to debug cryptic errors. Poor typing leads to verbose code, suppressed errors, or any-type drift that slowly erodes type safety across the codebase. When every engineer invents their own patterns for component props and hook return values, code review becomes a debate about style rather than logic. Having a curated, exercise-based tutorial from a recognized TypeScript educator gives teams a common baseline, reduces code review friction around prop interfaces and hook signatures, and shortens onboarding time for developers joining their first TS React project.
WHAT CHANGED: Matt Pocock released a free React with TypeScript tutorial structured as hands-on exercises using StackBlitz or Gitpod, with an option to clone locally for full VS Code features like jumping to type definitions. The material starts with adding TypeScript to a React project and progresses through typing custom component props, supporting children, and overriding event handlers. It teaches how to leverage TypeScript inference rather than fighting it, and introduces ComponentProps to cleanly extract properties from imported components or HTML DOM elements without verbose manual interfaces. The workshop also covers the APIs and typing for useState, useCallback, useEffect, and other hooks. A reader who completed the exercises noted it replaced their verbose daily-use HTML prop patterns with cleaner techniques, calling it their new go-to recommendation for teams starting with TS and React.
WHAT TO WATCH: If you are onboarding developers to a React TypeScript codebase, consider using the tutorial's exercise structure as a template for internal bootcamps or lunch-and-learn sessions. Watch whether your team's pull requests start using ComponentProps and inference-driven patterns instead of manual prop re-declaration, which is a good signal that the material is sticking. Also note that the tutorial recommends foundational TypeScript knowledge and the Beginner's TypeScript Tutorial as prerequisites, so assess whether junior hires need that prep work first before they dive into the React-specific material.
Read the original → totaltypescript.com
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.