TypeScript for FrontEnd developers

JS & TS Fundamentals

Introduction to TypeScript

TypeScript & ViteJS

React and TypeScript

Variable Scopes

Reference vs Value

(⚛) React, useState and Spread

Work with Types

(⚛) React and Types

(⚛) React, strictNullChecks, conditional templates and optional chaining

TypeScript Inference

(⚛) React and TypeScript Inference

JavaScript & TypeScript classes

Arrow Functions

(⚛) React and Arrow Functions

Work with JavaScript Modules

Dynamic Imports

React Components & TypeScript

(⚛) React and useState hook

(⚛) React and Barrel files

(⚛) React Lazy Components

JavaScript API

Template Literals

(⚛) Template Literals in React

(🅰) Template Literals in Angular

(⚛) React Components and Destructuring

Work with arrays

(⚛) React, Map and Arrays

Work with Objects

(⚛) React and Objects

native fetch API (+ React example)

Fetch data with Axios (+ React example)

Promise Combinators

Promise.allSettled (+ React example)

async/await (+ React example)

TypeScript Deep Dive

Modular Interfaces

React and Union Type

Literal Types (& Union)

React and Literal Types

Intersection Types

(⚛) React and Intersection types

(⚛) Components that extends HTML Elements

(⚛) extends img element

TypeScript Utility Types

(⚛) React and Partial utility type

Optional<T, K> (utility-types)

ReadOnly & DeepReadonly

(⚛) React and TypeScript typeof utility

Extract and Exclude

(⚛) React and TypeScript Record utility

(⚛) React and ReturnType

index access type

const assertions (as const)

Template Literal Type

(⚛) React and Literal Types

Uppercase & other String Manipulation types

(⚛) React and Awaited

Narrowing and Type Guards

Narrowing with typeof (+ React Example)

Discriminated Unions (+ React Example)

Type Predicates (+ React example)

unknown parsing and throw errors

fetch, unknown and type predicates

Work with Generics

Multiple generic parameters

Generics & Promise

Generic in Types

(⚛) React and Generic Components - Example

TypeScript & extends

extends and object key

React and Extends Types

Conditional Types

Conditional and Template Literal Types

Distributive Conditional Types

Narrowing with Conditional Types and never

Utility Types & conditional types

Nested Conditional Types

(⚛) React and Conditional Types: real-world example

infer and promises

infer and functions

infer and deep arrays

infer, conditional types and type guards

(⚛) React and infer: real-world example

Bonus Videos: React & Types - Mini course (italian)

React & TypeScript Union Type

React & Literal Types

React and Intersection Type

React & TypeScript Discriminated Unions

React & Types - Mini Video course (italian)

React & Types - Mini Video course (italian)

1 min

Fabio Biondi

Google Developer Expert
Microsoft MVP

Audio in Italian

This chapter is currently available in Italian only

The videos of this chapter are available in Italian only and represent only a quick summary of some of the concepts presented in the book. So don’t worry even if you don't understand italian because you’re not losing any concept!

Send your feedback