TypeScript: From Zero to Expert (2024)

Learn how to create web applications with TypeScript, with this mega course that will teach you by creating projects

What you will learn

TypeScript Fundamentals

Object Oriented Programming


Abstract Classes and Interfaces


TypeScript, a programming language developed by Microsoft, serves as a powerful enhancement to Javascript by introducing static types and class-based objects. As a superset of Javascript, TypeScript integrates seamlessly with existing Javascript code, offering a more structured and scalable approach to coding. This language’s unique features cater to developers seeking to leverage the benefits of both static typing and object-oriented programming within the dynamic world of JavaScript.

This comprehensive course is designed to guide you through the intricacies of TypeScript, starting from the foundational concepts to more advanced features. Whether you are new to TypeScript or looking to deepen your understanding, this course offers a structured pathway to mastering the language.

We begin by exploring the basics of TypeScript, including its syntax, data types, and the way it extends JavaScript’s capabilities. As you progress, you’ll delve into the core principles of object-oriented programming, an approach that promotes cleaner, more manageable code. You’ll learn about classes, interfaces, inheritance, and polymorphism, all within the context of TypeScript.


The course also covers advanced topics such as generics, which provide a way to create reusable components, and decorators, a TypeScript feature that offers a declarative approach to modifying class behavior. These concepts are crucial for developing sophisticated applications and understanding modern software design patterns.

A unique aspect of this course is its emphasis on practical application. You’ll be engaged in hands-on projects that involve integrating TypeScript with popular technologies like React.js and Node.js. These projects are designed to mimic real-world scenarios, allowing you to apply your learning in a practical context and build a portfolio of work that demonstrates your skills.

By the end of this course, you will have a thorough understanding of TypeScript’s features and capabilities. You’ll be equipped with the knowledge to write more efficient, error-resistant, and maintainable code, making you a valuable asset in the world of web application development. This course not only enhances your technical skills but also prepares you for the evolving demands of the software industry, where TypeScript is becoming increasingly prevalent.


What is TypeScript
TypeScript in Action
Installing and configuring Visual Studio Code
Installing NodeJs
Creating our first program with TypeScript
Installing Useful Visual Studio Code Extensions

Primitive Data Types

The number data type in TypeScript
The String Data Type in TypeScript
The boolean data type in TypeScript
The object data type in TypeScript
The array data type in TypeScript
The Tuple data type in TypeScript
Enum data type in TypeScript
The any data type in TypeScript
The Union Data Type in TypeScript
The Literal Data Type in TypeScript
Type Aliases in TypeScript
Functions as Types in TypeScript
Function Callbacks in TypeScript
Data type unknown
The data type never

TypeScript project configuration

Understanding the watch mode
Initializing the project to monitor all files
Changing JavaScript versions with the target option
Managing libraries in our project with lib
The options allowJs, checkJs, jsx, and d-ts files
The sourceMap option
The outDir and rootDir options
The removeComments, noEmit and downlevelIteration options
The noEmitOnError option
Strict Options
Additional checks
Include and Exclude
Setting up a web server for our TypeScript apps
Debugging TypeScript applications

Project # 1: Color Flipper

Project implementation
Adding a callback

Object Oriented Programming

Understanding the concept of classification
What is a class?
Creating our first class
Defining methods for our class
Creating instances of a class
Controlling the accessibility to our classes
Simplified property creation
Static methods
Static properties
Read-only static properties

Project # 2: Tasker

Project creation and section definition to add tasks
Creating sections for completed and incomplete tasks
Creating the class TodoItem
Creating the TaskManager class
Creating the button EventListener
Creating the HTMLHelper class
Filling sections with corresponding items
Marking the TodoItem as completed
Final Adjustments


Understanding Inheritance
Creating a MultimediaFile class
Implementing Inheritance
Invoking base constructors
Assigning Classes
Understanding the ‘protected’ access modifier
Getters and Setters

Project # 3: TypeShapes

Creation of the HTML structure
Creating the Line class
Drawing random lines
Adding Inheritance
Drawing Circles
Drawing Text

Interfaces and abstract classes

Defining interfaces
Implementing Interfaces
Inheriting and implementing interfaces at once
Interface Extension
Referencing a class through its interface
Read-only properties
Interfaces as function types
Properties, optional parameters and methods
Abstract classes
Abstract Methods

Project # 4: CineFans

Practice – CineFans

Advanced Types

Discriminated Unions
The Intersection type in TypeScript
Type Guards
TypeGuard instanceof
Type Casting
Index Properties or Index Signature
Function overloads
Optional Chaining


Creating a Stack
Addition of push and pop methods
Problems with the Stack
How a generic class works
Other features of Generics
Redefining the stack
Generics and Constraints
Using generics in functions
The use of keyof


Syntax of a Decorator – Class Decorator
Decorator factories
Creating a more realistic decorator
Creating another class decorator
Changing a class constructor through a decorator
Multiple decorators
Method Decorators
Property Decorators
Parameter Decorators

Ads Blocker Image Powered by Code Help Pro

Ads Blocker Detected!!!

We have detected that you are using extensions to block ads. Please support us by disabling these ads blocker.

Powered By
Best Wordpress Adblock Detecting Plugin | CHP Adblock

Check Today's 30+ Free Courses on Telegram!