Learn React with TypeScript

8 reviews

last updated 17 months ago

Start for Free

This course is up to date, guaranteed

The Numbers

  • 13 Topics
  • 120 Minutes of Video
  • 10,775 Words of Text
  • 11 Quizzes
  • 3 Exercises
  • 2 Projects

The Outline

  • Introduction

    • Introduction, Philosophy, and Tips
    • Projects (What you'll build)

    We'll start the course off with some housekeeping items. You'll learn about the best strategy for getting the most out of the course as well as what you'll build during the course.

  • Built-In React Types

    • Component and Element Types
    • (Quiz) Component and Element Types
    • (Bonus) Intrinsic Elements

    React's type definitions come with some types that we can use in our code to help us model some of the ways that React components and elements interact.

  • Context

    • Context
    • (Quiz) Context

    Context lets you pass values deep into your app, and TypeScript makes it so the types come with them! In this section, we'll learn how to add those types to our context creator, and how to use context in the most helpful way.

  • Configuring TypeScript for React

    • Configuring TypeScript for React
    • (Quiz) Configuring TypeScript for React

    It doesn't take much to set up TypeScript to work with React. By the end of this section, you'll know everything you need to get started.

  • Hooks

    • useState & useReducer
    • (Quiz) useState & useReducer
    • (Practice) useReducer
    • (Solution) useReducer
    • useEffect, useMemo, useCallback
    • (Quiz) useEffect, useMemo, useCallback

    TypeScript makes it so we always use our React Hooks correctly, so we don't have any surprises. We'll dive into the most common hooks.

  • Refs

    • Refs
    • (Quiz) Refs

    Refs are used to store bits of data, including references to DOM elements. TypeScript helps us use these refs in a type safe way.

  • Annotating Components

    • Class Components
    • (Quiz) Class Components
    • (Practice) Annotating Components
    • (Solution) Annotating Components
    • Function Components
    • (Quiz) Function Components

    Components are the heart and soul of React, so we'll learn how to add annotations to props and state for class components and function components.

  • Typing Props

    • Common Props Patterns
    • (Quiz) Common Props Patterns
    • Event Handlers
    • (Quiz) Event Handlers
    • Advanced Props Patterns
    • (Quiz) Advanced Props Patterns
    • (Bonus) PropTypes
    • (Practice) Props
    • (Solution) Props

    Props are one of the most important parts of using React, and annotating them is as easy as adding types to a function. During this section, we'll learn how to model some of the tricker, more advanced props patterns you might find.

  • Project: TypeScript Conversion

    • (Project) Introduction
    • (Project) TypeScript Configuration
    • (Project) API
    • (Project) Hooks, Context, Tooltip
    • (Project) Battle
    • (Project) Card, Nav, Loading
    • (Project) Popular
    • (Project) Results

    We'll apply what we've learned by converting an entire React Hooks codebase to TypeScript.

  • The Love

    This is the part where we're supposed to tell you how great the course is. Even better if we get other "famous" developers to give their "reviews". Instead, we'll let those who have actually taken the course do that.


    8 Reviews

    • Q
      40 hours ago

      Thanks Alex, following on from TypeScript this course has given me the confidence to tackle my next project using TS with React. Lets code !!!!

    • TR
      2 months ago

      The course is awesome!

    • BM
      Ben Millward
      5 months ago

      Really well done, broken down well and easy to understand

    • Avatar for Malak Joseph
      Malak Joseph
      11 months ago

      I hated TypeScript when I dealt with it at work because I didn't know how to use it and only produced red lines! Now, can't say I'm an expert but an app without TS is full of distractions and more complicated! Thanks, Alexander for such a great course!

    • Avatar for Albert Vila Calvo
      Albert Vila Calvo
      14 months ago

      Good course. Exactly what I needed.

    • RN
      Rishi Narang
      16 months ago

      Its's awesome. I got all the doubts cleared in clear and concise manner especially related to useState and useReducer type checking. This coursed has boosted my confidence to use typescript in React.

    • MH
      Matt Henschel
      16 months ago

      Loved the course. It was shorter than the other ones but it still covers everything you'd need to know about React + TS.

    • AC
      Angela Cabrero
      17 months ago

      Was part of the beta group. Really enjoyed this course. It's a solid follow up to the TypeScript course for those who use React.

    Join Us

    Join thousands of ambitious developers who use our courses, community, and weekly events to scale their JavaScript careers.

    Full access to


    • Personalized Onboarding
    • Private Community
    • Weekly Events


    • TypeScript
    • reactReact
    • reactReact Hooks
    • React with TypeScript
    • reduxRedux
    • react-routerReact Router
    • javascriptAdvanced JavaScript
    • javascriptModern JavaScript
    Yearly Subscription
    (or pay monthly for $40)
    Start your free trial