MSK TypeScript Bootcamp

Name: MSK TypeScript Bootcamp
Rating: 4.5 (102 reviews)

Get started with TypeScript and start using Type annotations in your projects

Created byManoj Satishkumar

Last updated 12/2022

English

English [Auto],

What you'll learn

Learn about the problem with JavaScript
Learn the advantages of using TypeScript
Deep dive into primitive & special types
Learn about literal, array & object types
Master union, interface & tuple types
Discover function types & type aliases
Understand type assertions & inference
Hands-on coding with lab experiments.
Download all code snippets & resources
A certificate of completion

Course content

10 sections • 57 lectures • 3h 23m total length

Benefits of using TypeScript in your project4:13
See how TypeScript catches errors before production, reducing crashes and unhappy users. Experience a configurable, statically typed environment that helps manage edge cases and null checks in growing codebases.
18 benefits of adding TypeScript to your project2:45
Bootcamp instructions & guidelines0:43
Pre requisites for the bootcamp0:19
Creating your personal library of code snippets1:17
The "Car", "Bike" and "Plane" examples1:25
Explore programming fundamentals in TypeScript through three vehicle examples: car, bike, and plane, by creating objects, attaching fuel functions, and printing details, building a mind map for later reference.
Join our web dev community!0:27
Join the web development Telegram channel, MSJ web development, to connect with like-minded learners, ask questions, and know that I am active in the group; joining is optional.
Let's begin the TS journey0:25
Begin your TypeScript journey with hands-on lab experiments crafted from the instructor's experience and designed to be simple and accessible for everyone.
The Full Interview Kit1:09

Introduction0:49
What's wrong with JavaScript ?9:28
In this lecture, we will analyse a practical example of a simple adder function where javascript fails to intimate the developer about a potential error / bug introduced to the system that causes unintended behaviour at runtime causing corrupted production code.
Lab Experiment: JavaScript Runtime Querk!1:46
In this lab experiment, you will try to play with a sample javascript code in order to understand the fundamental problem with JavaScript during runtime.

Introduction1:45
Bootstrap project setup15:48
Let's set up a bootstrap playground project from scratch which will help you understand each topic / concept we discuss throughout this Bootcamp. You will also have the ability to change code and observe the behaviour.
You can also see the errors via either VS Code intellisense or during compilation.
VS Code extensions2:51
VS Code extensions are really handy. So install these in your local machine so that it matches my setup. This will make it easy for you to annotate and color code as we try to understand various TS concepts.
The TypeScript online playground2:45
Explore the TypeScript online playground to paste code, compile to JavaScript, and view errors with options like target and tsconfig, then apply these concepts on your local machine.
Exploring TS Compiler options / flags1:00
Lab Experiment: TS Compilation0:32
Lab Experiment: Stopping TS Compilation0:38
TypeScript & it's Compiler Quiz

Introduction0:56
Explore the basics of TypeScript, distinguishing its primitive types from JavaScript, learn how TypeScript adds custom types, object types, and interfaces, and practice annotating types in hands-on labs.
Primitive Types Walkthrough9:06
Learn how TypeScript maps JavaScript primitive types, and declare explicit types for string, number, boolean, null, undefined, big int, and symbol. Observe how the TypeScript compiler outputs plain JavaScript.
Array Type7:21
Learn how TypeScript enforces array types with strings, numbers, and booleans through examples like car models and lucky numbers, and annotate functions and return types to avoid errors.
Union Types11:25
Type aliases10:09
Lab Experiment: Annotating basic types0:43
The "Function" Type5:01
Interfaces6:08
Explore interfaces in TypeScript, a scalable alternative to type aliases, learn how to declare an interface, include methods, and enforce objects adhere to the interface in large projects.
Object types8:26
Lab Experiment: Interface type and object1:02

Introduction1:00
Special Type | "any"8:41
Explore how the any type in TypeScript lets variables accept any value, from strings and numbers to objects, while highlighting risks of bypassing type checking and common pitfalls.
Special Type | "unknown"7:31
Special Type | "void"4:01
Discover how TypeScript's special void type represents no return value, distinguishing it from undefined, and how to annotate a function with void for clearer typing.
Special Type | "never"11:09

Introduction0:42
Explore how TypeScript extends literal concepts from JavaScript by defining literal strings and numbers as little types that constrain variables to specific values.
Literal Types walkthrough4:21
TypeScript lets you create literal types that contain exact values, like Honda or 2021, using const, type keywords, and unions to enforce strict, specific values.
Literal Inference4:25
Example | Union combination1:18
Example | Non literal combination2:38
Explore declaring custom types by combining non-lethal types using unions, interfaces, and literals in TypeScript, then apply to a car example with make as a string.

Introduction1:19
Annotating Tuple types8:13
Using tuple for API responses1:50
Declare the API response as a tuple to manipulate an array with a known order, ensuring nomenclature (model, make) and avoiding runtime errors when item meanings or counts are unknown.
Tuples with Interfaces3:09
Explore declaring a tuple with an interface in TypeScript, enforcing a fixed length and item types (number, string, boolean) using numeric keys and unions like India or US.
Specifying optional properties2:37
Read only tuples1:29
Learn how to mark a double as read-only in TypeScript, preventing any item from being reassigned and surfacing errors with read-only properties.
Array assertion inference2:28
Rest parameter elements5:02
Learn to use rest parameters in TypeScript with the spread syntax, defining a tuple: first a number, second a string, and the rest as numbers, illustrated with a card table.
Lab Experiment: Tuple annotation0:34

Requirements

No prior knowledge of TypeScripe is needed
Very basic JavaScript knowledge is good to have
Interest to explore TypeScript and its features
You will learn everything from scratch

Description

TypeScript is a superset of JavaScript developed at Microsoft by Anders Hejlsberg ( designer of C# ) in the year 2010 and open-sourced in 2012. TypeScript adds a handful of new features to JavaScript and takes it to the next level in modern web development.

There are a lot of advantages if you add TypeScript to your JavaScript-based projects like:

You can catch bugs errors during the development phase itself rather than runtime.
Debugging is much easier & you will have bug-free production code and feel safe.
With static type-checking, it becomes easier for you to spot errors and edge cases.
Saves a lot of developer's time in fixing unidentifiable runtime bugs.
TypeScript adds advanced features like generics, modules & namespaces.
Your projects will be easily understandable by other developers.
Your project will have excellent developer experience ( DX ) and team velocity.
Helps you write less code than JavaScript & improves readability.
Source code documentation will be much better.
TypeScript code is easier to refactor and reliable. Hence easier to maintain.
Since JavaScript is a subset of TypeScript, you can use all JavaScript libraries.
You can incrementally upgrade your JavaScript files on the go.
TypeScript is a powerful tool for large applications

After completing MSK TypeScript Bootcamp, you will be able to:

Understand the problem with JavaScript for large scale applications.
Add TypeScript to your JavaScript projects with the compiler configuration.
Include TypeScript and start adding type annotations in your JavaScript projects.
Fully understand all the types supported by TypeScript in depth.
Feel confident in your front-end interview and talk about TypeScript.
Download all the code snippets and create your personal reference notes.

This Bootcamp features hands-on coding lab experiments which are both fun and useful. They will help you understand concepts and play around with TypeScript features. You will have the opportunity to keep those examples for your reference as we advance ourselves to learn more TypeScript features in this series of upcoming Bootcamps.

Your journey to become a master of TypeScript begins here.

Let's get started...

Who this course is for:

Anyone interested to learn TypeScript and upskill themselves in career.
Anyone preparing for frontend interviews where TypeScript is needed.
Beginner JavaScript developers who want to upgrade to TypeScript.
No paid softwares are needed in this bootcamp. Editor and extensions are free.
A computer with access to the internet needed ( Mac / Windows or Linux )
I will teach you pretty much everything from scratch. So don't worry.

MSK TypeScript Bootcamp

What you'll learn

Explore related topics

Course content

Bootcamp Introduction & Guidelines9 lectures • 13min

The Problem with JavaScript3 lectures • 12min

Local machine setup7 lectures • 25min

Primitive Type annotations10 lectures • 1hr

Interface VS Type alias4 lectures • 9min

Special Type annotations5 lectures • 32min

Dive into Literal Types5 lectures • 13min

Understanding Tuple types9 lectures • 27min

Few Important concepts4 lectures • 10min

The Finish Line1 lecture • 2min

Requirements

Description

Who this course is for: