TypeScript + React = ❤️
summary
TypeScript eliminates concrete React bugs: missing props cause compile errors, props are required by default so omitted values fail fast, and mistyped prop names or renamed fields break the build. Function handlers get full argument and return types, discriminated unions forbid invalid dependent-prop combinations, and use Omit to override DOM props when wrapping native elements. Generic components make render-prop item types precise, generics give strongly typed render props. Slides and resources are on the linked site.
AI-written summary · about
chapters (17)
- 0:00Intro
- 2:40React Components
- 3:31Props
- 4:01Passing Props
- 4:55Prop Types
- 5:43Optional
- 6:01Change Prop Name
- 6:41Nested Shape
- 7:38Proptypes
- 7:59TypeScript
- 8:46Advanced Pattern
- 9:36Invalid Configurations
- 11:20Type Safety
- 12:41New Props
- 14:45List
- 18:08Resources
- 19:59Outro
related talks
49mTypescript + React
15mTypeScript Patterns for Better React Components
18mTypeScript Patterns For Better React Components
42mTypeScript Patterns for Better React Components
57mTypeScript for React developers
01h 25mWorkshop: TypeScript Plus React = Love
28mBuilding Considerate React Component APIs with TypeScript
21mHow Typescript Can Power Design Systems