Home>Courses>Mastering TypeScript

Mastering TypeScript

Gain insights into TypeScript types, interfaces, classes, generics, and asynchronous programming. Explore Angular, React, Vue for web development, and learn to build web servers using Express and AWS.

Intermediate

212 Lessons

48h

Certificate of Completion

AI-POWERED

Explanations

AI-POWERED

Explanations

This course includes

411 Playgrounds

20 Quizzes

Course Overview

What You'll Learn

Course Content

Apply Your Skills

Recommendations

Course Overview

TypeScript and its compiler have been a success story and carved out a solid footprint in the JavaScript development community. You’ll start with exploring the types used in TypeScript and its common features. Next, you’ll learn the object-oriented concepts and capabilities of interfaces, classes, and inheritance. You’ll learn about the generics’ more advanced language feature, advanced type inference using conditional types, type chaining, and type distribution. You’ll also learn asynchronous programming ...Show More

TypeScript and its compiler have been a success story and carved out a solid footprint in the JavaScript development community. ...Show More

TAKEAWAY SKILLS

JavaScript

Angular CLI

React.js

Vue.js Basics

Jest

Using AWS Cloud Services

REST API

RxJS

What You'll Learn

An understanding of common features in TypeScript, object-oriented concepts, generics, and advanced type inferences

An understanding of asynchronous programming concepts, decorators, and strict compiler options

Ability to use observables to transform data in TypeScript and Jest unit testing framework to run end-to-end tests

Build websites with Angular, React, and Vue using TypeScript

Build an application using an Express web server with code running in Node

Ability to use AWS libraries to build and deploy a full REST-based API

An understanding of common features in TypeScript, object-oriented concepts, generics, and advanced type inferences

Course Content

Before Getting Started

2 Lessons

Get familiar with why TypeScript is essential and the prerequisites for mastering it.

Why Choose TypeScript and This Course?

Prerequisites

Introduction

8 Lessons

Look at TypeScript as an enhancement to JavaScript, enabling strong typing, better error checking, and robust development for complex applications.

Introduction to TypeScript

Transpiling

Strong Typing and Basic Types

Inferred Typing and Duck Typing

Function Signatures and the void Keyword

Third Party Libraries and Declaration Files

Summary

Quiz: TypeScript Basics

Exploring the Type System

18 Lessons

Break apart TypeScript's type system essentials, including enums, union types, optional chaining, and functions.

The Basic TypeScript Type System

The any Type and Explicit Casting

The let and const Keywords

Union Types, Type Guards, and Aliases

Enums

Exploring Primitive Types

Conditional Expressions and Optional Chaining

Nullish Coalescing and Null or Undefined Operands

Definite Assignment

Object and Unknown Types

The never Type and switch Statements

Object Spread

Tuples

Functions

Function Callbacks in JavaScript

Function Signatures and Function Overrides in TypeScript

Summary

Quiz: Exploring the Type System

Challenge: TypeScript Basics

2 Lessons

Apply your skills to enhance TypeScript code reliability, streamline syntax, and handle errors effectively.

Challenge: TypeScript Basics

Solution: TypeScript Basics

Interfaces in TypeScript

6 Lessons

Dig deeper into TypeScript interfaces to enhance code quality, define object structures, and ensure type safety.

Introduction to Interfaces

Optional Properties and Prefixing Interface Names

Weak Types in Interfaces

The in and keyof Operators

Summary

Quiz: Interfaces in TypeScript

Classes in TypeScript

8 Lessons

Focus on TypeScript classes, constructors, access modifiers, private fields, interfaces, static functions, and namespaces.

Introduction to Classes

Classes and Interfaces

Class Constructors and Modifiers

JavaScript Private Fields and TypeScript

Constructor Parameter Properties and Property Accessors

Static Functions and Namespaces

Summary

Quiz: Classes in TypeScript

Inheritance in TypeScript

8 Lessons

Build on inheritance concepts, `super` function, method overriding, protected, abstract classes, `instanceof` operator, and interfaces.

Introduction to Inheritance

The super Function and Function Overriding

Protected and Abstract Classes

Abstract Class Methods

The instanceof Operator

Interfaces Extending Classes

Summary

Quiz: Inheritance in TypeScript

Modules in TypeScript

4 Lessons

Get familiar with organizing TypeScript code with modules, exports, and namespaces.

Modules in TypeScript

Multiple Exports and Namespaces

Summary

Quiz: Modules in TypeScript

Challenge: Interfaces, Classes, Inheritance, and Modules

2 Lessons

Solve challenges with applying TypeScript concepts like interfaces, classes, inheritance, and modules.

Challenge: Interfaces, Classes, Inheritance, and Modules

Solution: Interfaces, Classes, Inheritance, and Modules

10.

Generics in TypeScript

7 Lessons

Recognize generics in TypeScript to create reusable, type-safe code and manage constraints.

Introduction to Generics

Generic Syntax

Constraining Generic Types with Examples

Limitations of Generic Code: Interfaces and Constrained Types

Using Generics to Constrain Types

Summary

Quiz: Generics

11.

Advanced Type Inferences in TypeScript

7 Lessons

Grasp the fundamentals of advanced type inferences, including mapped, conditional, and inferred types.

Introduction to Advanced Type Inferences

Mapped Types

Conditional Types and Chaining

Distributed Conditional Types and the Conditional Type Inference

Type Inference from Function Signatures and Arrays

Summary

Quiz: Advanced Type Inferences

12.

Challenge: Generics and Advanced Type Inferences

2 Lessons

Map out the steps for mastering TypeScript generics through coding challenges and error resolution.

Challenge: Generics and Advanced Type Inferences

Solution: Generics and Advanced Type Inferences

13.

Asynchronous Language Features

9 Lessons

Investigate asynchronous features in JavaScript, including callbacks, Promises, and async/await.

Introduction to Asynchronous Language Features

Callbacks

Promises

Promise Syntax

Returning Values from Promises

Async and Await

Callbacks vs. Promises vs. Async

Summary

Quiz: Asynchronous Language Features

14.

Decorators

7 Lessons

Master the use of TypeScript decorators for modifying classes, properties, methods, and parameters programmatically.

What Are Decorators?

Types of Decorators

Class and Property Decorators

Method and Parameter Decorators

Decorators Metadata

Summary

Quiz: Decorators

15.

Challenge: Asynchronous Language Features and Decorators

2 Lessons

Solve problems in asynchronous features and decorators through practical exercises in TypeScript.

Challenge: Asynchronous Language Features and Decorators

Solution: Asynchronous Language Features and Decorators

16.

Integration with JavaScript

8 Lessons

Discover the logic behind integrating TypeScript with JavaScript for improved code management.

Enhancing JavaScript Libraries with TypeScript

Using Declaration Files in TypeScript

Finding and Writing Declaration Files

Creating a Namespace in TypeScript Declaration Files

Understanding TypeScript Declaration Files

Integration Compiler Options

Summary

Quiz: Integration with JavaScript

17.

Strict Compiler Options

7 Lessons

Break apart the crucial TypeScript strict compiler options to enhance code reliability.

Introduction to Strict Compiler Options

Nested Configuration

Fixing Uninitialized Variable Errors in TypeScript

JavaScript's bind, call, and apply Functions

The no Compiler Options

Summary

Quiz: Strict Compiler Options

18.

Challenge: Strict Compiler Options

2 Lessons

Enhance your skills in troubleshooting TypeScript errors and enforcing stricter type safety.

Challenge: Strict Compiler Options

Solution: Strict Compiler Options

19.

Using Observables to Transform Data

10 Lessons

Take a closer look at mastering RxJS Observables, transformations, error handling, and stream management.

Introduction to Observables

The pipe and map Functions

Avoid Swallowing Values

Observable Errors

Observables Returning Observables

Using mergeMap and concatMap Functions

The forkJoin Function

Observable Subject

Summary

Quiz: Using Observables to Transform Data

20.

Challenge: Using Observables to Transform Data

2 Lessons

Tackle practical issues with Observables, RxJS imports, error handling, and code robustness.

Challenge: Using Observables to Transform Data

Solution: Using Observables to Transform Data

21.

Test-Driven Development

12 Lessons

Master the steps to implement TDD with Jest, covering setup, testing strategies, and mock functions.

Introduction to Test-Driven Development

Jest: A Unit Testing Framework

Grouping, Forcing, and Skipping Tests

Matchers

Test Setup and Teardown

Quiz: Test-Driven Development

Appendix: Test-Driven Development

22.

Challenge: Test-Driven Development

2 Lessons

Solve problems in TypeScript testing, logical errors, and asynchronous timing issues.

Challenge: Test-Driven Development

Solution: Test-Driven Development

23.

Angular

15 Lessons

Get started with developing Angular apps, integrating Material UI, and handling services.

Introduction to Angular

Application Structure and Modules

Angular Material Components

An Angular Application

Angular DOM Events

Angular EventEmitter and Services

Angular Dependency Injection and Child Components

Understanding Two-Way Data Binding and Reactive Forms in Angular

Unit Testing Angular Components

Unit Testing Forms and Events

Reacting to Domain Events

24.

Challenge: Angular

2 Lessons

Lay out a solution for modifying and styling an Angular CLI-generated template application.

Challenge: Angular

Solution: Angular

25.

React

11 Lessons

Enhance your skills in building React applications with TypeScript, focusing on state, props, and JSX.

The Story of React and TypeScript

JSX in TypeScript and React Components

React Props and Event Handling

Managing the Component State in React

Building a Product List with Detailed Descriptions

Exploring DetailView and App Components

Gathering User Input for Task Completion

26.

Challenge: React

2 Lessons

Solve problems in debugging, event handling, and form validation in React applications.

Challenge: React

Solution: React

27.

Vue

13 Lessons

See how it works to build and integrate TypeScript in Vue applications, culminating in a shopping cart.

Building Vue Applications with TypeScript Integration

Component Structure and Child Components with Props

Component State and Events

Computed Properties, Conditional Statements, and Arrays

Building a Shopping Cart Application with Vue

Binding the Shopping Cart Collection to the App Component

Component Details: ShoppingCart and Checkout

Initializing Input Controls for Proper Label Display

Checkout and Item Rendering

Vue Application

Summary

Quiz: Vue

Appendix: Vue Setup on a Local Machine

28.

Node and Express

10 Lessons

Build a Node.js web server with Express, manage routes, and handle dynamic configurations.

Introduction to Node and Express Web Development

Modularizing Routes in Express Using the Router Object

Dynamic Configuration with the Config Library

Using Handlebars Template Engine in Express

Handling Form Submission

Managing User Authentication and Sessions

Node and Express Application

Summary

Quiz: Node and Express

Appendix: Express Setup on a Local Machine

29.

An AWS Serverless API

11 Lessons

Step through AWS serverless API creation using Lambda, SAM CLI, and DynamoDB integration.

Introduction to AWS

Serverless Application Model

Initializing and Deploying an AWS SAM Application

Building an API with AWS SAM CLI and DynamoDB Tables

DynamoDB Interactions with NoSQL Workbench

API Endpoints and Database Mapping in TypeScript AWS Application

Building a POST API Endpoint with AWS Lambda and TypeScript

Handling GET Requests with Path Parameters in AWS Lambda

Building a TypeScript Lambda Function for Retrieving Products

Summary

Quiz: AWS Serverless API

30.

Micro Front-Ends

12 Lessons

Discover the logic behind micro front-end architecture and communication for scalable applications.

Building Micro Front-Ends

Design Concepts and Front-End Mechanisms

Communication Mechanisms and Domain Events

Communication Mechanisms

Building Modules and Module Typing

Updating the React Application

React Domain Events

Updating the Vue Application

Angular Micro Front-End

Event Listening and Updates in Angular

Summary

Quiz: Micro Front-Ends

31.

Conclusion

1 Lessons

Explore the integration of TypeScript with JavaScript frameworks and ongoing skill enhancement.

Wrap Up

Course Author

Packt

Project

Genius TypeScript Discord Bot

intermediate

1 hour 15 min

Project

Genius TypeScript Discord Bot

Learn how to create a basic, functional Discord bot with features like basic moderation, user input, and database connections.

intermediate

1 hour 15 mins

Trusted by 2.6 million developers working at companies

"These are high-quality courses. Trust me. I own around 10 and the price is worth it for the content quality. EducativeInc came at the right time in my career. I'm understanding topics better than with any book or online video tutorial I've done. Truly made for developers. Thanks"

Anthony Walker

@_webarchitect_

"Just finished my first full #ML course: Machine learning for Software Engineers from Educative, Inc. ... Highly recommend!"

Evan Dunbar

ML Engineer

"You guys are the gold standard of crash-courses... Narrow enough that it doesn't need years of study or a full blown book to get the gist, but broad enough that an afternoon of Googling doesn't cut it."

Carlos Matias La Borde

Software Developer

"I spend my days and nights on Educative. It is indispensable. It is such a unique and reader-friendly site"

Souvik Kundu

Front-end Developer

"Your courses are simply awesome, the depth they go into and the breadth of coverage is so good that I don't have to refer to 10 different websites looking for interview topics and content."

Vinay Krishnaiah

Software Developer

"I've tried probably 5-7 different sites and Educative is easily the best. It perfectly blends explanation with interactivity"

Eric Downs

Musician/Entrepeneur

Hands-on Learning Powered by AI

See how Educative uses AI to make your learning more immersive than ever before.

Instant Code Feedback

Evaluate and debug your code with the click of a button. Get real-time feedback on test cases, including time and space complexity of your solutions.

AI-Powered Mock Interviews

Put your skills to the test in a simulated interview setting. Receive personalized feedback based on your performance. Available in Premium & Premium Plus plans.

Adaptive Learning

At various checkpoints throughout Educative courses, you will be prompted to take a quick assessment. Receive a condensed curriculum tailored to your strengths and skill gaps.

Explain with AI

Select any text within any Educative course, and get an instant explanation — without ever leaving your browser.

AI Code Mentor

AI Code Mentor helps you quickly identify errors in your code, learn from your mistakes, and nudge you in the right direction — just like a 1:1 tutor!

Recommended before starting this course

Course

JavaScript in Practice: Getting Started

Delve into practical JavaScript skills, from basic concepts to integration with HTML/CSS, and discover its history and evolution in software development through hands-on exercises.

beginner

6 hours

Course

Web Development: Unraveling HTML, CSS, and JavaScript

Explore HTML, CSS, and JavaScript fundamentals. Gain insights into forms, controls, OOP in JavaScript, and key CSS patterns. Create responsive, stylized, and performant web applications.

beginner

20 hours

Course

JavaScript in Practice: Getting Started

beginner

6 hour

Course

Web Development: Unraveling HTML, CSS, and JavaScript

beginner

20 hour

Related Courses and Skill Paths

Course

The Angular Masterclass

Gain insights into Angular architecture, components, modules, routing, dependency injection, and observables. Delve into state management, testing, and troubleshooting to build a sales contacts app.

intermediate

20 hours

Course

Advanced React Patterns With Hooks

Gain insights into advanced React patterns with hooks. Learn about optimizing components with hooks over traditional methods like render props or higher-order components for better efficiency.

advanced

8 hours

Course

Vue - The Road to Enterprise

Gain insights into advanced practices for Vue development. Discover migration techniques to Vue 3, project configuration, API layer creation, performance optimization, security, and testing best practices.

intermediate

40 hours

Course

The Angular Masterclass

intermediate

20 hour

Course

Advanced React Patterns With Hooks

advanced

8 hour

Course

Vue - The Road to Enterprise