Understanding TypeScript
Get started with TypeScript and take a deep dive into all its basic, advanced and important niche features. From the ground up, step by step!
About This Course
What is this course about?
Most people know TypeScript from Angular 2+. It's the language you have to use there, right? It's more than that!
Learn what TypeScript is, why it really is a powerful addition to JavaScript, what its features are and how to use it! And whilst doing so, also understand what you're actually doing in your Angular 2+ code.
This course takes you from the very basics and its most important feature (types!) to the point where you're able to use TypeScript in any of your projects. ReactJS projects included!
As TypeScript is developed by Microsoft and strongly advertised and used by Angular 2+ (Google), it's here to stay. Gain an edge today and be amongst the first to really understand TypeScript!
What You'll Learn
Master TypeScript from the basics to advanced features and real-world workflows:
Types & Compiler
Understand types and how to use them effectively, plus learn how the TypeScript compiler works under the hood.
ES6+ Features
Use next-gen features like destructuring, arrow functions, classes, namespaces, and modules today.
Advanced Concepts
Master interfaces, generics, and decorators to write powerful, reusable, and type-safe code.
Real-World Integration
Learn to use TypeScript with ReactJS, Node/Express, and integrate third-party JavaScript libraries.
A Journey Into the Future
As TypeScript code can be compiled to ES5, you'll be amazed by the many next-gen features you can start using today.
Complete Curriculum
This course goes beyond the basics:
- Types and how to use them effectively
- Classes, interfaces, and generics
- Decorators for meta-programming
- Namespaces and modules
- Third-party library integration
Workflow & Projects
Set up professional development workflows:
- TypeScript-only workflow setup
- Webpack workflow configuration
- TypeScript with ReactJS
- TypeScript with Node/Express
- Real projects and use-cases
Practice What You Learn!
Watching videos is a great way to learn. And to a lot of students, it's the best way. If you also want to practice the things you learn, this course offers you exercises (and solutions) in many of the course modules.
Who Is This Course For?
See The Course In Action
Curriculum
- Welcome to the Course (1:31)
- What Is TypeScript? (2:54)
- Why Would You Use TypeScript? (5:32)
- Compiling TypeScript To JavaScript (6:18)
- Editor & Project Setup (2:11)
- Course Setup
- About The Course (1:40)
- The Academind Pro Referral Program
- How To Get The Most Out Of This Course (3:29)
- Join Our Learning Community
- Module Introduction (1:12)
- Project Setup (2:56)
- Working with Types & Exploring Built-in Types (4:44)
- Vanilla JavaScript Has Types, Too! (2:53)
- Type Inference vs Type Assignment (2:59)
- Assigning Types To Function Parameters (2:45)
- The "any" Type (3:02)
- Understanding Union Types (2:02)
- Arrays & Types (2:28)
- Advanced Array Types (1:56)
- A First Glimpse At Generic Types - Alternative Array Type Declaration (1:46)
- Making Sense of Tuples (3:15)
- Object Types (4:48)
- Tricky: The "Must Not Be Null" Type (2:25)
- Flexible Objects with the Record Type (4:55)
- Working with Enums (6:39)
- Being Specific With Literal Types (5:04)
- Type Aliases & Custom Types (4:13)
- Quiz: Core Types & Concepts
- Function Return Value Types (3:04)
- The "void" Type (1:28)
- The "never" Type (3:16)
- Functions As Types (8:36)
- Quiz: Functions & Types
- null & undefined - Special Types (2:40)
- Inferred null & A First Look At Type Narrowing (3:29)
- Forced "Not Null" And Optional Chaining (5:20)
- Type Casting (4:26)
- The "unknown" Type (5:22)
- Optional Values & TypeScript (2:41)
- Nullish Coalescing (5:36)
- Module Introduction (1:26)
- TypeScript Project Setup & Creating a tsconfig.json File (2:46)
- Exploring tsconfig Options: Target & Libs (5:31)
- Controlling File Input & Emission (5:16)
- Configuring Type Checking (3:16)
- Configuring Code Quality Checks
- Example tsconfig.json & Deep Dive
- Compiling with tsconfig (1:28)
- Using TypeScript's Watch Mode (1:01)
- Installing Type Packages (5:36)
- Module Introduction (1:02)
- What are Classes? (1:23)
- Creating a First Class (6:04)
- A Useful TypeScript Shortcut & Compiling to JavaScript (5:18)
- Making Sense of "public" and "private" (5:47)
- Marking Fields as "readonly" (1:53)
- Understanding Getters (3:31)
- Setting Values with Setters (5:06)
- Exploring Static Properties & Methods (2:30)
- Understanding Inheritance (3:23)
- The "protected" Modifier (2:33)
- Making Sense Of Abstract Classes (4:25)
- Introducing Interfaces (1:38)
- Creating a First Interface (3:57)
- Interfaces As Object Types (1:43)
- Interfaces vs Type Aliases & Understanding Declaration Merging (4:03)
- Using Interfaces To Define Function Types
- Implementing Interfaces (3:10)
- Ensuring Base Types with Interfaces (1:52)
- Extending Interfaces (1:54)
- How Interfaces Get (Not) Compiled To JavaScript (1:00)
- Module Introduction (0:48)
- Introducing Intersection Types (4:36)
- Revisiting Type Guards (5:30)
- Exploring Discriminated Unions (4:33)
- Guards with "instanceof" (2:37)
- "Outsourcing" Type Guards & Working with Type Predicates (3:14)
- The Case For Function Overloads (4:39)
- Using Function Overloads (2:31)
- Rest Parameters & Types
- Working with Index Types (5:02)
- Constant Types with "as const" (2:52)
- Revisiting the Record Type (1:45)
- The "satisfies" Keyword (7:49)
- Module Introduction (0:49)
- A Generic Type We Already Know (1:56)
- Understanding Generic Types (2:01)
- Creating & Using a Generic Type (6:16)
- Generic Functions & Inference (5:09)
- Working with Multiple Generic Parameters (2:00)
- Generics & Constraints (4:03)
- Constraints & Multiple Generic Types (2:42)
- Working with Generic Classes & Interfaces (2:06)
- Summary (1:03)
- Module Introduction (0:48)
- Using "typeof" (4:47)
- Another Great Use-case for "typeof"
- "typeof" & A More Useful Example (4:06)
- Extracting Keys with "keyof" (2:22)
- "keyof" & A More Useful Example (6:26)
- Understanding Indexed Access Types (4:35)
- Accessing Array Elements with Indexed Access Types (3:54)
- Introducing Mapped Types (7:52)
- Readonly Types & Optional Mapping (7:22)
- Exploring Template Literal Types (10:13)
- Introducing Conditional Types (9:26)
- Conditional Types - Another Example (6:04)
- Making Sense of the "infer" Keyword (7:28)
- TypeScript's Got You Covered: Built-in Utility Types (2:57)
- Module Introduction (0:51)
- What Are Decorators? And ECMAScript Decorators vs Experimental Decorators (7:09)
- Exploring Different Types of Decorators (1:17)
- Building a First Decorator (8:09)
- Building a Class Decorators That Edits a Class (5:25)
- Understanding Decorator Code Execution Order (3:07)
- Creating a Method Decorator (4:17)
- Using Decorators To Solve A Common Problem (4:09)
- Implementing A Decorator-based Solution: autobind (3:44)
- Replacing Methods with Decorators (3:38)
- Introducing the Field Decorator (4:43)
- Building Configurable Decorators with Factories (4:01)
- Onwards to Experimental Decorators (0:40)
- Module Introduction (1:55)
- A First Class Decorator (5:21)
- Working with Decorator Factories (2:02)
- Building More Useful Decorators (5:59)
- Adding Multiple Decorators (2:52)
- Diving into Property Decorators (5:00)
- Accessor & Parameter Decorators (5:36)
- When Do Decorators Execute? (3:11)
- Returning (and changing) a Class in a Class Decorator (8:37)
- Other Decorator Return Types (3:44)
- Example: Creating an "Autobind" Decorator (9:04)
- Validation with Decorators - First Steps (7:28)
- Validation with Decorators - Finished (12:14)
- Wrap Up (3:21)
- Fixing a Bug
- Useful Resources & Links
- Module Introduction (1:32)
- Getting Started (5:20)
- DOM Element Selection & OOP Rendering (11:43)
- Interacting with DOM Elements (8:03)
- Creating & Using an "Autobind" Decorator (4:44)
- Fetching User Input (9:14)
- Creating a Re-Usable Validation Functionality (14:10)
- Rendering Project Lists (11:18)
- Managing Application State with Singletons (15:32)
- More Classes & Custom Types (7:11)
- Filtering Projects with Enums (5:59)
- Adding Inheritance & Generics (18:40)
- Rendering Project Items with a Class (11:58)
- Using a Getter (3:33)
- Utilizing Interfaces to Implement Drag & Drop (10:24)
- Drag Events & Reflecting the Current State in the UI (5:58)
- Adding a Droppable Area (8:08)
- Finishing Drag & Drop (6:44)
- Wrap Up (1:22)
- Useful Resources & Links
- Module Introduction (1:24)
- Writing Module Code - Your Options (2:34)
- Working with Namespaces (10:50)
- Organizing Files & Folders (8:41)
- A Problem with Namespace Imports (2:52)
- Using ES Modules (12:20)
- Understanding various Import & Export Syntaxes (4:57)
- How Does Code In Modules Execute? (1:43)
- Understanding "type" Imports (2:16)
- Wrap Up (3:14)
- Useful Resources & Links
- About This Section
- Module Introduction (1:01)
- What is Webpack & Why do we need it? (5:32)
- Installing Webpack & Important Dependencies (3:55)
- Adding Entry & Output Configuration (5:57)
- Adding TypeScript Support with the ts-loader Package (7:00)
- Finishing the Setup & Adding webpack-dev-server (3:33)
- Adding a Production Workflow (4:04)
- Wrap Up (1:40)
- Useful Resources & Links
- Module Introduction (1:09)
- Facing Problems with JS Libraries in TS Projects (3:43)
- Bridging the Gap with @types Packages (4:40)
- Exploring .d.ts Files (6:43)
- Diving Deeper Into .d.ts Files
- Using "declare" Manually
- There Are Libraries With Great TypeScript Support! (2:21)
- Exploring Zod as a TypeScript-first Library (8:02)
- Defining a More Complex Zod Schema (4:25)
- Runtime vs Compile-time Types with Zod (4:16)
- Module Introduction (1:22)
- Creating a React + TypeScript Project (4:08)
- Typing Components & Props (5:47)
- Using Components & Props (2:47)
- TypeScript, The Special "children" Prop & Optional Props (3:01)
- Adding Another Component With Props (4:03)
- An Alternative Component Function Type Syntax (2:30)
- Working with State & TypeScript (2:05)
- Passing Functions As Props (5:15)
- Handling Form Submission (4:43)
- Using Refs with TypeScript (5:40)
- More Function Passing & State Updating (4:05)
- Wrap Up (1:06)
- Module Introduction (0:55)
- Node + TypeScript - You Have Multiple Options (3:52)
- Project Setup & Configuration (7:23)
- Adding Node.js Types & Running a Basic Server (3:28)
- Adding & Using Express.js (and its Types) (3:27)
- Managing Data With Help Of TypeScript (8:28)
- Adding & Testing a First Route (with Data Extraction) (9:38)
- Finishing the Basic App (11:39)
- Native Node.js TypeScript Support Without Compilation (incl. tsconfig Setup) (7:28)
- Type Stripping vs Type Transformation (9:01)
- Considering Alternative Runtimes (1:44)
Course Prerequisites
Here's what you need to get the most out of this course
- Basic JavaScript knowledge is required
- NO prior TypeScript knowledge required
All pre-requisites are covered by courses in our "Academind Pro" Membership.
Your Instructor
Maximilian Schwarzmüller
Founder & Instructor
Self-taught developer with 3,500,000+ students and 900,000 YouTube subscribers. I co-founded Academind with Manuel Lorenz to help people master new skills and build amazing projects.
Join 1609 happy students!
Choose the plan that works best for you
Single-Course License
Full access to "Understanding TypeScript"
This is a one-time payment that grants access to this course only, not to any other courses.
Academind Pro Membership
Unlimited access to this and all other current & future courses!
This is a recurring payment. You can cancel anytime from your profile. For more info, contact Academind.
Continue Your Learning Journey
Expand your skills with these hand-picked courses that complement what you'll learn here.
