Thanks for sharing the video. Feel free to ask any doubt here, I will try to answer them. Also, I am on my way to contribute more videos to #freecodecamp Stay tuned
🎯 Key Takeaways for quick navigation: 00:00 📖 Introduction to the TypeScript Tutorial Series 01:21 🧐 Understanding TypeScript's Place in the Ecosystem 02:17 🚀 Diving Deep into TypeScript Characteristics 03:37 💡 The Importance of TypeSafety in TypeScript 04:59 🔍 TypeScript and TypeSafety 06:46 🎢 Beginning the TypeScript Journey 07:42 🛠️ Understanding TypeScript's Core Functionality 09:30 🖥️ TypeScript's Role in Development 10:52 🔄 Conversion of TypeScript to JavaScript 11:50 🧰 TypeScript as a Development Tool 15:23 📘 The Importance of Hands-On Learning 16:23 🖥️ Installing TypeScript System-Wide 17:45 🔧 TypeScript Installation Steps 20:57 🚀 Running TypeScript with TSC Command 21:55 🎯 Setting Up the Development Environment 22:18 ✍️ Basic TypeScript Syntax 24:11 🔧 Compiling TypeScript to JavaScript 26:03 ⚙️ TypeScript Configuration & Playground 27:19 🎓 Emphasis on Documentation & Learning Pace 28:42 📊 Understanding TypeScript Types 29:58 🚫 The Use of "any" in TypeScript 31:25 📚 TypeScript Documentation Exploration 32:19 🤝 TypeScript's Role in Collaboration 34:04 💡 TypeScript Syntax Basics 35:55 🔧 TSC Compilation and Handling Errors 36:52 🚫 Ensuring Data Type Consistency with TypeScript 37:41 🧐 Importance of Reading Documentation 38:34 🖊️ Writing and Understanding TypeScript Code 40:26 💡 Dive into Number Data Type in TypeScript 43:16 🛑 Avoiding Over-Annotation in TypeScript 44:11 🧠 TypeScript's Type Inference Mechanism 46:03 📖 TypeScript Syntax and Best Practices 46:56 ⚠️ Misuse of the "any" Keyword in TypeScript 48:21 📚 Official TypeScript Documentation on "any" 50:35 🚫 Avoiding "any" for Robust TypeScript Coding 51:30 🧐 Proper Use of Functions in TypeScript 52:26 📝 Basics of Function Creation and Error Handling 54:41 🚫 Avoiding Inaccurate Type Annotations 56:29 🔄 Converting Data Types within Functions 57:25 ✍️ User Signup Function Demonstration 57:51 🚦 Sign-Up Function Parameters and Types 59:44 🖊️ Login Function and Default Parameters 01:02:05 🔍 Ensuring Accurate Return Values 01:03:25 🌐 TypeScript Philosophy and Application 01:04:49 🛠️ Annotating Return Types in Functions 01:06:33 🔁 Understanding Multiple Return Types 01:07:58 🔄 Looping through Arrays with Map 01:11:10 📚 Redirecting to Documentation for Advanced Functions 01:12:06 ⚠️ Specifying Return Types: Void and Never 01:15:37 🧩 Odd Behaviors in TypeScript 01:16:34 📜 Objects in TypeScript 01:19:10 🛠️ Function Definitions & Object Exports 01:20:59 🔄 Functions Returning Objects 01:22:52 🤔 Odd Behaviors & Object Handling 01:25:11 📜 Type Aliases Introduction 01:26:36 👥 Using Type Aliases for User Data 01:28:49 📖 Documentation & Practical Usage 01:32:21 🔍 Quirky Behaviors & Specific Keywords 01:34:33 🚫 `read only` and Optional Properties in TypeScript 01:39:08 🔄 Combining Multiple Types 01:42:18 📋 Understanding Arrays in TypeScript 01:42:46 🌐 Defining Arrays in TypeScript 01:48:48 📖 TypeScript Array Documentation Review 01:50:12 🤝 Introduction to Union Types 01:50:38 🎤 Importance of Contextual Understanding 01:51:06 🤹♂️ Introduction to Union Types in TypeScript 01:53:24 🎥 Subscriber Engagement and Advanced Union Usage 01:58:56 🔍 Union Narrowing & Type Checking 02:00:44 📊 Union Types in Arrays and Classic Mistakes 02:04:46 🧩 Introduction to Tuples 02:07:03 📜 Restricting Array Order with Tuples 02:10:17 💡 Practical Implementation and Caution 02:14:20 🚩 Introduction to Enums 02:14:49 🎯 Enums: Definition and Basics 02:17:11 ⚙️ Implementing Enums in TypeScript 02:20:15 🔄 Enum Value Interpretation 02:22:24 🔄 Use of `const` with Enums 02:23:44 👤 Introduction to Interfaces 02:28:16 📜 Methods in Interfaces 02:30:09 🔖 Defining Methods in Interfaces 02:33:17 🖥️ Understanding the Role of Interfaces 02:34:14 🚀 Extending Interfaces & Inheritance 02:37:51 📚 Distinction between Type and Interface 02:39:16 🛠️ TypeScript in Production 02:41:08 🚀 Setting Up TypeScript for Projects 02:45:40 ⚙️ TypeScript Compilation Configuration 02:47:54 🌐 Using Live Server for TypeScript Projects 02:52:02 🎨 Styling and Further TypeScript Discussion 02:53:51 🌌 Introduction to Advanced TypeScript Use 02:54:45 🎓 Creating Classes in TypeScript 02:57:26 🔒 Using TypeScript for Data Safety 03:00:46 🛡️ Read-only Properties in TypeScript Classes 03:02:12 📌 Advanced TypeScript Concepts 03:03:08 🔐 Modifiers in TypeScript 03:07:40 🚀 Getters and Setters in TypeScript 03:09:58 📝 Setters in TypeScript 03:13:40 🚫 Private Methods in TypeScript 03:15:28 🔒 Access Modifiers and Inheritance in TypeScript 03:17:46 🖼️ Additional Class Properties in TypeScript 03:19:52 📐 Interfaces in TypeScript Explained 03:23:57 📹 Extending Interfaces for Additional Features 03:26:06 📜 Introduction to Abstract Classes in TypeScript 03:29:15 🖥️ Practical Implementation of Abstract Classes 03:33:18 🚀 Advanced Features of Abstract Classes 03:34:15 🔄 Abstract Classes Recap and Method Overwriting 03:35:41 🔗 Introduction to Generics in TypeScript 03:38:23 📖 Generics in Practical Coding and Documentation 03:42:21 🛠️ Differentiating Generics from Any in TypeScript 03:45:33 🍾 Creating and Implementing Custom Generics 03:47:48 📘 Diving Deeper into Generics and Arrow Functions 03:50:09 🔍 Basics of Defining Generics in TypeScript 03:52:47 🔄 Arrow Functions and Generics in TypeScript 03:55:29 📘 Distinguishing Generics Syntax in Codebases 03:56:20 🏛️ Deep Dive into Generics and its Constraints 03:57:49 📜 Using `extends` Keyword in TypeScript 04:01:28 📁 Database Interface and Generic Constraints 04:02:45 🎓 Selling Courses and Quizzes: Class Types in Generics 04:05:51 🛍️ Generic Class for Handling Products 04:07:12 📘 Business Case Logic vs Traditional Problems/Solutions 04:09:32 🚧 Cautionary Tales in TypeScript 04:14:26 📚 Understanding Type Guards 04:17:09 🔍 Advanced Type Narrowing Techniques 04:22:16 📉 More on Type Narrowing 04:22:45 🎯 Narrowing TypeScript Types 04:25:27 🐟 Using Type Predicates in TypeScript 04:29:33 🔄 Type Coercion and Identification 04:30:56 📄 Documentation-Based Learning 04:31:50 ⚙️ Tight Narrowing - Final Steps 04:37:10 🔄 Never Type & Exhaustive Checks 04:39:39 📚 Advanced TypeScript Concepts 04:42:55 🏁 Concluding the TypeScript Series Made with HARPA AI
Enums stands for Enumerations. Enums are a new data type supported in TypeScript. It is used to define the set of named constants, i.e., a collection of related values. TypeScript supports both numeric and string-based enums
To my experience, Enums are the perfect balance between having to create an entire class for passing some data in a readable manner, and passing raw data (like numbers) to represent a certain meaning which you have in mind, which makes the code less readable and maintainable That being said, I am a C# developer and just starting out with typescript, but i assume the benefits apply here as well
Just finished the tutorial. Hitesh is a wonderful teacher. I enjoyed from start to finish. I would definitely recommend this tutorial to anyone looking to not only understand Typescript, but also how to read and understand documentations.
Hey, thank you for the course, but I think you might be wrong at 1:18:30 You create a function "createUser", that takes in object with "name" and "isPaid" properties. But instead of giving them a type, you destructuring the object and reassigning "name" to "string" and "isPaid" to "boolean", But object itself still has "any" type! function createUser({ name: string, isPaid: boolean }) {} Same as: function createUser({ name: string, isPaid: boolean }: any) {} Almost same as: function createUser({ name, isPaid }) { ---> type is still "any" const string = name const boolean = isPaid } I think you wanted to to something like this instead: function createUser({ name, isPaid }: { name: string, isPaid: boolean }) {} Or this: type User = { name: string, isPaid: boolean } function createUser({ name, isPaid }: User) {} Y'all can try to code this in typescript playground, if you don't believe me www.typescriptlang.org/play Info about Destructuring assignment (from MDN): developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment I hope it will help someone to feel less confused in this tough topic
Huh glad you took the time to write this comment clarifying that, I was replicating what he did in Typescript playground and it was erroring, I then I asked ChatGPT what was wrong with the function and the response was basically changing the structure of the function to how you have done it in your comment. Thanks for doing that good man!
thanks for exaplanation but what's the difference? I can still do this function createUser2({ name, isPaid }: { name: string; isPaid: boolean }) {} let sampleData ={ name: "John", isPaid: true , age: 25} createUser2(sampleData)
In JS, the array type (object type) is the reference type. This means that the variable store the reference (address) of the array or object instead of its value. So when you manipulate an array or object, the variable doesn't change because it always equals the address of the array in memory. Const and "readonly property" only ensure that variables do not change
🎯Course outline for quick navigation: [00:00-21:43]1. Typescript and its importance -[10:40-11:09]Typescript allows transpiling typescript code into javascript for building components like react, using .tsx extension. -[15:04-15:40]Typescript is a development tool dependent on javascript. setting up an environment to write typescript will be covered in the next video. -[17:00-17:58]Focus on core system wide typescript installation and project configuration for better code production. -[20:22-20:52]Installed typescript using sudo command, quick and simple process. [21:43-46:57]2. Typescript in vs code and its basics -[27:24-27:53]Hitesh introduces typescript series, starts slow, picks up pace later. -[37:47-38:14]Collaborators can benefit from safety features in code, preventing errors like 'property touppercase does not exist on type number'. -[39:18-39:51]Vaish introduces a new video on typescript series, focusing on best practices and covering numbers, booleans, strings, and type inference. -[41:46-42:12]Javascript has limited number-related methods, like toexponential and tolocalestring. -[44:48-45:15]Using typescript for better code, it detects and prevents errors, ensuring type safety. -[46:26-46:57]Tutorial on typescript, emphasizing colons and types, urging 70 non-subscribers to subscribe. [46:57-01:01:02]3. Typescript best practices -[57:40-58:10]During user sign up, name, email, and password are requested, but they are marked as 'any' type. -[01:00:16-01:00:51]Discussing passing default values for email and paid in a simple string and boolean format, without encountering any complaints. [01:01:02-01:14:52]4. Typescript syntax, benefits, and functions overview -[01:03:16-01:03:44]Typescript emphasizes philosophy of type usage, enhancing javascript. -[01:03:47-01:04:14]Returning 'hello' instead of a number, a concern for team collaboration. -[01:06:43-01:07:11]Introduction to handling multiple return types in typescript, using union types, to be discussed in a separate video. [01:14:52-01:53:31]5. Understanding typescript fundamentals -[01:27:47-01:28:22]Creating a simple function to define and enforce user data types in typescript. -[01:31:30-01:31:56]Simplify function definitions to avoid lengthy and complex code. -[01:38:21-01:38:46]Working on typescript config to stop producing code. mention of credit cards. [01:53:32-02:14:12]6. Typescript union, literal types, and tuples -[01:55:22-01:55:51]Typescript allows using multiple types of data, such as 334, without causing errors, making it really useful. -[01:59:26-01:59:54]The code is being checked for lower case and string verification at line number 30. -[02:05:20-02:05:53]Tuples in typescript are useful but with limitations. caution advised based on stack overflow thread. -[02:07:29-02:07:58]Converting data into a tuple, including string, number, and boolean types. -[02:13:04-02:13:51]In a javascript article on stack overflow, a user discusses issues with typescript array push method not handling tuple type arrays, which was posted a year and 11 months ago. [02:14:13-02:38:48]7. Typescript enums, interfaces, and methods -[02:15:24-02:15:52]Enums restrict choices in e-commerce orders, e.g., wish list, delivered, shipped, returned. -[02:27:49-02:28:17]Read-only fields, like a db id, should be numbers, not optional, and filled in. the advantage is similar to past studies. -[02:29:21-02:29:50]Method must be compulsory and return a string, such as 'trial started.' -[02:34:43-02:35:16]Integrating a library from github can require adding missing interfaces and files. -[02:35:39-02:36:08]Adding a github token as a string property and accessing functionality through declared variable or constant is a typescript feature loved by many. -[02:36:33-02:36:58]Using 'extends' keyword to inherit properties and defining roles for admin. -[02:37:35-02:38:03]Using interfaces in typescript allows for easy extension and inheritance, but caution is needed to avoid conflicts with installed packages or libraries. [02:38:49-02:53:12]8. Typescript basics, production setup, and node project -[02:40:21-02:48:59]Creating and configuring a typescript project for production, including typescript compiler and output directory setup. -[02:51:45-02:52:11]Set up lite server in package.json and enable watch mode for typescript changes. -[02:52:28-02:52:56]Using 'live server' for web development rather than a light server, as it is more efficient and requires no additional packages. [02:53:12-03:13:03]9. Typescript classes and setup -[02:53:51-02:54:17]Late night video session discussing setting up a typescript server for file generation and production-grade server for writing typescript. -[03:06:53-03:07:24]Choosing to make all items public, reflecting syntactic sugar in professional coding practices. -[03:07:50-03:08:22]Introduction to getters and setters in javascript, discussing private methods and syntax. -[03:08:42-03:09:14]Using getters and setters to access and manipulate data in software development. [03:13:03-03:26:37]10. Typescript classes, interfaces, and usage -[03:15:28-03:15:55]Access modifiers in programming restrict property access. -[03:21:25-03:21:54]The interface will include additional properties such as a filter and photo burst mode. it will be the basis for the entire application. [03:26:37-04:08:23]11. Typescript abstract classes and generics -[03:31:56-03:34:49]Creating an advanced class with properties, implementing abstract methods, and utilizing typescript features. -[03:43:04-03:43:28]Defining specific data types and return values, including 'any' type. -[03:48:32-03:49:01]Learning to use arrow functions in typescript, exploring documentation examples. -[03:49:23-03:49:55]The video discusses defining arrays with possible cases and confusion in building them. -[04:00:07-04:00:32]Function expects numeric values, but problem arises with strings. [04:08:23-04:46:24]12. Typescript type narrowing and discriminated unions -[04:27:42-04:28:07]Code involves checking if a method is not undefined, then returning pet as a fish. -[04:36:12-04:36:38]Creating a function to determine true shape from circle or square. -[04:38:40-04:39:15]Code review with exhaustive check, only two cases. -[04:39:27-04:39:52]New payment status 'authorized' introduced, alongside 'captured' and 'refunded'. -[04:45:58-04:46:21]Encouraging support for sharing and enjoying the series. offered by Coursnap
I recently finished a Typescript course and wanted to thank the instructor for such an informative and helpful tutorial. As a beginner, I was able to easily follow along and understand the concepts thanks to the clear explanations and examples provided. I feel much more confident in my ability to use Typescript in my projects now. Thank you for your hard work and for sharing your knowledge with others!
@@nitilpoddar to be honest i haven't applied for any typsecript related job but this video helped m in my current company as our projects are shifting to adonis framework which uses typescript
Yes! We can push elements to read-only properties having type array; because arrays are not explicitly represented, but only by their memory address. So, technically we are not changing the memory address of array by pushing elements inside it, and READONLY still validates upon the address of the array.
I learned JS as my first language and C# as my 2nd. TS is basically a combination of the two, and in a good way. Great series and you're an awesome teacher Hitesh!
Damn. Back in the days when I was learning coding I learned alot of Hitesh. Thank you very much for the helpful content. Time to learn TypeScript from this chad again. ✨
1:36:37 yes we can push it because typescript perceives read-only as editable or modifiable but not re-assignable, like we are not able to do something User._id = ["new.id'], since we are allowed to change the value but we can make changes to preexisting value.
my timestamps: 2:24:03 (thursday/wednesday) 3:15:25 (friday) 3:19:36 (saturday) 4:07:16 (sunday) FINISHED! (monday) hope you guys can do it too :) good luck!
The flow of the tutorial was really great. Each topic is discussed very appropriately. And the approach to make the people read documentation is splendid and seen for the first time any instructor emphasizing upon it. Looking forward to a similar comprehensive course on Next.js and prerequisite for it from the same instructor if possible.
I was wanting to start learning typescript. Randomly I started today anyway and from google then freecode got over there and started with the course. 1/3rd is done. Great until now and will resume. I noticed that this was uploaded just a day ago so I believe my luck wanted me to wait so that I can learn from you. Thanks
if someone was struggling with it - seems like in newer versions of typescript it might be crucial to define the argument name when trying to annotate types for a function object argument input: example: function createUser(user: {name: string, email: string, isPaid: boolean}) instead of: function createUser({name: string, email: string, isPaid: boolean}) at least what I got when trying to follow along - the code editor and it's typescript checker seemed to treat the latter definition as if I was destructuring the argument, not type-annotating it.
Thank you @Hitesh for creating a very easy-to-understand course. This is the 1st time I have seen approx 5 hours video tutorial and have not skipped a single part. This was on my todo watchlist for a very long time.
Just now I finished the course.. I believe that I am now familiar with typescript syntax. Thank you hitesh for this amazing course. Keep up the good work 😊
For 43:30, keep in mind that there ARE cases where type inference is bad and you'll want to be type explicit. One such case is when the code gets complex enough that to figure out what type it should be requires hunting through multiple files, in this case explicitly typing is a good idea to prevent a change many files away from breaking your code (without throwing error at compilation). There are other cases, too. So it is generally preferred, but not required, to avoid explicit typing. You will usually know when that is the case.
i have completed this series today within 4-5 days and gained lot of knowledge required to get start with typescript thanks hitesh sir for the helpful knowledge it was a great run
at 4:30:56 , boolean is returned - and not a type . The boolean value informs the TS type system that if true - pet is of type Fish else if False then pet is of Type Bird . So it merely informs - but what is being returned is boolean indeed.
2:12:55 I think now TS have introduced that ability for the tuple to restrict pushing or changing the value of array using index to any other type of value than specified. I am currently using v5.1.6
2:14:29 looks like if you make the type readonly like ` type User = readonly [number, string] ` OR `const newUser: ReadOnly then it will hint you with a type error when you try the .push() method
Just right now i am at 4:42:56 and i am getting a very positive feeling i have learn a lot from this video , words cannot describe how great learning experience was . Thank you very much sir
⭐ Contents ⭐ ⌨ (0:00:00) Why to learn TypeScript ⌨ (0:07:08) TypeScript is not what you think ⌨ (0:15:25) How to install TypeScript ⌨ (0:27:33) Your first intro to TypeScript docs ⌨ (0:39:21) Number, boolean, and type inference ⌨ (0:39:21) Number, boolean, and type inference ⌨ (0:46:52) Don't use ANY ⌨ (0:51:30) Do you really know functions ⌨ (1:02:55) A better way to write function ⌨ (1:15:38) Bad behavior of objects ⌨ (1:25:14) Type Aliases ⌨ (1:32:28) READONLY and optional ⌨ (1:42:13) Array ⌨ (1:50:03) Union Types in TS ⌨ (2:04:46) Tuples ⌨ (2:14:33) Enums ⌨ (2:24:03) interface ⌨ (2:33:52) Interface vs Type ⌨ (2:39:08) How to setup Typescript for real projects ⌨ (2:53:44) Classes ⌨ (3:02:06) Private Public ⌨ (3:08:12) Getters and Setters ⌨ (3:15:25) Protected ⌨ (3:19:34) Why Interface is important ⌨ (3:26:05) Abstract class ⌨ (3:35:36) Generics ⌨ (3:47:58) Generics in Array and Arrow functions ⌨ (3:56:07) Generic Classes ⌨ (4:07:16) Type Narrowing ⌨ (4:17:04) The in operator narrowing ⌨ (4:22:17) Instanceof and Type Predicates ⌨ (4:31:35) Discriminated Union and Exhaustiveness Checking with never ⌨ (4:42:54) TypeScript End
Beautifully explained, Hitesh, thank you so much. As a beginner I find so useful to be able to learn not only theory but also how it actually works in practice and most common mistakes we can make. This was amazing! 👏👏👏👏👏
I swear this is the best tutorial of TYPESCRIPT i've ever seen. I've got 2 udemy popular courses on UDEMY, but this is far more understandable and straight to the point explanation. thank you @hitesh
I was actually looking for a typescript tutorial since 2 days. Started many but then saw your post on Linkedin. I hope it will be a good one. Starting now
Hi Hitesh, Thanks a lot for your contribution and I appreciate it. if id would be an array, can we push values to the array in the case of READONLY? Answer: Yes. it allows push and pop operations. type testId = { readonly _id: Array name: string } let testIdOne: testId = { _id: [1, 2, 3], name: "ns" } testIdOne._id.push(4); testIdOne._id.push(5); console.log("result->", testIdOne); "result->", { "_id": [ 1, 2, 3, 4, 5 ], "name": "ns" }
I've traded with a lot of individuals but have never come across anyone as good as Mrs Walls , just by applying his new strategies I now trade independently. He's the best I can advise any novice investing to trade with him
TypeScript is a popular programming language based on JavaScript Click to expand 00:05 ✦ TypeScript allows writing more precise JavaScript with less errors. 02:50 ✦ TypeScript provides static checking to analyze code for potential errors. 08:20 ✦ TypeScript is a development tool for writing better, more scalable, and maintainable JavaScript code. 10:59 ✦ Install TypeScript on your system 16:07 ✦ Install TypeScript globally for system-wide usage 18:34 ✦ TypeScript converts JavaScript code into TypeScript for safer development. 23:20 ✦ TypeScript playground and TS config settings 25:57 ✦ TypeScript documentation guidelines and topics overview 30:47 ✦ TypeScript ensures expected data types, reducing errors. 33:05 ✦ TypeScript provides safety by catching errors at compile time 37:53 ✦ TypeScript treats numbers as a single type instead of distinguishing between integers and floats. 40:02 ✦ Type inference in TypeScript is smart and detects errors. 44:46 ✦ Avoid exhaustively using the 'any' keyword in TypeScript 47:08 ✦ Learn TypeScript functions end-to-end 51:58 ✦ TypeScript enforces strict typing to avoid errors and ensure code quality. 54:13 ✦ TypeScript focuses on strong typing and error checking 58:40 ✦ Setting default values in TypeScript 1:00:59 ✦ Overview of functions and scenarios in TypeScript 1:05:34 ✦ Functions with non-void type must return a value 1:07:54 ✦ Understanding the void and never return types in TypeScript functions 1:12:42 ✦ Using objects in TypeScript for better software writing. 1:15:13 ✦ Creating and returning objects in TypeScript. 1:20:00 ✦ TypeScript's odd behavior regarding object return 1:22:38 ✦ Creating custom types in TypeScript 1:27:24 ✦ TypeScript helps standardize and reuse common types 1:30:12 ✦ Defining and using user types in TypeScript 1:35:17 ✦ TypeScript provides strong typing and prevents certain errors in JavaScript 1:38:02 ✦ Understanding the 'never' type and array type in TypeScript 1:43:28 ✦ TypeScript allows defining specific data types and their properties. 1:46:00 ✦ Use union types to handle multiple data types 1:51:23 ✦ TypeScript allows strict type definition for user and admin hierarchy. 1:53:51 ✦ Narrowing down and verifying types in TypeScript 1:59:28 ✦ Arrays in TypeScript can have either all numbers or all strings. 2:02:06 ✦ Tuple in TypeScript allows defining a fixed order of data in an array. 2:07:35 ✦ TypeScript allows you to define strict type requirements for your data. 2:10:05 ✦ Enums are useful for restricting user choices. 2:15:19 ✦ Enums allow defining a set of named constants 2:17:51 ✦ TypeScript restricts code writing but generates clean and simple JavaScript code. 2:22:57 ✦ Interfaces provide a basic protocol for creating user objects. 2:25:33 ✦ TypeScript allows defining interfaces with compulsory parameters. 2:30:36 ✦ Interfaces in TypeScript are like an interface for hardware in an operating system. 2:33:12 ✦ Difference between type and interface in TypeScript 2:38:05 ✦ Learn how to initialize TypeScript and see the available options in the TypeScript config file. 2:40:38 ✦ TypeScript compilation and distribution process 2:46:05 ✦ Setting up a server using npm packages 2:48:43 ✦ Creating classes in TypeScript requires specifying data types. 2:54:30 ✦ Creating objects from classes in TypeScript is simple 2:57:09 ✦ Learn TypeScript modifier keywords like public and private 3:02:36 ✦ Understanding public and private modifiers in TypeScript 3:05:09 ✦ Designing getters and setters in TypeScript for a course count property. 3:10:21 ✦ Understanding the concept of getters and setters in TypeScript. 3:12:50 ✦ Explaining protected access modifier in Typescript 3:18:17 ✦ Defining an interface for taking photos in TypeScript 3:21:00 ✦ Understanding abstract classes in TypeScript 3:26:15 ✦ Difference between using 'extend' and 'implement' 3:28:52 ✦ Abstract classes help define class structure and compulsory methods. 3:34:21 ✦ Generics are a major part of TypeScript allowing for reusable and consistent APIs. 3:36:56 ✦ Understanding TypeScript identity types 3:42:10 ✦ TypeScript allows defining and using generic types 3:44:50 ✦ Introduction to TypeScript generics 3:49:42 ✦ Conversion of a regular function to an arrow function with generics. 3:52:07 ✦ Using generics to create reusable functions with type constraints 3:57:19 ✦ Using generics in TypeScript 4:00:00 ✦ Generic class for handling any type of object 4:05:28 ✦ Understanding narrowing in TypeScript 4:08:13 ✦ TypeScript emphasizes caution with data types 4:13:47 ✦ Cover all cases including when the value is nothing or an empty string 4:16:25 ✦ Type narrowing for better precision 4:22:04 ✦ TypeScript introduces 'instanceof' for checking if an object is an instance of a class 4:24:45 ✦ Type casting with pet is fish syntax 4:30:02 ✦ Using discriminated union to differentiate shapes in TypeScript 4:32:45 ✦ Handling default cases in TypeScript 4:38:38 ✦ Using 'never' type as a default method checker
Completed the entire video and I am very thankful to the instructor for covering the topics with good instructions and examples. Loved it and can't wait to implement typescript on some projects, Cheers 🥂👩💻
You are an awesome teacher Hitesh Choudhary . Clear communication , well explained. first time looking at your learning series. very well explained on basics concepts . looking forward to learn from your tutorials.
This is a good lesson. It demystifies the difference between typescript and JavaScript. I am much more confident to learn other web technology after watching this wonderful video.
Thanks for sharing the video. Feel free to ask any doubt here, I will try to answer them. Also, I am on my way to contribute more videos to #freecodecamp
Stay tuned
❤️
Keep publishing such amazing content❤️
#women_life_freedom
#برای
❤️thnx Hitesh
Sab
After this course I learned that 70% of viewers are not subscribers and we shall hit the subscribe button. Thank you Hitesh
What about Typescript? Didn't you learn that? 😅
@@Abdlmnn1 no 😀
Hahaha. So true. I’m gonna go subscribe now. Like 20 times.
This is amazing typescript series I love it❤❤
😂
🎯 Key Takeaways for quick navigation:
00:00 📖 Introduction to the TypeScript Tutorial Series
01:21 🧐 Understanding TypeScript's Place in the Ecosystem
02:17 🚀 Diving Deep into TypeScript Characteristics
03:37 💡 The Importance of TypeSafety in TypeScript
04:59 🔍 TypeScript and TypeSafety
06:46 🎢 Beginning the TypeScript Journey
07:42 🛠️ Understanding TypeScript's Core Functionality
09:30 🖥️ TypeScript's Role in Development
10:52 🔄 Conversion of TypeScript to JavaScript
11:50 🧰 TypeScript as a Development Tool
15:23 📘 The Importance of Hands-On Learning
16:23 🖥️ Installing TypeScript System-Wide
17:45 🔧 TypeScript Installation Steps
20:57 🚀 Running TypeScript with TSC Command
21:55 🎯 Setting Up the Development Environment
22:18 ✍️ Basic TypeScript Syntax
24:11 🔧 Compiling TypeScript to JavaScript
26:03 ⚙️ TypeScript Configuration & Playground
27:19 🎓 Emphasis on Documentation & Learning Pace
28:42 📊 Understanding TypeScript Types
29:58 🚫 The Use of "any" in TypeScript
31:25 📚 TypeScript Documentation Exploration
32:19 🤝 TypeScript's Role in Collaboration
34:04 💡 TypeScript Syntax Basics
35:55 🔧 TSC Compilation and Handling Errors
36:52 🚫 Ensuring Data Type Consistency with TypeScript
37:41 🧐 Importance of Reading Documentation
38:34 🖊️ Writing and Understanding TypeScript Code
40:26 💡 Dive into Number Data Type in TypeScript
43:16 🛑 Avoiding Over-Annotation in TypeScript
44:11 🧠 TypeScript's Type Inference Mechanism
46:03 📖 TypeScript Syntax and Best Practices
46:56 ⚠️ Misuse of the "any" Keyword in TypeScript
48:21 📚 Official TypeScript Documentation on "any"
50:35 🚫 Avoiding "any" for Robust TypeScript Coding
51:30 🧐 Proper Use of Functions in TypeScript
52:26 📝 Basics of Function Creation and Error Handling
54:41 🚫 Avoiding Inaccurate Type Annotations
56:29 🔄 Converting Data Types within Functions
57:25 ✍️ User Signup Function Demonstration
57:51 🚦 Sign-Up Function Parameters and Types
59:44 🖊️ Login Function and Default Parameters
01:02:05 🔍 Ensuring Accurate Return Values
01:03:25 🌐 TypeScript Philosophy and Application
01:04:49 🛠️ Annotating Return Types in Functions
01:06:33 🔁 Understanding Multiple Return Types
01:07:58 🔄 Looping through Arrays with Map
01:11:10 📚 Redirecting to Documentation for Advanced Functions
01:12:06 ⚠️ Specifying Return Types: Void and Never
01:15:37 🧩 Odd Behaviors in TypeScript
01:16:34 📜 Objects in TypeScript
01:19:10 🛠️ Function Definitions & Object Exports
01:20:59 🔄 Functions Returning Objects
01:22:52 🤔 Odd Behaviors & Object Handling
01:25:11 📜 Type Aliases Introduction
01:26:36 👥 Using Type Aliases for User Data
01:28:49 📖 Documentation & Practical Usage
01:32:21 🔍 Quirky Behaviors & Specific Keywords
01:34:33 🚫 `read only` and Optional Properties in TypeScript
01:39:08 🔄 Combining Multiple Types
01:42:18 📋 Understanding Arrays in TypeScript
01:42:46 🌐 Defining Arrays in TypeScript
01:48:48 📖 TypeScript Array Documentation Review
01:50:12 🤝 Introduction to Union Types
01:50:38 🎤 Importance of Contextual Understanding
01:51:06 🤹♂️ Introduction to Union Types in TypeScript
01:53:24 🎥 Subscriber Engagement and Advanced Union Usage
01:58:56 🔍 Union Narrowing & Type Checking
02:00:44 📊 Union Types in Arrays and Classic Mistakes
02:04:46 🧩 Introduction to Tuples
02:07:03 📜 Restricting Array Order with Tuples
02:10:17 💡 Practical Implementation and Caution
02:14:20 🚩 Introduction to Enums
02:14:49 🎯 Enums: Definition and Basics
02:17:11 ⚙️ Implementing Enums in TypeScript
02:20:15 🔄 Enum Value Interpretation
02:22:24 🔄 Use of `const` with Enums
02:23:44 👤 Introduction to Interfaces
02:28:16 📜 Methods in Interfaces
02:30:09 🔖 Defining Methods in Interfaces
02:33:17 🖥️ Understanding the Role of Interfaces
02:34:14 🚀 Extending Interfaces & Inheritance
02:37:51 📚 Distinction between Type and Interface
02:39:16 🛠️ TypeScript in Production
02:41:08 🚀 Setting Up TypeScript for Projects
02:45:40 ⚙️ TypeScript Compilation Configuration
02:47:54 🌐 Using Live Server for TypeScript Projects
02:52:02 🎨 Styling and Further TypeScript Discussion
02:53:51 🌌 Introduction to Advanced TypeScript Use
02:54:45 🎓 Creating Classes in TypeScript
02:57:26 🔒 Using TypeScript for Data Safety
03:00:46 🛡️ Read-only Properties in TypeScript Classes
03:02:12 📌 Advanced TypeScript Concepts
03:03:08 🔐 Modifiers in TypeScript
03:07:40 🚀 Getters and Setters in TypeScript
03:09:58 📝 Setters in TypeScript
03:13:40 🚫 Private Methods in TypeScript
03:15:28 🔒 Access Modifiers and Inheritance in TypeScript
03:17:46 🖼️ Additional Class Properties in TypeScript
03:19:52 📐 Interfaces in TypeScript Explained
03:23:57 📹 Extending Interfaces for Additional Features
03:26:06 📜 Introduction to Abstract Classes in TypeScript
03:29:15 🖥️ Practical Implementation of Abstract Classes
03:33:18 🚀 Advanced Features of Abstract Classes
03:34:15 🔄 Abstract Classes Recap and Method Overwriting
03:35:41 🔗 Introduction to Generics in TypeScript
03:38:23 📖 Generics in Practical Coding and Documentation
03:42:21 🛠️ Differentiating Generics from Any in TypeScript
03:45:33 🍾 Creating and Implementing Custom Generics
03:47:48 📘 Diving Deeper into Generics and Arrow Functions
03:50:09 🔍 Basics of Defining Generics in TypeScript
03:52:47 🔄 Arrow Functions and Generics in TypeScript
03:55:29 📘 Distinguishing Generics Syntax in Codebases
03:56:20 🏛️ Deep Dive into Generics and its Constraints
03:57:49 📜 Using `extends` Keyword in TypeScript
04:01:28 📁 Database Interface and Generic Constraints
04:02:45 🎓 Selling Courses and Quizzes: Class Types in Generics
04:05:51 🛍️ Generic Class for Handling Products
04:07:12 📘 Business Case Logic vs Traditional Problems/Solutions
04:09:32 🚧 Cautionary Tales in TypeScript
04:14:26 📚 Understanding Type Guards
04:17:09 🔍 Advanced Type Narrowing Techniques
04:22:16 📉 More on Type Narrowing
04:22:45 🎯 Narrowing TypeScript Types
04:25:27 🐟 Using Type Predicates in TypeScript
04:29:33 🔄 Type Coercion and Identification
04:30:56 📄 Documentation-Based Learning
04:31:50 ⚙️ Tight Narrowing - Final Steps
04:37:10 🔄 Never Type & Exhaustive Checks
04:39:39 📚 Advanced TypeScript Concepts
04:42:55 🏁 Concluding the TypeScript Series
Made with HARPA AI
respect for creating this. respect++ for mentioning the AI you used
Enums stands for Enumerations. Enums are a new data type supported in TypeScript. It is used to define the set of named constants, i.e., a collection of related values. TypeScript supports both numeric and string-based enums
To my experience, Enums are the perfect balance between having to create an entire class for passing some data in a readable manner, and passing raw data (like numbers) to represent a certain meaning which you have in mind, which makes the code less readable and maintainable
That being said, I am a C# developer and just starting out with typescript, but i assume the benefits apply here as well
Just finished the tutorial. Hitesh is a wonderful teacher. I enjoyed from start to finish. I would definitely recommend this tutorial to anyone looking to not only understand Typescript, but also how to read and understand documentations.
Po 😊😊😅😊
Hey, thank you for the course, but I think you might be wrong at 1:18:30
You create a function "createUser", that takes in object with "name" and "isPaid" properties.
But instead of giving them a type, you destructuring the object
and reassigning "name" to "string" and "isPaid" to "boolean",
But object itself still has "any" type!
function createUser({ name: string, isPaid: boolean }) {}
Same as:
function createUser({ name: string, isPaid: boolean }: any) {}
Almost same as:
function createUser({ name, isPaid }) { ---> type is still "any"
const string = name
const boolean = isPaid
}
I think you wanted to to something like this instead:
function createUser({ name, isPaid }: { name: string, isPaid: boolean }) {}
Or this:
type User = { name: string, isPaid: boolean }
function createUser({ name, isPaid }: User) {}
Y'all can try to code this in typescript playground, if you don't believe me
www.typescriptlang.org/play
Info about Destructuring assignment (from MDN):
developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
I hope it will help someone to feel less confused in this tough topic
Huh glad you took the time to write this comment clarifying that, I was replicating what he did in Typescript playground and it was erroring, I then I asked ChatGPT what was wrong with the function and the response was basically changing the structure of the function to how you have done it in your comment. Thanks for doing that good man!
thank you for your explaination
I spent half hour on this before I started wondering if someone highlighted this in the comments. Thanks man, great explanation
❤
thanks for exaplanation but what's the difference?
I can still do this
function createUser2({ name, isPaid }: { name: string; isPaid: boolean }) {}
let sampleData ={ name: "John", isPaid: true , age: 25}
createUser2(sampleData)
1:36:38 yes, we could manipulate with it (do .push() or change the value of certain elements) but we cannot replace that array with another array.
does "const" have to do with that?
@@rnsanyo I am not sure about the background logic (how TS works behind the curtain) but "readonly property" behaves exactly like a "const" does.
In JS, the array type (object type) is the reference type. This means that the variable store the reference (address) of the array or object instead of its value. So when you manipulate an array or object, the variable doesn't change because it always equals the address of the array in memory. Const and "readonly property" only ensure that variables do not change
I think you were going to destroy world
🎯Course outline for quick navigation:
[00:00-21:43]1. Typescript and its importance
-[10:40-11:09]Typescript allows transpiling typescript code into javascript for building components like react, using .tsx extension.
-[15:04-15:40]Typescript is a development tool dependent on javascript. setting up an environment to write typescript will be covered in the next video.
-[17:00-17:58]Focus on core system wide typescript installation and project configuration for better code production.
-[20:22-20:52]Installed typescript using sudo command, quick and simple process.
[21:43-46:57]2. Typescript in vs code and its basics
-[27:24-27:53]Hitesh introduces typescript series, starts slow, picks up pace later.
-[37:47-38:14]Collaborators can benefit from safety features in code, preventing errors like 'property touppercase does not exist on type number'.
-[39:18-39:51]Vaish introduces a new video on typescript series, focusing on best practices and covering numbers, booleans, strings, and type inference.
-[41:46-42:12]Javascript has limited number-related methods, like toexponential and tolocalestring.
-[44:48-45:15]Using typescript for better code, it detects and prevents errors, ensuring type safety.
-[46:26-46:57]Tutorial on typescript, emphasizing colons and types, urging 70 non-subscribers to subscribe.
[46:57-01:01:02]3. Typescript best practices
-[57:40-58:10]During user sign up, name, email, and password are requested, but they are marked as 'any' type.
-[01:00:16-01:00:51]Discussing passing default values for email and paid in a simple string and boolean format, without encountering any complaints.
[01:01:02-01:14:52]4. Typescript syntax, benefits, and functions overview
-[01:03:16-01:03:44]Typescript emphasizes philosophy of type usage, enhancing javascript.
-[01:03:47-01:04:14]Returning 'hello' instead of a number, a concern for team collaboration.
-[01:06:43-01:07:11]Introduction to handling multiple return types in typescript, using union types, to be discussed in a separate video.
[01:14:52-01:53:31]5. Understanding typescript fundamentals
-[01:27:47-01:28:22]Creating a simple function to define and enforce user data types in typescript.
-[01:31:30-01:31:56]Simplify function definitions to avoid lengthy and complex code.
-[01:38:21-01:38:46]Working on typescript config to stop producing code. mention of credit cards.
[01:53:32-02:14:12]6. Typescript union, literal types, and tuples
-[01:55:22-01:55:51]Typescript allows using multiple types of data, such as 334, without causing errors, making it really useful.
-[01:59:26-01:59:54]The code is being checked for lower case and string verification at line number 30.
-[02:05:20-02:05:53]Tuples in typescript are useful but with limitations. caution advised based on stack overflow thread.
-[02:07:29-02:07:58]Converting data into a tuple, including string, number, and boolean types.
-[02:13:04-02:13:51]In a javascript article on stack overflow, a user discusses issues with typescript array push method not handling tuple type arrays, which was posted a year and 11 months ago.
[02:14:13-02:38:48]7. Typescript enums, interfaces, and methods
-[02:15:24-02:15:52]Enums restrict choices in e-commerce orders, e.g., wish list, delivered, shipped, returned.
-[02:27:49-02:28:17]Read-only fields, like a db id, should be numbers, not optional, and filled in. the advantage is similar to past studies.
-[02:29:21-02:29:50]Method must be compulsory and return a string, such as 'trial started.'
-[02:34:43-02:35:16]Integrating a library from github can require adding missing interfaces and files.
-[02:35:39-02:36:08]Adding a github token as a string property and accessing functionality through declared variable or constant is a typescript feature loved by many.
-[02:36:33-02:36:58]Using 'extends' keyword to inherit properties and defining roles for admin.
-[02:37:35-02:38:03]Using interfaces in typescript allows for easy extension and inheritance, but caution is needed to avoid conflicts with installed packages or libraries.
[02:38:49-02:53:12]8. Typescript basics, production setup, and node project
-[02:40:21-02:48:59]Creating and configuring a typescript project for production, including typescript compiler and output directory setup.
-[02:51:45-02:52:11]Set up lite server in package.json and enable watch mode for typescript changes.
-[02:52:28-02:52:56]Using 'live server' for web development rather than a light server, as it is more efficient and requires no additional packages.
[02:53:12-03:13:03]9. Typescript classes and setup
-[02:53:51-02:54:17]Late night video session discussing setting up a typescript server for file generation and production-grade server for writing typescript.
-[03:06:53-03:07:24]Choosing to make all items public, reflecting syntactic sugar in professional coding practices.
-[03:07:50-03:08:22]Introduction to getters and setters in javascript, discussing private methods and syntax.
-[03:08:42-03:09:14]Using getters and setters to access and manipulate data in software development.
[03:13:03-03:26:37]10. Typescript classes, interfaces, and usage
-[03:15:28-03:15:55]Access modifiers in programming restrict property access.
-[03:21:25-03:21:54]The interface will include additional properties such as a filter and photo burst mode. it will be the basis for the entire application.
[03:26:37-04:08:23]11. Typescript abstract classes and generics
-[03:31:56-03:34:49]Creating an advanced class with properties, implementing abstract methods, and utilizing typescript features.
-[03:43:04-03:43:28]Defining specific data types and return values, including 'any' type.
-[03:48:32-03:49:01]Learning to use arrow functions in typescript, exploring documentation examples.
-[03:49:23-03:49:55]The video discusses defining arrays with possible cases and confusion in building them.
-[04:00:07-04:00:32]Function expects numeric values, but problem arises with strings.
[04:08:23-04:46:24]12. Typescript type narrowing and discriminated unions
-[04:27:42-04:28:07]Code involves checking if a method is not undefined, then returning pet as a fish.
-[04:36:12-04:36:38]Creating a function to determine true shape from circle or square.
-[04:38:40-04:39:15]Code review with exhaustive check, only two cases.
-[04:39:27-04:39:52]New payment status 'authorized' introduced, alongside 'captured' and 'refunded'.
-[04:45:58-04:46:21]Encouraging support for sharing and enjoying the series.
offered by Coursnap
Hitesh Choudhary is one of my favorite teachers who makes complex topics into simple. Great to see Hitesh here 😃
Finally i found you 😂😂 you are so famous Yarr 😂😂
@@aarooral7997 how 🤔
@@Viralvlogvideos i know you from fsjs bro
@@aarooral7997 What's fsjs?
What an amazing teacher, honestly. So eloquent and to the point.
I recently finished a Typescript course and wanted to thank the instructor for such an informative and helpful tutorial. As a beginner, I was able to easily follow along and understand the concepts thanks to the clear explanations and examples provided. I feel much more confident in my ability to use Typescript in my projects now. Thank you for your hard work and for sharing your knowledge with others!
were you able to get some jobe or internship after this?
Did you learn JavaScript first?
@@nitilpoddar to be honest i haven't applied for any typsecript related job but this video helped m in my current company as our projects are shifting to adonis framework which uses typescript
@@unuefeejovwoke6609 yes
@@haseebsheikh6101 so can't I learn without knowing much on JavaScript? I'm a python developer and wanna learn typescript
Yes! We can push elements to read-only properties having type array; because arrays are not explicitly represented, but only by their memory address. So, technically we are not changing the memory address of array by pushing elements inside it, and READONLY still validates upon the address of the array.
it's not true anymore, i just tried
its not true I have tried ans ts is allowing me to do it
I learned JS as my first language and C# as my 2nd. TS is basically a combination of the two, and in a good way. Great series and you're an awesome teacher Hitesh!
u are ryt bro
What is Ienumerator equivalent in typescript.. I used it alot in my unity games
I mean, yeah, writing "Hello, World!" is pretty much the same
Lol,I think you don't know C#,otherwise you wouldn't say that
He is a great teacher indeed
One of the best comprehensive tutorials I have watched in UA-cam!
Damn. Back in the days when I was learning coding I learned alot of Hitesh. Thank you very much for the helpful content. Time to learn TypeScript from this chad again. ✨
nostalgia hits
02:13:04 In TypeScript tuples, the length is not strictly enforced after the tuple is created, but the types of the elements are still checked.
Hitesh is one of my favourite instructors on the internet, it's a great feeling to see him on this channel
1:36:37 yes we can push it because typescript perceives read-only as editable or modifiable but not re-assignable, like we are not able to do something User._id = ["new.id'], since we are allowed to change the value but we can make changes to preexisting value.
I've been thinking about learning it since many weeks and you guys released it at the right time 😍
one of the best instructor out there, props to hitesh sir, his js series was exceptionally good
I wasn't even intending to learn this, but i was literally sucked into it! Good flow!
Chai aur Code ❤ . Exceptional mentor 🙌
my timestamps:
2:24:03 (thursday/wednesday)
3:15:25 (friday)
3:19:36 (saturday)
4:07:16 (sunday)
FINISHED! (monday)
hope you guys can do it too :) good luck!
The flow of the tutorial was really great. Each topic is discussed very appropriately. And the approach to make the people read documentation is splendid and seen for the first time any instructor emphasizing upon it.
Looking forward to a similar comprehensive course on Next.js and prerequisite for it from the same instructor if possible.
2:07:29 put the cursor on the row you want to duplicate and simply press ALT + SHIFT + ARROW DOWN (Windows users) to make a copy of that row.
This is a wicked shortcut, thank you John
I was wanting to start learning typescript. Randomly I started today anyway and from google then freecode got over there and started with the course. 1/3rd is done. Great until now and will resume. I noticed that this was uploaded just a day ago so I believe my luck wanted me to wait so that I can learn from you. Thanks
1:36:42 yes, it allows pushing value to a readonly variable of type an Array.
but why? explanation plz'
Awesome tutorials, amazing teacher...this is probably the first time ill be watching a 2 hour + tutorial on youtube
This was an amazing tutorial - really enjoyed it from start to finish. Thanks Hitesh!
if someone was struggling with it - seems like in newer versions of typescript it might be crucial to define the argument name when trying to annotate types for a function object argument input:
example:
function createUser(user: {name: string, email: string, isPaid: boolean})
instead of:
function createUser({name: string, email: string, isPaid: boolean})
at least what I got when trying to follow along - the code editor and it's typescript checker seemed to treat the latter definition as if I was destructuring the argument, not type-annotating it.
Thank you @Hitesh for creating a very easy-to-understand course. This is the 1st time I have seen approx 5 hours video tutorial and have not skipped a single part. This was on my todo watchlist for a very long time.
just finished. good course. he's a great teacher. now im gonna go do a bigger tutorial that uses this stuff.
This is an amazing tutorial. If you are a beginner then you can undoubtedly go for this tutoroial.
bro please bring more indian teachers, they are so clear and accurate
are u tryna be funny?
@@wovasteengova nah they really are the best once you get used to the accent
True!
Thanks!
I was having difficulty grasping the basics from other sites. I am glad to have stumbled upon this. Super progressive explanations
1:36:00-> we should be able to add value even if it is readonly.the readonly modifier only applies to the variable itself, not its internal properties
Hitesh Sir on freeCodeCamp rocking 😍😍🔥🔥🔥🔥
Just now I finished the course.. I believe that I am now familiar with typescript syntax. Thank you hitesh for this amazing course. Keep up the good work 😊
Thank you so much Hitesh! Amazing tutorial, to the point, as it should be! 👏👏
For 43:30, keep in mind that there ARE cases where type inference is bad and you'll want to be type explicit. One such case is when the code gets complex enough that to figure out what type it should be requires hunting through multiple files, in this case explicitly typing is a good idea to prevent a change many files away from breaking your code (without throwing error at compilation).
There are other cases, too. So it is generally preferred, but not required, to avoid explicit typing. You will usually know when that is the case.
hiyteshy chowdary , ok 😆 , This is what i needed 😊😊
1:36:34 -> Yes, we can push values to id if it is an array and if id is read only.
enum for enumerate.
Hey i know this guy and I follow his channel also. He explains things greatly. Thanks for featuring him in the ts course.
What's his channel?
ok its in description box. Hitesh Chaudhary
Thanks
@@HiteshCodeLab please make a video on how to make photo album using nextjs and strapi...
i have completed this series today within 4-5 days and gained lot of knowledge required to get start with typescript thanks hitesh sir for the helpful knowledge it was a great run
When it comes to high quality tutorials, Hitesh is always on top in my list 🔥😎🙌
This is the best video for who are searching to learn Typescript. Hitesh is great teacher.
Finished the whole series. It is really great. Thanks Hitesh!
mam does this series have switch
at 4:30:56 , boolean is returned - and not a type . The boolean value informs the TS type system that if true - pet is of type Fish else if False then pet is of Type Bird . So it merely informs - but what is being returned is boolean indeed.
a project with TypeScript + React + ReduxToolkit that would be a good tutorial
@@manofsteelind So after this tutorial you say I will not know typescript fully?
@@manofsteelind You become a typescript expert by writing apps, if I am writing my apps with react, so how should I become expert then?
@@martapfahl940 you can use TS instead of JS in your react app for TS practice
1:36:36 Yes, we can push and pop because it only prevents overwriting the value
2:12:55 I think now TS have introduced that ability for the tuple to restrict pushing or changing the value of array using index to any other type of value than specified. I am currently using v5.1.6
check. it throws an error now. seems like it got fixed now. no push of different types possible anymore
@@brian9790 Yess.
still working for me at v5.1.6
2:14:29
looks like if you make the type readonly like
` type User = readonly [number, string] ` OR `const newUser: ReadOnly
then it will hint you with a type error when you try the .push() method
pro level as always in teaching and in video quality also🔥
Quality is number 1 priority
Completed!! Thanks Hitesh :)
wow.. never thought this would happen but you guys did it... thanks alot... Indeed Hitesh is a great tutor.
Just right now i am at 4:42:56 and i am getting a very positive feeling i have learn a lot from this video , words cannot describe how great learning experience was .
Thank you very much sir
TYPESCRIPT is looking too much easier then HTML because of Hitesh's Explaining skills ! Just Wow.
This is for you Hitesh -♥️
one of the most amazing tutorials about TS, Thank you Hitesh.
Typescript types : string, number, boolean, array , null ,undefined , any noImplicitAny, object, union
and subscribe
⭐ Contents ⭐
⌨ (0:00:00) Why to learn TypeScript
⌨ (0:07:08) TypeScript is not what you think
⌨ (0:15:25) How to install TypeScript
⌨ (0:27:33) Your first intro to TypeScript docs
⌨ (0:39:21) Number, boolean, and type inference
⌨ (0:39:21) Number, boolean, and type inference
⌨ (0:46:52) Don't use ANY
⌨ (0:51:30) Do you really know functions
⌨ (1:02:55) A better way to write function
⌨ (1:15:38) Bad behavior of objects
⌨ (1:25:14) Type Aliases
⌨ (1:32:28) READONLY and optional
⌨ (1:42:13) Array
⌨ (1:50:03) Union Types in TS
⌨ (2:04:46) Tuples
⌨ (2:14:33) Enums
⌨ (2:24:03) interface
⌨ (2:33:52) Interface vs Type
⌨ (2:39:08) How to setup Typescript for real projects
⌨ (2:53:44) Classes
⌨ (3:02:06) Private Public
⌨ (3:08:12) Getters and Setters
⌨ (3:15:25) Protected
⌨ (3:19:34) Why Interface is important
⌨ (3:26:05) Abstract class
⌨ (3:35:36) Generics
⌨ (3:47:58) Generics in Array and Arrow functions
⌨ (3:56:07) Generic Classes
⌨ (4:07:16) Type Narrowing
⌨ (4:17:04) The in operator narrowing
⌨ (4:22:17) Instanceof and Type Predicates
⌨ (4:31:35) Discriminated Union and Exhaustiveness Checking with never
⌨ (4:42:54) TypeScript End
Really good tutorial. Very precise and educational.
Beautifully explained, Hitesh, thank you so much. As a beginner I find so useful to be able to learn not only theory but also how it actually works in practice and most common mistakes we can make. This was amazing! 👏👏👏👏👏
This video about Typescript was awesome 😍 and I learned new stuff with this. Can you make a video for Node Express with Typescript and MongoDb ☺.
Background looks good to me.. this video really seems protecting our eyes from brighter background 😊
And the legend is here guys 🙌.
He's one of the best teachers on the internet 🔥. You're going to love this tutorial
अरे ये तो अपना भाई है ❤️🔥
I swear this is the best tutorial of TYPESCRIPT i've ever seen.
I've got 2 udemy popular courses on UDEMY, but this is far more understandable and straight to the point explanation.
thank you @hitesh
Hitesh is a great teacher man! Love his calm composure and ability to explain complex concepts simply
I was actually looking for a typescript tutorial since 2 days. Started many but then saw your post on Linkedin.
I hope it will be a good one. Starting now
Thanks and I subscribed, Hitesh. Great work!
Your method of teaching is good. Handling and clearing small small concept also. Thank you
Hitesh Sir always rock with his awesome quality tutorial.
Thank you so much for making this series.
Hitesh is real gem. The quality of content is real gold.
Well thought out & taught tutorial. I love the way you went through the documentation in tandem.
Thanks for the hard work you put into it.
Completed the series. Now, ready to use Typescript. Thank you Hitesh bhaiya
Hi Hitesh,
Thanks a lot for your contribution and I appreciate it.
if id would be an array, can we push values to the array in the case of READONLY?
Answer: Yes. it allows push and pop operations.
type testId = {
readonly _id: Array
name: string
}
let testIdOne: testId = {
_id: [1, 2, 3],
name: "ns"
}
testIdOne._id.push(4);
testIdOne._id.push(5);
console.log("result->", testIdOne);
"result->", {
"_id": [
1,
2,
3,
4,
5
],
"name": "ns"
}
Really, the way Hitesh explained each and every concept, they seemed to be a cup of tea, although those were not.
I'm glad to say I finally finished this course. Thanks Hitesh :)
TypeScript is more Java than JavaScript
There's no doubt this is the best one . Love from Bangladesh boss
Enum full name is Enumeration
Wish UA-cam was smart enough to suppress "70% are not subscribed". Damn it, I'm subscribed to this.
how many of you are getting motorola ads too
much .
the music is good though 😂😂
@@saieswarreddymenakuru4739 yupp 😂😂
In 2:13:00 I'm not able to push a boolean to the tuple because isn't assignable to the parameter of the type. Have they fixed the bug?
It's the same for me when I try to insert a boolean value
my life is totally changed 😊. I've been earning $10,250 returns from my $4,000 Investment every 13 days
I've traded with a lot of individuals but
have never come across anyone as good as
Mrs Walls , just by applying his
new strategies I now trade independently. He's the best I can advise any novice investing to trade with him
wow .. Amazing to see others trading with Mr Walls , i am currently on my fifth trade with him and my portfolio has grown tremendously
I heard a lot about Mr Walls and how good he is, please how safe are his profits?
@@micahll5684 I trade with him, The profit are secured and over a 100% return on investment directly sent to your wallet.
I also trade with him, Big thanks to Mr Walls for what he did for my family and I 🙏🤗
TypeScript is a popular programming language based on JavaScript
Click to expand
00:05
✦
TypeScript allows writing more precise JavaScript with less errors.
02:50
✦
TypeScript provides static checking to analyze code for potential errors.
08:20
✦
TypeScript is a development tool for writing better, more scalable, and maintainable JavaScript code.
10:59
✦
Install TypeScript on your system
16:07
✦
Install TypeScript globally for system-wide usage
18:34
✦
TypeScript converts JavaScript code into TypeScript for safer development.
23:20
✦
TypeScript playground and TS config settings
25:57
✦
TypeScript documentation guidelines and topics overview
30:47
✦
TypeScript ensures expected data types, reducing errors.
33:05
✦
TypeScript provides safety by catching errors at compile time
37:53
✦
TypeScript treats numbers as a single type instead of distinguishing between integers and floats.
40:02
✦
Type inference in TypeScript is smart and detects errors.
44:46
✦
Avoid exhaustively using the 'any' keyword in TypeScript
47:08
✦
Learn TypeScript functions end-to-end
51:58
✦
TypeScript enforces strict typing to avoid errors and ensure code quality.
54:13
✦
TypeScript focuses on strong typing and error checking
58:40
✦
Setting default values in TypeScript
1:00:59
✦
Overview of functions and scenarios in TypeScript
1:05:34
✦
Functions with non-void type must return a value
1:07:54
✦
Understanding the void and never return types in TypeScript functions
1:12:42
✦
Using objects in TypeScript for better software writing.
1:15:13
✦
Creating and returning objects in TypeScript.
1:20:00
✦
TypeScript's odd behavior regarding object return
1:22:38
✦
Creating custom types in TypeScript
1:27:24
✦
TypeScript helps standardize and reuse common types
1:30:12
✦
Defining and using user types in TypeScript
1:35:17
✦
TypeScript provides strong typing and prevents certain errors in JavaScript
1:38:02
✦
Understanding the 'never' type and array type in TypeScript
1:43:28
✦
TypeScript allows defining specific data types and their properties.
1:46:00
✦
Use union types to handle multiple data types
1:51:23
✦
TypeScript allows strict type definition for user and admin hierarchy.
1:53:51
✦
Narrowing down and verifying types in TypeScript
1:59:28
✦
Arrays in TypeScript can have either all numbers or all strings.
2:02:06
✦
Tuple in TypeScript allows defining a fixed order of data in an array.
2:07:35
✦
TypeScript allows you to define strict type requirements for your data.
2:10:05
✦
Enums are useful for restricting user choices.
2:15:19
✦
Enums allow defining a set of named constants
2:17:51
✦
TypeScript restricts code writing but generates clean and simple JavaScript code.
2:22:57
✦
Interfaces provide a basic protocol for creating user objects.
2:25:33
✦
TypeScript allows defining interfaces with compulsory parameters.
2:30:36
✦
Interfaces in TypeScript are like an interface for hardware in an operating system.
2:33:12
✦
Difference between type and interface in TypeScript
2:38:05
✦
Learn how to initialize TypeScript and see the available options in the TypeScript config file.
2:40:38
✦
TypeScript compilation and distribution process
2:46:05
✦
Setting up a server using npm packages
2:48:43
✦
Creating classes in TypeScript requires specifying data types.
2:54:30
✦
Creating objects from classes in TypeScript is simple
2:57:09
✦
Learn TypeScript modifier keywords like public and private
3:02:36
✦
Understanding public and private modifiers in TypeScript
3:05:09
✦
Designing getters and setters in TypeScript for a course count property.
3:10:21
✦
Understanding the concept of getters and setters in TypeScript.
3:12:50
✦
Explaining protected access modifier in Typescript
3:18:17
✦
Defining an interface for taking photos in TypeScript
3:21:00
✦
Understanding abstract classes in TypeScript
3:26:15
✦
Difference between using 'extend' and 'implement'
3:28:52
✦
Abstract classes help define class structure and compulsory methods.
3:34:21
✦
Generics are a major part of TypeScript allowing for reusable and consistent APIs.
3:36:56
✦
Understanding TypeScript identity types
3:42:10
✦
TypeScript allows defining and using generic types
3:44:50
✦
Introduction to TypeScript generics
3:49:42
✦
Conversion of a regular function to an arrow function with generics.
3:52:07
✦
Using generics to create reusable functions with type constraints
3:57:19
✦
Using generics in TypeScript
4:00:00
✦
Generic class for handling any type of object
4:05:28
✦
Understanding narrowing in TypeScript
4:08:13
✦
TypeScript emphasizes caution with data types
4:13:47
✦
Cover all cases including when the value is nothing or an empty string
4:16:25
✦
Type narrowing for better precision
4:22:04
✦
TypeScript introduces 'instanceof' for checking if an object is an instance of a class
4:24:45
✦
Type casting with pet is fish syntax
4:30:02
✦
Using discriminated union to differentiate shapes in TypeScript
4:32:45
✦
Handling default cases in TypeScript
4:38:38
✦
Using 'never' type as a default method checker
Completed the entire video and I am very thankful to the instructor for covering the topics with good instructions and examples. Loved it and can't wait to implement typescript on some projects, Cheers 🥂👩💻
You are an awesome teacher Hitesh Choudhary . Clear communication , well explained. first time looking at your learning series. very well explained on basics concepts . looking forward to learn from your tutorials.
Thank you so much hitesh sir for the best tutorial of typescript.👏🙌
feeling God's supermacy . carry on sir
very pleased for the free content, i'm gonna eat this in a row
wooo hitesh is back...
great course and their is some mistake at 1:01:53 where
check if(isPaid === void 0)
Really Proud to have you sir on a Freecodecamp video ♥️♥️🤩👌🏼
This is a good lesson. It demystifies the difference between typescript and JavaScript. I am much more confident to learn other web technology after watching this wonderful video.
Thank You Hithesh Sir! For all the hard work you put behind this series. All Love to you. ❤😊
Congratulations Hitesh 🎉🎉👏
at 1:36, yes we can push value in type of array even that array is readonly, we can not update whole array
I learned typescript using these series. Thanks very much sir Hitesh