Understanding TypeScript – 2020 Edition

Video Description

Don't limit the Usage of TypeScript to Angular 2! Learn the Basics, its Features, Workflows and how to use it!

About This Video

  • This course reflects the latest version of TypeScript, and incorporates tons of feedback.
  • Understand what TypeScript really it is about and how works
  • Why TypeScript offers a real advantage over vanilla JavaScript
  • Learn TypeScript in theory and apply it to real use cases and projects
  • Learn how to combine TypeScript with ReactJS or Node.js/Express

In Detail

Most people know TypeScript from Angular 2+. It's the language you must 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 while doing so, also understand what you're doing in your Angular code.

This course takes you from the very basics and its most important feature (Types!) to a point where you're able to use TypeScript in any of your projects—ReactJS projects included! As TypeScript is developed by Microsoft and used a lot by Angular 2+ (Google), it's here to stay. Gain an edge today and be amongst the first to really understand TypeScript!

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. ES6 features such as destructuring or arrow functions, decorators, generics and interfaces or modules—TypeScript has them all! In this course, we'll not stop at the basics. You will learn about more advanced features and how to set up workflows with TypeScript. This includes TypeScript-only workflows as well as workflows using Gulp or Webpack. You'll also learn that you're not limited to Angular 2+ or plain JavaScript/TypeScript projects. One complete module covers how to use TypeScript with ReactJS to benefit from its features, too. You'll practice what you learn.

Watching videos is a great way to learn. And for 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!

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, and decorators
  • How to integrate third-party JavaScript libraries into your TypeScript projects
  • 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!

Table of Contents

  1. Chapter 1 : Getting Started
    1. Welcome to the Course! 00:01:58
    2. Why Is TypeScript & Why Should You Use It? 00:04:34
    3. Installing & Using TypeScript 00:13:22
    4. TypeScript Advantages – Overview 00:03:06
    5. Course Outline 00:04:17
    6. How to Get the Most Out of the course 00:02:30
    7. Setting Up A Code Editor / IDE 00:03:07
    8. The Course Project Setup 00:07:21
  2. Chapter 2 : TypeScript Basics & Basic Types
    1. Module Introduction 00:00:26
    2. Using Types 00:10:20
    3. TypeScript Types vs JavaScript Types 00:04:54
    4. Working with Numbers, Strings & Booleans 00:05:43
    5. Type Assignment & Type Inference 00:05:39
    6. Object Types 00:07:32
    7. Arrays Types 00:05:30
    8. Working with Tuples 00:06:20
    9. Working with Enums 00:07:05
    10. The "any" Type 00:02:04
    11. Union Types 00:06:31
    12. Literal Types 00:07:55
    13. Type Aliases / Custom Types 00:03:00
    14. Function Return Types & "void" 00:07:25
    15. Functions as Types 00:05:34
    16. Function Types & Callbacks 00:04:24
    17. The "unknown" Type 00:03:43
    18. The "never" Type 00:04:11
    19. Wrap Up 00:01:51
  3. Chapter 3 : The TypeScript Compiler and Configuration
    1. Module Introduction 00:00:46
    2. Using "Watch Mode" 00:02:05
    3. Compiling the Entire Project / Multiple Files 00:03:47
    4. Including & Excluding Files 00:06:13
    5. Setting a Compilation Target 00:04:05
    6. Understanding TypeScript Core Libs 00:05:32
    7. More Configuration & Compilation Options 00:01:41
    8. Working with Source Maps 00:02:00
    9. rootDir and outDir 00:05:31
    10. Stop Emitting Files on Compilation Errors 00:02:52
    11. Strict Compilation 00:11:04
    12. Code Quality Options 00:04:23
    13. Debugging with Visual Studio Code 00:04:20
    14. Wrap Up 00:01:08
  4. Chapter 4 : Next-generation JavaScript & TypeScript
    1. Module Introduction 00:02:22
    2. "let" and "const" 00:06:34
    3. Arrow Functions 00:04:50
    4. Default Function Parameters 00:02:10
    5. The Spread Operator (...) 00:04:33
    6. Rest Parameters 00:05:05
    7. Array & Object Destructuring 00:05:18
    8. How Code Gets Compiled & Wrap Up 00:01:38
  5. Chapter 5 : Classes & Interfaces
    1. Module Introduction 00:00:55
    2. What are Classes? 00:04:48
    3. Creating a First Class 00:05:52
    4. Compiling to JavaScript 00:03:02
    5. Constructor Functions & The "this" Keyword 00:07:35
    6. "private" and "public" Access Modifiers 00:05:52
    7. Shorthand Initialization 00:02:58
    8. "readonly" Properties 00:02:45
    9. Inheritance 00:08:07
    10. Overriding Properties & The "protected" Modifier 00:02:43
    11. Getters & Setters 00:06:42
    12. Static Methods & Properties 00:05:09
    13. Abstract Classes 00:05:26
    14. Singletons & Private Constructors 00:05:07
    15. Classes - A Summary 00:01:44
    16. A First Interface 00:04:27
    17. Using Interfaces with Classes 00:06:11
    18. Why Interfaces? 00:01:35
    19. Readonly Interface Properties 00:01:35
    20. Extending Interfaces 00:02:34
    21. Interfaces as Function Types 00:02:41
    22. Optional Parameters & Properties 00:04:11
    23. Compiling Interfaces to JavaScript 00:01:59
    24. Wrap Up 00:01:54
  6. Chapter 6 : Advanced Types
    1. Module Introduction 00:00:58
    2. Intersection Types 00:04:58
    3. More on Type Guards 00:10:35
    4. Discriminated Unions 00:06:11
    5. Type Casting 00:07:45
    6. Index Properties 00:06:35
    7. Function Overloads 00:06:18
    8. Optional Chaining 00:04:22
    9. Nullish Coalescing 00:02:45
    10. Wrap Up 00:01:20
  7. Chapter 7 : Generics
    1. Module Introduction 00:01:05
    2. Built-in Generics & What are Generics? 00:08:45
    3. Creating a Generic Function 00:08:34
    4. Working with Constraints 00:03:40
    5. Another Generic Function 00:05:36
    6. The "keyof" Constraint 00:03:07
    7. Generic Classes 00:08:54
    8. A First Summary 00:01:22
    9. Generic Utility Types 00:07:19
    10. Generic Types vs Union Types 00:03:41
  8. Chapter 8 : Decorators
    1. Module Introduction 00:01:35
    2. A First-Class Decorator 00:05:21
    3. Working with Decorator Factories 00:02:02
    4. Building More Useful Decorators 00:06:00
    5. Adding Multiple Decorators 00:02:53
    6. Diving into Property Decorators 00:05:00
    7. Accessor & Parameter Decorators 00:05:37
    8. When Do Decorators Execute? 00:03:11
    9. Returning (and changing) a Class in a Class Decorator 00:08:38
    10. Other Decorator Return Types 00:03:45
    11. Example: Creating an "Autobind" Decorator 00:09:04
    12. Validation with Decorators - First Steps 00:07:29
    13. Validation with Decorators – Finished 00:12:14
    14. Wrap Up 00:03:22
  9. Chapter 9 : Practice Time! Let's build a Drag & Drop Project
    1. Module Introduction 00:00:54
    2. Getting Started 00:05:20
    3. DOM Element Selection & OOP Rendering 00:11:44
    4. Interacting with DOM Elements 00:08:04
    5. Creating & Using an "Autobind" Decorator 00:04:45
    6. Fetching User Input 00:09:15
    7. Creating a Re-Usable Validation Functionality 00:14:10
    8. Rendering Project Lists 00:11:19
    9. Managing Application State with Singletons 00:15:33
    10. More Classes & Custom Types 00:07:12
    11. Filtering Projects with Enums 00:06:00
    12. Adding Inheritance & Generics 00:18:40
    13. Rendering Project Items with a Class 00:11:58
    14. Using a Getter 00:03:33
    15. Utilizing Interfaces to Implement Drag & Drop 00:10:24
    16. Drag Events & Reflecting the Current State in the UI 00:05:58
    17. Adding a Droppable Area 00:08:08
    18. Finishing Drag & Drop 00:06:44
    19. Wrap Up 00:01:23
  10. Chapter 10 : Modules & Namespaces
    1. Module Introduction 00:01:12
    2. Writing Module Code - Your Options 00:03:51
    3. Working with Namespaces 00:10:50
    4. Organizing Files & Folders 00:08:42
    5. A Problem with Namespace Imports 00:02:52
    6. Using ES Modules 00:12:21
    7. Understanding various Import & Export Syntaxes 00:04:57
    8. How Does Code In Modules Execute? 00:01:44
    9. Wrap Up 00:03:15
  11. Chapter 11 : Using Webpack with TypeScript
    1. Module Introduction 00:01:01
    2. What is Webpack & Why do we need it? 00:05:32
    3. Installing Webpack & Important Dependencies 00:03:56
    4. Adding Entry & Output Configuration 00:05:58
    5. Adding TypeScript Support with the ts-loader Package 00:07:01
    6. Finishing the Setup & Adding webpack-dev-server 00:03:33
    7. Adding a Production Workflow 00:04:04
    8. Wrap Up 00:01:41
  12. Chapter 12 : 3rd Party Libraries & TypeScript
    1. Module Introduction 00:01:19
    2. Using JavaScript (!) Libraries with TypeScript 00:09:02
    3. Using "declare" as a "Last Resort" 00:02:26
    4. No Types Needed: class-transformer 00:08:29
    5. TypeScript-embracing: class-validator 00:06:17
    6. Wrap Up 00:01:57
  13. Chapter 13 : Time to Practice! Let's build a "Select & Share a Place" App (incl. Google Maps)
    1. Module Introduction 00:00:30
    2. Project Setup 00:03:56
    3. Getting User Input 00:02:41
    4. Setting Up a Google API Key 00:02:48
    5. Using Axios to Fetch Coordinates for an Entered Address 00:10:14
    6. Rendering a Map with Google Maps (incl. Types!) 00:06:36
  14. Chapter 14 : React.js & TypeScript
    1. Module Introduction 00:01:05
    2. Setting Up a React + TypeScript Project 00:05:22
    3. How Do React + TypeScript Work Together? 00:03:46
    4. Working with Props and Types for Props 00:06:58
    5. Getting User Input with "refs" 00:07:03
    6. Cross-Component Communication 00:03:58
    7. Working with State & Types 00:04:29
    8. Managing State Better 00:01:34
    9. More Props & State Work 00:04:09
    10. Adding Styling 00:01:02
    11. Types for other React Features (e.g. Redux or Routing) 00:04:01
    12. Wrap Up 00:01:34
  15. Chapter 15 : Node.js + Express & TypeScript
    1. Module Introduction 00:01:24
    2. Executing TypeScript Code with Node.js 00:03:33
    3. Setting up a Project 00:04:07
    4. Finished Setup & Working with Types (in Node + Express Apps) 00:05:17
    5. Adding Middleware & Types 00:05:45
    6. Working with Controllers & Parsing Request Bodies 00:09:54
    7. More CRUD Operations 00:10:20
    8. Wrap Up 00:02:11
  16. Chapter 16 : Course Roundup
    1. Roundup 00:02:51

Product Information

  • Title: Understanding TypeScript – 2020 Edition
  • Author(s): Maximilian Schwarzmüller
  • Release date: October 2018
  • Publisher(s): Packt Publishing
  • ISBN: 9781789951905