TypeScript Masterclass 2024 Edition - React + NodeJS Project from Udemy

The only complete TypeScript course on the marketplace to get you building TypeScript apps like a pro.

This is the only complete course about TypeScript on the marketplace. Apart from giving you complete and in-depth knowledge about TypeScript, I also teach you how to use TypeScript in conjunction with other technologies such as ReactJS, Material UI, Tanstack Query/ React Query, Node, Express, TypeORM, and MySQL. This is important because while developing a project, in most cases, you would not be using TypeScript in isolation.

This course contains 240+ Videos which in total contain more than 19 hours of content. I teach you the latest features of TypeScript in a very practical manner providing you with the in-depth knowledge you need to master TypeScript.

Once we are through with the theoretical part of the TypeScript and we understand the intrinsics of the language, we set off to build a full stack application. We build a task management application where you can create a new task and set the priority as well as the status of the task. We also build real-time task counters and work on a complete server state synchronization.

While building the front end of this application, you learn how to use TypeScript with React, Material UI, React Query, and Context API. And, when we build the If you are a full-stack developer, you can enjoy and build the complete project with me. And of you, skillsets are limited to the backend or front-end. You can choose the module based on your skills as these modules are self-contained and do not have a dependency on each other.

Detailed Breakdown Of Topics Covered In The Course:

What is TypeScript
How TypeScript helps You Write Better Code
Introduction To Types
Different types of types in TypeScript
Primitive types
Object types
Array types
Tuples
Enums
Unions
Intersection types
Custom types
Type inference
Void
Never
Functions in TypeScript
Call signatures
Function overloading
Polymorphic functions
Generics
Classes in TypeScript
Inheritance
Accessors and Mutators
Constructors
Access modifiers
Static members
Abstract classes
Method Overriding
Interfaces
Multiple inheritance with interfaces
TypeScript Compiler and how to modify it for your needs
JavaScript Prototypes and Objects
Prototypical inheritance
Property descriptors
Decorators
Decorator factories
Class decorators
Method decorators
Parameter decorators
Decorators on static members of a class
Property decorators
Multiple decorators and execution sequence
Subtypes and Supertypes
Typecasting
Type widening
Totality
Discriminated unions
Index Accessed types
KeyOff operator
Mapped types
Conditional Types
Type definitions for third-party libraries
Building a full stack application
Application front-end using - TypeScript with React, Material UI, React Query / Tanstack Query, and Context API.
Application backend TypeScript is a superset of JavaScript and can be used along with JavaScript, allowing slow and steady upgradation. TypeScript has been voted the second most loved programming language in the Stack Overflow 2020 Developer survey.
Since the introduction of NodeJS to the community a decade ago, JavaScript has become the most widely used cross-platform programming language. While the size, scope, and complexity of JavaScript programs have grown exponentially, the JavaScript language's ability to express the relationships between different entities of code has not. The most common errors that programmers make are type errors: a specific type of value was used when a different type of value was expected. This could result from simple typos, a failure to understand a library's API surface, incorrect assumptions about runtime behavior, or other errors. TypeScript's goal is to be a static type checker for JavaScript programs.
Apart from providing type checking and strict types, TypeScript comes with a bunch of features that help you to write Object Oriented Code. These features are specific to TypeScript and do not exist in JavaScript.
Who Should Take This Course?
- If you are an existing JavaScript developer and want to up your JavaScript game with TypeScript. This course is a perfect fit for you.
- If you already have some basic TypeScript knowledge and want to dive deep into advanced concepts. This course is a perfect fit for you.
- If you want to learn how to use TypeScript and existing technologies such as React, Material UI, Context API, React Query, Node, and TypeORM. This course will help you learn TypeScript in conjunction with these technologies.
Who Should Not Take This Course?
- Since TypeScript is a superset of JavaScript, this course is not for you if you have never worked on JavaScript. You do not need to be an expert at JavaScript but should have some basic knowledge of JavaScript to benefit from this course.
- Suppose you are a new programmer looking for your first programming language course. Then this course is not for you. Since TypeScript builds up on JavaScript, some prior knowledge of JavaScript programming is needed to be able to take this course.

What's inside

Learning objectives

Learn typescript from scratch starting with the basic type safety and types offered by typescript to advanced oop features.
Deep dive into object oriented programming features offered by typescript. includes lectures about classes, abstract classes, access modifiers and interfaces.
Understand advanced typescript features such as generics, decorators, totality, type widening, mapped types, conditional types and so on.

Create a full stack application using typescript and learn how to use typescript with technologies like react, material ui, tanstack query, nodejs, typeorm
Use typescript with front-end frameworks like react js, tanstack/react query, context api and material ui
Use typescript for back-end development using nodejs, express, typeorm and mysql

Learn typescript from scratch starting with the basic type safety and types offered by typescript to advanced oop features.
Deep dive into object oriented programming features offered by typescript. includes lectures about classes, abstract classes, access modifiers and interfaces.
Understand advanced typescript features such as generics, decorators, totality, type widening, mapped types, conditional types and so on.
Create a full stack application using typescript and learn how to use typescript with technologies like react, material ui, tanstack query, nodejs, typeorm
Use typescript with front-end frameworks like react js, tanstack/react query, context api and material ui
Use typescript for back-end development using nodejs, express, typeorm and mysql

Syllabus

Introductory section for TypeScript

WHAT'S INCLUDED IN THE COURSE

DEMO OF APP WE BUILD IN THE END

How To Take Full Advantage Of The Course

Course Update And Change Log

What Is TypeScript

Setup Development Environment

Setting Up TypeScript Compiler

How TypeScript Helps You Catch Errors

Your First TypeScript Program

Deep Dive into the JavaScript File Generated by TypeScript

TypeScript Type System

Take this quiz to evaluate how much you have learned from this introductory section of the course.

Primitive Types

Introduction To Primitive Types

string, number and boolean

null and undefined Types

bigint Type

symbol Type

★ Practice: The Primitive Types ★

★Solution: The Primitive Types★

A few quiz questions about primitive types that you have learned till now.

Exploring TypeScript's Type System

Introduction To TypeSystem

any Type

unknown type

Type Alias

Inference, Annotation, Duck Typing and Declaration

Union Types

Quick Conditional Types

Understanding Type Hierarchy

Type Casting

★Practice: Type System★

★ Solution: Type System ★

Objects In TypeScript

Introduction To Objects

Working With Objects

Type Alias For Objects

Nested Objects

Index Signatures With Objects

Optional And Readonly Properties

Union Types With Objects

Discriminating Unions

Intersection Types

★Practice: Strictly Type an Object★

★Solution: Strictly Type an Object★

Arrays And Enums

Introduction To Arrays And Enums

Strictly Typing Arrays

Tuples

Readonly Arrays and Tuples

Enums

Enums are Available At Runtime

Enums Vs Objects

Computed Enums

Enums as Unions and Types

★Practice: Arrays and Enums★

★Solution: Arrays and Enums★

This quiz can help you test your knowledge about arrays, objects, and other types offered by TypeScript.

Functions In TypeScript

Declaring Functions

Default and Optional Parameters

Custom Parameters And Return Types

Function Call Signatures

Anonymous Functions

void and never Types

Async Functions

Rest Parameters And Arguments

Parameter Destructuring

Introduction to Function Overloading

Function Overloading In TypeScript

★Practice: Functions in TypeScript★

★Solution: Functions in TypeScript★

A quiz to test how much you have learned about TypeScript functions.

Generics In TypeScript

What are Generics

Generic Function Declarations

Generic and Constraints With Arrays

Generics With Objects

keyof Type Operator

Generic Default Values

Implementing A Polymorphic Function

Problems With Function Overloads

Using Generics Instead Of Function Overloads

★Practice: Implement Map Function★

★Solution: Implement Map Function★

A complete section of classes in TypeScript and inheritance. Starts your Journey with Object Oriented Programming in TypeScript.

What Are Classes

Running TypeScript In Browser

Creating First Class And Instance

Constructor Function

this Keyword

Classes as Types

Optional And Readonly Fields

Inheritance With Classes

super Method

★ Practice: Classes Exercise 1 ★

★Solution: Classes Exercise 1★

Access Modifiers

public Members

Good to know

Know what's good

, what to watch for

, and possible dealbreakers

Designed for JavaScript developers seeking to enhance their skills, this course provides a pathway to leverage TypeScript for improved code maintainability and scalability in existing projects

Teaches TypeScript in conjunction with React, Material UI, React Query, Node, Express, TypeORM, and MySQL, which allows full-stack developers to build complete applications with modern technologies

Backend developers can benefit from the modules on NodeJS, Express, TypeORM, and MySQL, which are self-contained and allow focused learning on server-side TypeScript development

Frontend developers can focus on using TypeScript with React, Material UI, React Query, and Context API, which are presented as self-contained modules for targeted learning

Assumes some prior JavaScript knowledge, so new programmers may find it challenging without first establishing a basic understanding of JavaScript fundamentals

Explores TypeScript features not found in JavaScript, which helps developers transition to object-oriented programming and leverage advanced type checking for robust applications

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in TypeScript Masterclass 2024 Edition - React + NodeJS Project with these activities:

Review JavaScript Fundamentals

Show steps

Solidify your understanding of JavaScript fundamentals to better grasp TypeScript's extensions and how it builds upon JavaScript.

Browse courses on JavaScript Fundamentals

Show steps

Review data types, variables, and operators in JavaScript.
Practice writing basic JavaScript functions and control flow statements.
Familiarize yourself with JavaScript's object model and prototypes.

Read 'Effective TypeScript'

Show steps

Gain a deeper understanding of TypeScript best practices and advanced features by reading 'Effective TypeScript'.

View Effective Typescript on Amazon

Show steps

Read a chapter each week, focusing on the examples and explanations.
Try implementing the recommendations in your own TypeScript projects.

Read 'Programming React with TypeScript'

Show steps

Learn how to effectively use TypeScript with React by reading 'Programming React with TypeScript'.

View ASP.NET Core 3 and React: Hands-On full stack... on Amazon

Show steps

Read a chapter each week, focusing on the React-specific examples.
Experiment with the code examples in your own React projects.

Four other activities

Expand to see all activities and additional details

Show all seven activities

TypeScript Type Challenges

Show steps

Sharpen your TypeScript skills by completing type challenges, focusing on generics, conditional types, and mapped types.

Show steps

Find a website or resource that provides TypeScript type challenges.
Attempt to solve the challenges, focusing on understanding the underlying type system concepts.
Review the solutions and explanations to learn from your mistakes.

Convert a JavaScript Project to TypeScript

Show steps

Apply your TypeScript knowledge by converting an existing JavaScript project to TypeScript, reinforcing your understanding of type annotations and compiler options.

Show steps

Choose a small to medium-sized JavaScript project.
Configure the TypeScript compiler for the project.
Gradually add type annotations to the JavaScript code.
Address any type errors reported by the TypeScript compiler.

Write a Blog Post on TypeScript Decorators

Show steps

Deepen your understanding of TypeScript decorators by writing a blog post explaining their usage and benefits.

Show steps

Research TypeScript decorators and their various applications.
Write a clear and concise blog post explaining decorators with examples.
Publish the blog post on a platform like Medium or your personal website.

Contribute to a TypeScript Open Source Project

Show steps

Enhance your TypeScript skills by contributing to an open-source project, gaining experience with real-world codebases and collaboration.

Show steps

Find a TypeScript open-source project on GitHub that interests you.
Review the project's contribution guidelines and code style.
Identify a bug or feature to work on.
Submit a pull request with your changes.

Career center

Learners who complete TypeScript Masterclass 2024 Edition - React + NodeJS Project will develop knowledge and skills that may be useful to these careers:

Full-Stack Developer

A Full Stack Developer builds both the frontend and backend of web applications. This course is very helpful for aspiring full stack developers because it covers both frontend technologies like React, Material UI, and backend technologies such as NodeJS, Express, TypeORM, and MySQL, all with TypeScript. This course will help a full stack developer who is looking to learn TypeScript and how it fits into the broader ecosystem of web development tools.

See salaries and explore the career path for Full-Stack Developer

Frontend Developer

A Frontend Developer builds the user interface and experience of websites and applications, and this course is highly relevant. This role requires proficiency in languages such as JavaScript, and TypeScript which is a superset of JavaScript, adds static typing and other features which can make code more robust and maintainable. The course specifically teaches how TypeScript works with React, Material UI, and Context API, which are all commonly used in frontend development. A frontend developer who wishes to build scalable applications should take this course.

See salaries and explore the career path for Frontend Developer

Web Application Developer

A Web Application Developer is involved in all aspects of building web applications, from designing to implementation and testing. This course is a good fit for those in this career as it covers the use of TypeScript in both front-end (React, Material UI) and back-end (NodeJS, Express) technologies which are all vital to building complete web applications. A web application developer looking to master type-safe development will find this course very helpful.

See salaries and explore the career path for Web Application Developer

UI Engineer

A UI Engineer focuses on the development of user interfaces for websites and applications. This role has considerable overlap with a frontend developer, and this course will help a UI engineer by providing training in TypeScript, React, and Material UI, which are essential for modern user interface development. A UI engineer who wishes to write type safe code for user interfaces will find this course helpful.

See salaries and explore the career path for UI Engineer

Software Engineer

Software Engineers design, develop, and maintain software systems. This course can be helpful for software engineers particularly the sections on object-oriented programming, classes, inheritance, and advanced TypeScript features like generics and decorators. These will help a software engineer write better code and build larger scale applications. A software engineer looking to write more robust and maintainable code will find this course very helpful.

See salaries and explore the career path for Software Engineer

Backend Developer

Backend Developers are responsible for server side logic and database interactions for applications and websites. This course may be useful for this role as it includes modules teaching NodeJS, Express, TypeORM and MySQL. These are all backend technologies that can be used to build the server side of applications. Furthermore, the course demonstrates how these technologies can be used effectively with TypeScript. This is a course a backend developer should strongly consider, especially if they want to add type safety to their work.

See salaries and explore the career path for Backend Developer

Application Architect

Application Architects are responsible for the design and structure of applications. This course may be useful for an architect, because it teaches the use of TypeScript features such as classes, interfaces, and decorators, which help build maintainable and scalable applications. An application architect working in JavaScript who is seeking to build scalable and maintainable applications should consider this course.

See salaries and explore the career path for Application Architect

API Developer

API Developers focus on building interfaces that allow different software systems to communicate. This course may be useful to an API developer as it teaches how to use NodeJS, Express, and TypeORM, which are used for building APIs. The course also trains in TypeScript, which can help in building more reliable APIs. An API developer may find this course helpful if they seek to use TypeScript in their work.

See salaries and explore the career path for API Developer

Technical Consultant

Technical Consultants advise clients on technology solutions. This course may be helpful for consultants who are working with clients implementing web applications, especially if they are using TypeScript. This course will provide the consultant with an in-depth understanding of how TypeScript works, and help them guide clients using this language. A consultant who is advising clients using TypeScript should find this course valuable.

See salaries and explore the career path for Technical Consultant

Software Development Lead

A Software Development Lead oversees software development teams and projects, and this course could be useful. While this is not a managerial skills focused course, it develops a deeper understanding of how applications are built using TypeScript. As a lead, you must understand how TypeScript works to guide your team. A Software Development Lead who works in projects using TypeScript would find value in this course.

See salaries and explore the career path for Software Development Lead

Teaching Professional

A Teaching Professional in technology educates others on technical topics. This course may be useful for this role because it provides an overall view of TypeScript, its features, and best practices. A teaching professional looking to learn about TypeScript in order to teach the language to others may find this course helpful.

See salaries and explore the career path for Teaching Professional

Mobile Application Developer

While this course does not directly focus on mobile application development the skills acquired are valuable. For example, many mobile application frameworks use JavaScript and TypeScript. The object oriented principles of TypeScript, as well as its capacity to work with ReactJS can be beneficial to a mobile developer. A mobile application developer interested in adding type safety to their work, and/or familiar with JavaScript frameworks may find this course useful.

See salaries and explore the career path for Mobile Application Developer

DevOps Engineer

DevOps Engineers focus on automating and streamlining the software development lifecycle, including deployment and infrastructure. This role might find this course helpful as TypeScript is often used in the development of internal tools related to devops and infrastructure, particularly with NodeJS. A DevOps engineer who works on internal tooling or who wants to expand their knowledge of TypeScript may find this course useful.

See salaries and explore the career path for DevOps Engineer

Game Developer

Game developers create video games across different platforms. This course may be useful, as game development is often done in JavaScript and TypeScript, particularly for web-based games and game tooling. A game developer looking to improve their skills in TypeScript, and its associated ecosystem, may find this course useful.

See salaries and explore the career path for Game Developer

Database Developer

A database developer works with databases to store and retrieve data. This course may be relevant, because it includes training on TypeORM and MySQL although its primary focus is not databases. A database developer who wants to expand their knowledge of development tools which can interact with databases may find this course helpful.

See salaries and explore the career path for Database Developer

Reading list

We've selected two books that we think will supplement your learning. Use these to develop background knowledge, enrich your coursework, and gain a deeper understanding of the topics covered in TypeScript Masterclass 2024 Edition - React + NodeJS Project.

Effective Typescript

Save

Provides practical advice on writing maintainable and robust TypeScript code. It covers a wide range of topics, from basic type annotations to advanced techniques like generics and conditional types. It is particularly useful for understanding best practices and avoiding common pitfalls in TypeScript development. This book valuable resource for intermediate to advanced TypeScript developers.

ASP.NET Core 3 and React

Save

Focuses on using TypeScript with React, covering topics such as component typing, hooks, and context. It provides practical examples and guidance on building robust and scalable React applications with TypeScript. This book is particularly useful for developers who want to learn how to integrate TypeScript into their React workflow. It serves as a useful reference for those building React applications with TypeScript.

ASP.NET Core 3 and React: Hands-On full stack web...

Kindle Edition

TypeScript Masterclass 2024 Edition - React + NodeJS Project

What's inside

Learning objectives

Syllabus

Good to know

Save this course

Activities

Career center

Reading list

Share

Similar courses