Description
In this course, you will :
- Learn how to integrate TypeScript with React to increase productivity and create easier-to-maintain apps.
- How to use TypeScript's sophisticated type system to speed up React development and make your code more readable.
- How to create strongly-typed component props, state, and events, allowing you to quickly understand what you can pass and avoiding mistakes.
- Set up React projects with TypeScript.
- How to do this with the Create React App tool, then how to create a React and TypeScript project with Webpack and Babel.
Syllabus :
1. Why TypeScript?
- Understanding TypeScript
- Understanding the benefits of TypeScript with React
2. Using basic types
- Understanding the types in JavaScript
- Using type annotations
- Understanding type inference
- Understanding the any type
- Understanding and using the void type
- Using the never type
- Using the unknown type
- Using type assertions
3. Creating types
- Creating a strongly-typed array
- Creating a strongly-typed tuple
- Creating a strongly-typed object
- Creating type aliases
- Creating interfaces
- Creating union types
- Creating intersection types
- Understanding type compatibility
4. Working with generic types
- Using some standard generic types
- Creating generic functions
- Creating generic interfaces
- Creating generic type aliases
- Creating generic classes
5. Creating strongly-typed function component props
- Specifying a type for function component props
- Specifying a prop as optional
- Specifying a default for a function component prop
- Specifying a type for an object prop
- Specifying a type for a function prop
6. Creating strongly-typed function component state
- Creating strongly-typed function component states with useState
- Creating strongly-typed function component state with useReducer
7. Creating strongly-typed class components
- Creating strongly-typed class props
- Creating strongly-typed class state
- Using access modifiers
8. Creating strongly-typed component events and event handlers
- Creating strongly-typed event handlers
- Creating strongly-typed events
9. Creating strongly-typed context
- Creating a simple strongly-typed context for function components
- Creating a complex strongly-typed context for function components
- Consuming a context in a strongly-typed class component
10. Creating strongly-typed refs
- Creating strongly-typed refs in function components
- Creating strongly-typed refs in class components
11. Creating React projects with TypeScript using Create React App
- Creating a basic project
- Configuring linting and adding autoformatting
- Running tests and producing a production-ready build
12. Creating a React and TypeScript project manually
- Creating a basic project
- Adding React and TypeScript
- Adding Babel
- Adding code linting and autoformatting
- Adding Webpack
- Adding npm scripts
13. Putting everything together
- Exercise
- Tips