React & TypeScript – The Practical Guide
React & TypeScript – 实用指南
构建类型安全的 React 应用程序并使用 TypeScript 来增强您的组件、状态管理、Redux 和副作用代码。
教程演示🔗
更多前端教程
What you’ll learn学习内容
-
Learn how to build React apps with TypeScript
了解如何使用 TypeScript 构建 React 应用 -
Get a structured introduction to TypeScript
获取 TypeScript 的结构化简介 -
Use both basic & advanced TypeScript concepts
使用基本和高级 TypeScript 概念 -
Build dynamic & highly flexible components with React & TypeScript
使用 React 和 TypeScript 构建动态且高度灵活的组件 -
Build advanced & highly dynamic components in a type-safe way
以类型安全的方式构建高级和高度动态的组件 -
Use TypeScript with React’s Context API & useReducer() Hook
将 TypeScript 与 React 的上下文 API 一起使用 & useReducer（） Hook -
Manage state and events with React and TypeScript
使用 React 和 TypeScript 管理状态和事件 -
Use TypeScript with Redux for type-safe global state management
将 TypeScript 与 Redux 结合使用，实现类型安全的全局状态管理
Requirements要求
-
Basic React knowledge of core concepts (components, JSX, state) is needed
需要核心概念（组件、JSX、状态）的基本 React 知识 -
NO prior TypeScript knowledge is required
不需要事先具备 TypeScript 知识
Description描述
TypeScript is an amazing technology that helps developers write better code with less errors – simply because it let’s you catch & fix type-related errors immediately whilst writing the code (instead of when testing the application).
TypeScript 是一项了不起的技术，它可以帮助开发人员以更少的错误编写更好的代码——仅仅是因为它可以让您在编写代码时（而不是在测试应用程序时）立即捕获并修复与类型相关的错误。
But using TypeScript with React can sometimes be tricky. Especially when building more complex, dynamic components, defining the right types can be challenging.
但是将 TypeScript 与 React 一起使用有时会很棘手。特别是在构建更复杂、更动态的组件时，定义正确的类型可能具有挑战性。
That’s why I built this course!
这就是我建立这门课程的原因！
This course will teach you how to use TypeScript with React – and, of course, the course will introduce you to all the core concepts & patterns you need to work with components, state, side effects & more in a type-safe way!
本课程将教你如何在React中使用TypeScript – 当然，这门课程将向你介绍以类型安全的方式处理组件、状态、副作用等所需的所有核心概念和模式！
This course will:本课程将：
-
Teach you WHY using TypeScript in your React projects might be a good idea
教你为什么在你的 React 项目中使用 TypeScript 可能是个好主意 -
Introduce you to the key TypeScript concepts you’ll need – when working with React & in general
向你介绍你需要的关键 TypeScript 概念 – 在使用 React 时 & 一般 -
Get you started with using TypeScript with React – for components, state & more
开始将 TypeScript 与 React 一起使用 – 用于组件、状态等 -
Explore more advanced, complex patterns & examples
探索更高级、更复杂的模式和示例 -
Help you with building dynamic or even polymorphic components in a type-safe way
帮助您以类型安全的方式构建动态甚至多态组件 -
Teach you how to use TypeScript with React’s Context API
教你如何使用 TypeScript 和 React 的 Context API -
Explore how you can enhance code used with useReducer() with help of TypeScript
探索如何在 TypeScript 的帮助下增强与 useReducer（） 一起使用的代码 -
Cover data fetching & useEffect() with TypeScript
使用 TypeScript 覆盖数据获取和 useEffect（） -
Use the popular Redux library in a type-safe way
以类型安全的方式使用流行的 Redux 库 -
Build or improve multiple demo projects so that can apply your knowledge
构建或改进多个演示项目，以便应用您的知识
By the end of the course, you’ll be able to use TypeScript in your own (future) React projects and write better, more type-safe code.
在课程结束时，您将能够在自己的（未来的）React 项目中使用 TypeScript，并编写更好、更类型安全的代码。
Course prerequisites:课程先决条件：
-
NO prior TypeScript knowledge is required – though basic knowledge will help (but the course includes an introduction module)
不需要事先的 TypeScript 知识 – 尽管基础知识会有所帮助（但该课程包括一个介绍模块） -
Basic React knowledge (components, JSX, state) IS required – more advanced concepts will be explained though
基本的 React 知识（组件、JSX、状态）是必需的 – 不过会解释更高级的概念
Who this course is for:
本课程适用于谁：
- React developers who want to improve the quality & type-safety of their codebase
想要提高代码库质量和类型安全性的 React 开发人员 - TypeScript developers who want to apply their knowledge to React apps
想要将他们的知识应用于 React 应用程序的 TypeScript 开发人员
更多前端教程
当您构建React和TypeScript的项目时，您将进入一个令人兴奋的领域，这项技术将有助于开发人员以更少的错误编写更好的代码。TypeScript是一项强大的技术，它可以让您在编写代码时立即捕获并修复与类型相关的错误，而不是在测试应用程序时才发现。这就是为什么在您的React项目中使用TypeScript可能是个好主意的原因。
在这门课程中，您将学习如何使用TypeScript构建React应用程序，并获得对TypeScript的结构化简介。我们将深入探讨基本和高级的TypeScript概念，以确保您能够以类型安全的方式开发React应用程序。这将使您能够构建动态且高度灵活的React组件，而且还能以类型安全的方式构建高级和高度动态的组件。
此外，您还将了解如何将TypeScript与React的Context API和useReducer() Hook一起使用，以管理状态和事件。我们还将介绍如何在全局状态管理中使用TypeScript与Redux，以确保类型安全。这将有助于提高您的代码质量和类型安全性。
不需要事先具备TypeScript知识，因为我们将在课程中进行介绍。但基本的React知识（组件、JSX、状态）是必需的。通过本课程，您将能够将TypeScript应用于您的React项目，编写更好、更类型安全的代码。
这门课程还包括多个演示项目，以帮助您应用所学的知识。所以，立即开始，提高您的React项目的质量和类型安全性！
When you embark on the journey of building React and TypeScript projects, you are stepping into an exciting realm. This technology empowers developers to write better code with fewer errors. TypeScript, in particular, allows you to catch and rectify type-related errors immediately during code composition, rather than discovering them during application testing. This is why integrating TypeScript into your React projects can be a highly beneficial choice.
In this course, you will learn how to leverage TypeScript to construct robust React applications, complemented by a structured introduction to TypeScript itself. We will delve into both fundamental and advanced TypeScript concepts, ensuring your ability to develop React applications in a type-safe manner. This equips you to create dynamic and highly adaptable React components while maintaining type safety even in the most advanced and dynamic scenarios.
Furthermore, you will gain insights into effectively utilizing TypeScript in conjunction with React’s Context API and the useReducer() Hook for state and event management. We will also explore the integration of TypeScript with Redux for globally managing application state in a type-safe manner. These skills will not only enhance your code quality but also ensure type safety throughout your projects.
No prior TypeScript knowledge is required, as we will provide introductory modules. However, a fundamental understanding of React (components, JSX, and state) is essential. By the end of this course, you will have the proficiency to apply TypeScript to your React projects, resulting in better, more type-safe code.
This course also includes multiple demonstration projects to help you apply your newfound knowledge. So, without delay, begin your journey to elevate the quality and type safety of your React projects!
