Advanced Typescript for React – Type React Apps that Scale | Udemy

Advanced Typescript for React – Type React Apps that Scale | Udemy
English | Size: 1.74 GB
Genre: eLearning

Learn to use correct TypeScript with React components to build more robust and reliable Typescript applications at scale

What you’ll learn
Typescript advanced patterns and helper utilities
Developing state management hooks with proper Types
Writing types for reducers and actions
Passing props, children, states and actions with efficient type signatures
Creating custom context api for solving Typescript-related issues with Context APIs
Typescript generics and their use-cases in ReactJS
Writing Types only when needed to keep your codebases concise
Using component patterns such as HOCs and custom hooks with Typescript

Hello and welcome to this course on learning advanced TypeScript the React way. What I mean by this is that I am going to teach you how to use TypeScript features in a React-friendly manner.

Being advanced in using TypeScript in ReactJS projects does not entail developing a large TypeScript codebase with numerous complex type signatures scattered throughout your project. In fact, when using TypeScript with ReactJS, you should allow TypeScript to handle the types as much as possible. You should only intervene to define the signatures that TypeScript cannot deduce on your behalf.

In this course, I will guide you through several demo projects to illustrate a set of real-world challenges that you might encounter while developing React apps using TypeScript.

To start, we will review some basics. I will teach you how to leverage IntelliSense to reverse engineer the types that TypeScript may not automatically detect. We will address various common challenges, such as typing props, children, and basic type helpers. This will help you learn how to comfortably migrate a React component from JavaScript to TypeScript.

Next, we will delve into typing states. We will address challenges related to defining state hooks, primarily using useState. This will involve demonstrating a demo project and managing its states by making use of TypeScript features.

Following that, we will explore reducers and action types. We will implement a reducer for a demo project and tackle issues and conflicts that arise with TypeScript and reducer patterns. We’ll cover concepts like passing dispatch actions as props and employing Template Literals to define type signatures.

Directly after that, we will construct a Context API to share certain props. Naturally, we will also explore how to efficiently implement the Context API using TypeScript.

We will also discuss Generics in TypeScript and demonstrate their usage by creating a custom Context API to enhance our codebase.

Finally, we will examine some more advanced TypeScript concepts and features that can assist you in resolving TypeScript-related issues within your ReactJS projects.

By the conclusion of this course, you will feel confident in showcasing your TypeScript skills. You will be capable of crafting efficient and robust React components without falling into the trap of creating unnecessary types and duplicating boilerplate code.



If any links die or problem unrar, send request to

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.