Understanding TypeScript - 2023 Edition
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 used by Angular 2+ (Google), it's here to stay.
More
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. Be it ES6 Features like Destructuring or Arrow Functions, Decorators, Generics and Interfaces or Modules - TypeScript has them all!
In this Course, we'll not stop after the Basics. You will learn about more advanced Features and also how to set up Workflows with TypeScript. This includes a TypeScript-only Workflow as well as a Webpack Workflow.
You'll also learn that you're not limited to Angular 2+ or plain JavaScript/ TypeScript Projects. A complete Module covers how to use TypeScript with ReactJS to benefit from its Features, there, too.
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.
So much Content!
I'm not a Fan of these Courses which teach you the Basics and then leave you alone. In this Course you'll get insights into:
Types and how to use them
How the TypeScript Compiler works
ES6 Features in TypeScript
Classes in TypeScript
Namespaces and Modules
Interfaces
Generics
Decorators
How to integrate Third-Party JavaScript Libraries into your TypeScript Project
How to set up a TypeScript project with Webpack
Or how to set up a plain-TypeScript Workflow
How to use TypeScript together with ReactJS
How to use TypeScript together with Node/ Express
Real projects and use-cases!
Watch Online Understanding TypeScript - 2023 Edition
| # | Title | Duration |
|---|---|---|
| 1 | Welcome to the Course! | 01:56 |
| 2 | What Is TypeScript & Why Should You Use It? | 04:34 |
| 3 | Installing & Using TypeScript | 13:23 |
| 4 | TypeScript Advantages - Overview | 03:06 |
| 5 | Course Outline | 04:18 |
| 6 | How To Get The Most Out Of The Course | 03:14 |
| 7 | Setting Up A Code Editor / IDE | 03:07 |
| 8 | The Course Project Setup | 07:21 |
| 9 | Module Introduction | 00:27 |
| 10 | Using Types | 10:21 |
| 11 | TypeScript Types vs JavaScript Types | 04:54 |
| 12 | Working with Numbers, Strings & Booleans | 05:44 |
| 13 | Type Assignment & Type Inference | 05:40 |
| 14 | Object Types | 07:33 |
| 15 | Arrays Types | 05:31 |
| 16 | Working with Tuples | 06:20 |
| 17 | Working with Enums | 07:06 |
| 18 | The "any" Type | 02:05 |
| 19 | Union Types | 06:31 |
| 20 | Literal Types | 07:55 |
| 21 | Type Aliases / Custom Types | 03:00 |
| 22 | Function Return Types & "void" | 07:26 |
| 23 | Functions as Types | 05:35 |
| 24 | Function Types & Callbacks | 04:24 |
| 25 | The "unknown" Type | 03:44 |
| 26 | The "never" Type | 04:11 |
| 27 | Wrap Up | 01:52 |
| 28 | Module Introduction | 00:47 |
| 29 | Using "Watch Mode" | 02:06 |
| 30 | Compiling the Entire Project / Multiple Files | 03:47 |
| 31 | Including & Excluding Files | 06:14 |
| 32 | Setting a Compilation Target | 04:05 |
| 33 | Understanding TypeScript Core Libs | 05:32 |
| 34 | More Configuration & Compilation Options | 01:42 |
| 35 | Working with Source Maps | 02:01 |
| 36 | rootDir and outDir | 05:32 |
| 37 | Stop Emitting Files on Compilation Errors | 02:52 |
| 38 | Strict Compilation | 11:05 |
| 39 | Code Quality Options | 04:23 |
| 40 | Debugging with Visual Studio Code | 04:21 |
| 41 | Wrap Up | 01:09 |
| 42 | Module Introduction | 02:22 |
| 43 | "let" and "const" | 06:34 |
| 44 | Arrow Functions | 04:51 |
| 45 | Default Function Parameters | 02:10 |
| 46 | The Spread Operator (...) | 04:33 |
| 47 | Rest Parameters | 05:06 |
| 48 | Array & Object Destructuring | 05:18 |
| 49 | How Code Gets Compiled & Wrap Up | 01:38 |
| 50 | Module Introduction | 00:55 |
| 51 | What are Classes? | 04:49 |
| 52 | Creating a First Class | 05:53 |
| 53 | Compiling to JavaScript | 03:03 |
| 54 | Constructor Functions & The "this" Keyword | 07:36 |
| 55 | "private" and "public" Access Modifiers | 05:53 |
| 56 | Shorthand Initialization | 02:59 |
| 57 | "readonly" Properties | 02:46 |
| 58 | Inheritance | 08:08 |
| 59 | Overriding Properties & The "protected" Modifier | 02:44 |
| 60 | Getters & Setters | 06:43 |
| 61 | Static Methods & Properties | 05:09 |
| 62 | Abstract Classes | 05:27 |
| 63 | Singletons & Private Constructors | 05:08 |
| 64 | Classes - A Summary | 01:44 |
| 65 | A First Interface | 04:27 |
| 66 | Using Interfaces with Classes | 06:11 |
| 67 | Why Interfaces? | 01:35 |
| 68 | Readonly Interface Properties | 01:36 |
| 69 | Extending Interfaces | 02:35 |
| 70 | Interfaces as Function Types | 02:42 |
| 71 | Optional Parameters & Properties | 04:12 |
| 72 | Compiling Interfaces to JavaScript | 01:59 |
| 73 | Wrap Up | 01:55 |
| 74 | Module Introduction | 00:59 |
| 75 | Intersection Types | 04:59 |
| 76 | More on Type Guards | 10:35 |
| 77 | Discriminated Unions | 06:12 |
| 78 | Type Casting | 07:46 |
| 79 | Index Properties | 06:36 |
| 80 | Function Overloads | 06:19 |
| 81 | Optional Chaining | 04:22 |
| 82 | Nullish Coalescing | 02:45 |
| 83 | Wrap Up | 01:21 |
| 84 | Module Introduction | 01:06 |
| 85 | Built-in Generics & What are Generics? | 08:45 |
| 86 | Creating a Generic Function | 08:34 |
| 87 | Working with Constraints | 03:40 |
| 88 | Another Generic Function | 05:36 |
| 89 | The "keyof" Constraint | 03:07 |
| 90 | Generic Classes | 08:55 |
| 91 | A First Summary | 01:23 |
| 92 | Generic Utility Types | 07:20 |
| 93 | Generic Types vs Union Types | 03:42 |
| 94 | Module Introduction | 01:35 |
| 95 | A First Class Decorator | 05:22 |
| 96 | Working with Decorator Factories | 02:03 |
| 97 | Building More Useful Decorators | 06:00 |
| 98 | Adding Multiple Decorators | 02:53 |
| 99 | Diving into Property Decorators | 05:01 |
| 100 | Accessor & Parameter Decorators | 05:37 |
| 101 | When Do Decorators Execute? | 03:12 |
| 102 | Returning (and changing) a Class in a Class Decorator | 08:38 |
| 103 | Other Decorator Return Types | 03:45 |
| 104 | Example: Creating an "Autobind" Decorator | 09:05 |
| 105 | Validation with Decorators - First Steps | 07:29 |
| 106 | Validation with Decorators - Finished | 12:15 |
| 107 | Wrap Up | 03:22 |
| 108 | Module Introduction | 00:55 |
| 109 | Getting Started | 05:21 |
| 110 | DOM Element Selection & OOP Rendering | 11:44 |
| 111 | Interacting with DOM Elements | 08:05 |
| 112 | Creating & Using an "Autobind" Decorator | 04:45 |
| 113 | Fetching User Input | 09:15 |
| 114 | Creating a Re-Usable Validation Functionality | 14:11 |
| 115 | Rendering Project Lists | 11:19 |
| 116 | Managing Application State with Singletons | 15:33 |
| 117 | More Classes & Custom Types | 07:12 |
| 118 | Filtering Projects with Enums | 06:00 |
| 119 | Adding Inheritance & Generics | 18:41 |
| 120 | Rendering Project Items with a Class | 11:59 |
| 121 | Using a Getter | 03:34 |
| 122 | Utilizing Interfaces to Implement Drag & Drop | 10:25 |
| 123 | Drag Events & Reflecting the Current State in the UI | 05:59 |
| 124 | Adding a Droppable Area | 08:09 |
| 125 | Finishing Drag & Drop | 06:45 |
| 126 | Wrap Up | 01:23 |
| 127 | Module Introduction | 01:12 |
| 128 | Writing Module Code - Your Options | 03:52 |
| 129 | Working with Namespaces | 10:51 |
| 130 | Organizing Files & Folders | 08:42 |
| 131 | A Problem with Namespace Imports | 02:53 |
| 132 | Using ES Modules | 12:22 |
| 133 | Understanding various Import & Export Syntaxes | 04:58 |
| 134 | How Does Code In Modules Execute? | 01:44 |
| 135 | Wrap Up | 03:15 |
| 136 | Module Introduction | 01:02 |
| 137 | What is Webpack & Why do we need it? | 05:33 |
| 138 | Installing Webpack & Important Dependencies | 03:56 |
| 139 | Adding Entry & Output Configuration | 05:58 |
| 140 | Adding TypeScript Support with the ts-loader Package | 07:01 |
| 141 | Finishing the Setup & Adding webpack-dev-server | 03:34 |
| 142 | Adding a Production Workflow | 04:05 |
| 143 | Wrap Up | 01:42 |
| 144 | Module Introduction | 01:19 |
| 145 | Using JavaScript (!) Libraries with TypeScript | 09:02 |
| 146 | Using "declare" as a "Last Resort" | 02:26 |
| 147 | No Types Needed: class-transformer | 08:29 |
| 148 | TypeScript-embracing: class-validator | 06:18 |
| 149 | Wrap Up | 01:58 |
| 150 | Module Introduction | 00:31 |
| 151 | Project Setup | 03:57 |
| 152 | Getting User Input | 02:42 |
| 153 | Setting Up a Google API Key | 02:49 |
| 154 | Using Axios to Fetch Coordinates for an Entered Address | 10:15 |
| 155 | Rendering a Map with Google Maps (incl. Types!) | 06:36 |
| 156 | Module Introduction | 01:06 |
| 157 | Setting Up a React + TypeScript Project | 05:22 |
| 158 | How Do React + TypeScript Work Together? | 03:47 |
| 159 | Working with Props and Types for Props | 06:59 |
| 160 | Getting User Input with "refs" | 07:04 |
| 161 | Cross-Component Communication | 03:59 |
| 162 | Working with State & Types | 04:29 |
| 163 | Managing State Better | 01:34 |
| 164 | More Props & State Work | 04:10 |
| 165 | Adding Styling | 01:03 |
| 166 | Types for other React Features (e.g. Redux or Routing) | 04:02 |
| 167 | Wrap Up | 01:35 |
| 168 | Module Introduction | 01:24 |
| 169 | Executing TypeScript Code with Node.js | 03:34 |
| 170 | Setting up a Project | 04:08 |
| 171 | Finished Setup & Working with Types (in Node + Express Apps) | 05:18 |
| 172 | Adding Middleware & Types | 05:46 |
| 173 | Working with Controllers & Parsing Request Bodies | 09:54 |
| 174 | More CRUD Operations | 10:21 |
| 175 | Wrap Up | 02:12 |
| 176 | Thanks for being part of the course! | 00:56 |
Similar courses to Understanding TypeScript - 2023 Edition
The Ultimate TypeScript Course
TypeScript Simplified
TinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL
Learn React 19 with Epic React v2
Mastering Next.js 13 with TypeScript
Fullstack React with Typescript
TypeScript Pro Essentials
