TypeScript Course for Beginners - Learn TypeScript from Scratch!

Поділитися
Вставка
  • Опубліковано 29 вер 2024

КОМЕНТАРІ • 893

  • @renedeck212
    @renedeck212 4 роки тому +666

    Timestamps
    Getting Started 00:00
    What is TypeScript: 01:57
    Installing & Using TypeScript 06:31
    The Advantages of TypeScript 19:53
    Course Outline 22:59
    How to Get the Most out of This Course 27:16
    Setting Up our Development Environment 30:29
    The Course Project Setup 33:36
    Module Introduction 40:56
    Using Types 41:23
    TypeScript Types vs JavaScript Types 51:43
    Numbers, Strings and Booleans 56:37
    Type Assignment and Type Inference 01:02:20
    Object Types 01:07:59
    Array Types 01:15:31
    Tuples 01:21:01
    Enums 01:27:21
    The Any Type 01:34:26
    Union Types 01:36:30
    Literal Types 01:43:01
    Type Aliases 01:50:55
    Function Return Types and Void 01:53:55
    Function Types 02:01:21
    Function Types and Callbacks 02:06:55
    The Unknown Type 02:11:18
    The Never Type 02:15:02
    Wrap Up 02:19:12
    Module Introduction 02:21:04
    Watch Node 02:21:50
    Compiling the Entire Project 02:23:55
    Include and Exclude Files 02:27:42
    Setting a Compilation Target 02:33:55
    Understanding TypeScript Libs 02:37:59
    More Options 02:43:31
    Source Maps 02:45:12
    Rootdir and Outdir 02:47:12
    noemit on Error 02:52:43
    Strict Compilation Options 02:55:35
    Code Quality Options 03:06:39
    Debugging with Visual Studio Code 03:11:02
    Wrap Up 03:15:22

  • @roypt8055
    @roypt8055 4 роки тому +27

    It took me almost one day to get through, but it is really worth to do, love this video, appreciate you, max

    • @BackwardsDaveTV
      @BackwardsDaveTV 3 роки тому

      Great video, and your English is great, not one mistake! Gut gemacht :)

  • @JBuchmann
    @JBuchmann 4 роки тому +5

    Oh wow, I just realized you overhauled your huge Udemy TS course which I completed a couple years ago. I'm going to start over for a great refresher. I live how you are committed to updating your courses. Thanks so much Max!

    • @academind
      @academind  4 роки тому +3

      I indeed re-recorded the entire course, so thanks a lot for your awesome feedback!

  • @nanibanani7560
    @nanibanani7560 4 роки тому +1

    Also ich muss ja echt sagen.... Du hast den deutschen Akzent fast komplett raus bekommen, sprichst flüssig und deutliches Englisch und hast dazu auch noch ein super Video gemacht. Ich habe es zwar noch nicht ganz zuende geschaut, bin aber jetzt schon wirklich wirklich beeindruckt. Keine nervige Musik oder halbnacke Frauen, die zwischendurch eingeblendet werden, keine Beleidigungen oder unnötiges Gerede aus deinem Alltag, kein Runtermachen von irgendwelchen Nationalitäten oder Gruppen und dies alles noch kombiniert mit einer wirklich cleanen Videostruktur.
    Ich kein Deutscher und kann einfach nur sagen das ich dein Englisch als "great" bewerte.
    Wirklich gute Arbeit

  • @francisguchie1973
    @francisguchie1973 2 роки тому

    Even the youngest school going person can learn from this. You make things look so nice and easy. I like your teaching style.

  • @robsokolowski9015
    @robsokolowski9015 3 роки тому

    I am advanced programmer but with no TS experience. I found 2.5 hours and on very helpful, was exactly what I was looking for!

  • @verryondrums
    @verryondrums 4 роки тому +749

    To get a 3 hour high quality tutorial on UA-cam is like winning the lottery! Thanks for sharing, thanks for your passion and your effort. It helps so much to improve in programming, therefore improve in my job and therefore improve in life

  • @nanohedron
    @nanohedron 3 роки тому

    I got done with the last video and then there was Max on the screen. OK.. like... already subscribed... Thank you Max, you're a really good teacher. I've learned a lot.

  • @IconicProps
    @IconicProps 3 роки тому

    While there is a place for this, the beauty of javascript is the loosely typed system, and then speed of development.
    return (num1 * 1) + (num2 * 1); would work in the example without using a framework that forces you to type and make classes for everything.
    Learning it is great. But the end out put code, is just javascript. So you add a layer, on top, to make sure you programmed correctly. When you can just program correctly.
    If you are programming a banking application, or the space shuttle, this is more important. But this is typically client side code, which you are going to validate again on the back end, and would need to pair to your sql or database (unless its nosql), so again, we are adding a ton of complication here.
    I will say that you do a very good job of explaining things. I appreciate your time and explanation.

  • @codewithparsa9986
    @codewithparsa9986 4 роки тому

    This is sky-high quality content. Provides 120% value for the time.

  • @dennycrane518
    @dennycrane518 4 роки тому +16

    Max you are fantastic lecturer, thank you for these easy explanations of typescript, you would be my perfect mentor, greetings from Serbia

  • @donaldfarrar5352
    @donaldfarrar5352 2 роки тому +2

    Where is the zip file to the starter code mentioned in the beginning?

  • @marc0hh
    @marc0hh 3 роки тому +2

    Max you inspired me to be confident to podcast as a german in english anyways.

  • @mocanada304
    @mocanada304 29 днів тому

    1:21:31
    Types in TypeScript:
    Primitive Types: number, string, boolean, symbol, bigint, undefined, null.
    Object Types: object, array, tuple.
    Special Types: any, unknown, void, never.
    Custom Types: type aliases, interface, enum.
    Function Types: Function signatures.
    Utility Types: Partial, Readonly, Record, Pick, Omit, Exclude, Extract, NonNullable.
    Intersection & Union: Combine or choose between multiple types.
    These categories help you write safer, more maintainable code in TypeScript!

  • @kareemjeiroudi1964
    @kareemjeiroudi1964 4 роки тому

    I mean for people like me who are coming from the backend and just want to pick up TypeScript as well as JavaScript as quickly as possible to be able to integrate better into Frontend projects, this was definitely a good 3-hours introduction. But I think there's a little more to JavaScript than was not mentioned in this tutorial. By no means though this was a bad tutorial. The exact opposite, I liked it a lot and appreciate this helpful content, and you should go ahead and watch regardless what programming skills are. Super good Schwarzmüller!

  • @fpwanderley
    @fpwanderley Рік тому +1

    Great Stuff! Thanks for this.

  • @prisinha
    @prisinha 2 роки тому

    1:19:00 for loop running on string array which nested within object

  • @blaklespaul
    @blaklespaul 3 роки тому +2

    Fantastic, would have loved to learn about the differences between custom types and interfaces though, and I feel like Type assertions are such a big part of Typescript that was entirely missed in this tutorial. Thanks for the course though, legend!

  • @asif21hasan
    @asif21hasan 4 роки тому +3

    You are an amazing teacher, my guy.

  • @ehsanahmadi8976
    @ehsanahmadi8976 2 роки тому

    it's a good place to go for beginners but typescript has many concepts that didn't cover in this course but it was good for a free course. thank you.👌👍

  • @fomgbehismaelbunduka5458
    @fomgbehismaelbunduka5458 2 роки тому

    You're the best, Max. Your teaching style is awesome. Thank You for this free 3 hour course!

  • @apachurrooriginal
    @apachurrooriginal 3 роки тому

    You just blow my mind !
    What a very good video explaining very clear the TS.
    I never been used but after watching this presentation. Certainly will us it!.
    Thank you for sharing !

  • @deleted_account-u3w
    @deleted_account-u3w 2 роки тому +1

    Just to clarify, that “logical error” can be fixed very easily.

  • @prisinha
    @prisinha 2 роки тому

    2:03:00 Function is type (with F as capital letter)

  • @victorvillacis6764
    @victorvillacis6764 4 роки тому

    Bro free??? This guy is awesome. Taking his React Buger App course now.

  • @robinduong949
    @robinduong949 3 роки тому

    When you're providing instructions, would you be able to state more explicitly if the thing you're about to show is recommended or not recommended best TS practices -before- you present the information?
    I found myself backtracking on my notes a bit and getting best practices vs possible practices mixed up a bit because it was often stated after the concept was taught.
    You're definitely one of the best instructors I've had, and I can tell you put a lot of time/thought into the PowerPoint slides and lectures, and you give really clean presentations. I'm going -nuts- because one of my classes I'm taking is from someone who hacked together a class, even though they've got the best reviews.

  • @prisinha
    @prisinha 2 роки тому

    1:51:00 alias type stores union type so that it can be used repeatedly

  • @CoreusSymphonia
    @CoreusSymphonia 3 роки тому

    51:30 - had this exact error when looking at the code. Thanks for mentioning how to fix that!

  • @aniokechukwudi2472
    @aniokechukwudi2472 2 роки тому +1

    Thank you so much for this

  • @prisinha
    @prisinha 2 роки тому

    1:27:47 enum keyword (in lowercase without suffix s at end, not enums)

  • @arifkhan_Official01
    @arifkhan_Official01 3 роки тому

    Great video, despite using Typescript for month it taught me a lot.

  • @gabrielvalencia1395
    @gabrielvalencia1395 2 роки тому

    Great video! In the section about literal types, TS doesn't check if the operator is supposed in all the specified union types. Has that changed in recent version of TS? It's pretty cumbersome to have to do all the checking.

  • @kelechibrian1414
    @kelechibrian1414 3 роки тому

    I love the flow of all your tutorials, even bought your flutter in udemy thanks for the knowledge shared

  • @yateshchhabra9237
    @yateshchhabra9237 2 роки тому

    when ts compiler converts the code to javascript it's just convert the const to bar so there is a variable hoisting.

  • @harysuryanto
    @harysuryanto Рік тому

    Thank you so much! The explanations are easy to understand

  • @peterhirt991
    @peterhirt991 4 роки тому

    Great tutorial! Congratulations. And lots of material never seen before.
    Just one input: with "watch:build": "tsc --watch" one could automate also the changes on typescript file.

    • @peterhirt991
      @peterhirt991 4 роки тому

      Sorry, I should have watched this video till the end. Max addressed that there.

  • @rishiraj2548
    @rishiraj2548 Рік тому

    Great tutorial! Thanks 🎉

  • @manishabro
    @manishabro 4 роки тому

    HI Schwarzmuller, Your teaching is really very good. I found got the best tutor online. I have now moved to a new project. Where I need to work with typescript+API+jest. Could you please make a video on typescript+jest, please.

  • @suryak4224
    @suryak4224 3 роки тому

    No words. You are just amazing 👍

  • @Marat-Gasanian
    @Marat-Gasanian 2 роки тому

    Thank you very mush for so detailed video!

  • @coolg9585
    @coolg9585 3 роки тому

    Thank you max, love the way you teach.

  • @MrSambra22
    @MrSambra22 3 роки тому

    In the first example of ts it seems complicated using ts you have to write to many things just to get it started istead in js you could of just added the + to specify data type .

  • @prisinha
    @prisinha 2 роки тому

    20:00 TS overview and its advantages

  • @cat47
    @cat47 3 роки тому

    Thanks for the course Mexican Scwartz Villa!

  • @lukisIVIII
    @lukisIVIII 4 роки тому

    You are a great teacher!

  • @sumanthapa6063
    @sumanthapa6063 4 роки тому

    I don't know why u have maleficent's horn behind you but i like it. also great tutorial.

  • @msvmanikantasrivishnu7788
    @msvmanikantasrivishnu7788 4 роки тому +1

    Thanks Max

  • @aqibfayyaz1619
    @aqibfayyaz1619 2 роки тому

    As always Awesome!

  • @patrickmaina5721
    @patrickmaina5721 3 роки тому

    amazing i cant wait to buy your courses

  • @DineshDini5
    @DineshDini5 4 роки тому

    omg , all your videos are great ,quickstart

  • @prisinha
    @prisinha 2 роки тому

    1:26:00 exception to tuple

  • @jacob_dmn
    @jacob_dmn 3 роки тому

    thank you so much!

  • @allprowebdesigns917
    @allprowebdesigns917 2 роки тому

    Great course on TypeScript. A good beginner setup and basic features guide. Do you have anything on Python?

  • @prisinha
    @prisinha 2 роки тому

    1:44:00 1:49:00 Literal type

  • @panas844
    @panas844 4 роки тому +2

    Thanks for this amazing video. One question though. Where could I find the zif file with the exercises?

    • @evangelospapadopoulos8157
      @evangelospapadopoulos8157 3 роки тому

      Hi There, thank you for this great video! I have the same question about the zip file with the examples, could not find it.

  • @josevazquez4257
    @josevazquez4257 2 роки тому

    Just bought the full course

    • @whatsap6851
      @whatsap6851 2 роки тому +1

      Helpline📲📥⬆️
      Questions can come in⬆️

  • @rehan314
    @rehan314 2 роки тому +1

    Windows users use live server extension do not use lite-server as it doesn't works in windows!

  • @yaktd5704
    @yaktd5704 3 роки тому +1

    I have your course, But still watching it without any reason XD

  • @nithinraj342
    @nithinraj342 3 роки тому

    Outstanding
    Gained a lot. ❤️
    Tq sir 🔥

  • @nvminhtu4988
    @nvminhtu4988 Рік тому

    Thanks for your video 😍

  • @prisinha
    @prisinha 2 роки тому +1

    2:04:44 How to create Function type using arrow notation
    2:07:00 How to create Function type including a Call Back Function type
    2:11:55 unknown type
    2:16:46 never type
    2:22:22 typescript compiler
    2:24:36 if defer is present within script tag (and async is absent), then, the script is downloaded along with other code, but script is executed after the page has finished execution of other code.
    2:24:44 tsc --init
    2:25:55 tsconfig dot json file
    2:26:26 compile all ts files present in project in one go
    2:29:00 exclude keyword can be present in tsconfig dot json file
    2:31:31 include keyword can be present in tsconfig dot json file and include keyword lets you include entire folder
    2:33:03 files keyword can be present in tsconfig dot json file and files keyword does not let you include entire folder

  • @realfootball338
    @realfootball338 4 роки тому

    second half of video super super !!!! Thank you !

  • @rolandogarcia3230
    @rolandogarcia3230 4 роки тому

    Thank you for share your knowledge master.

  • @Venistro
    @Venistro 4 роки тому +1

    Danke, perfektes Timing für mich :D :)

  • @TacoStanMan
    @TacoStanMan 3 роки тому

    My only beef with this is pushing VS rather than presenting the various TS IDEs available, like WebStorm/IntelliJ or even Notepad++. Otherwise, amazing tutorial!

    • @ДмитроПрищепа-д3я
      @ДмитроПрищепа-д3я 3 роки тому

      VS is a great IDE tho.

    • @TacoStanMan
      @TacoStanMan 3 роки тому

      @@ДмитроПрищепа-д3я I agree, but it isn't the only IDE. I personally strongly prefer WebStorm for a variety of reasons. Even Notepad++ has its advantages, especially when you are learning. If you don't know what the IDE is taking care of for you behind the scenes, you are unlikely to know how to fix the configuration/runtime if something happens to go wrong.
      I suppose it's somewhat of a personal thing: it's a pet peeve of mine when tutorials recommend any tool without listing common alternatives as well. Personally, I would argue that Jetbrains products are vastly superior to VS, and due to their relative novelty, they will only continue to leave VS in the dust. A lot of people disagree with that assertion, but a lot of people agree with it, too. Whenever a situation like that arises, I believe all options should be made apparent, and then if a viewer wants to do additional research into a tool that is mentioned but not used, they can. If I didn't already know about Jetbrains, I would have downloaded VSC and that would have been that.
      That is what happened to me with Netbeans years and years ago with Java: I used it for several years before being introduced to IntelliJ, and kicked myself for not knowing about IntelliJ earlier.
      All of this is just my opinion, though, of course!

  • @antoniogonzalez5081
    @antoniogonzalez5081 3 роки тому

    Great course!!! Thanks!!!!

  • @bernonymous
    @bernonymous 3 роки тому

    Awesome content
    thanks for sharing

  • @cacup7
    @cacup7 4 роки тому

    The best course ever. Great quality and excelence on teaching.
    I highly recommend you guys checkout his courses on Udemy. They are excelent and are continuously updated. I'm grateful for your passion on teaching, Maximilian.
    Greetings from Brazil!

  • @WahiduzzamanHridoy
    @WahiduzzamanHridoy 3 роки тому

    Just finished this one!

  • @thelittlerossy9289
    @thelittlerossy9289 2 роки тому

    How to show "code" menu in menu bar which is next to File? I am following this course on udemy. please suggest.

  • @abhijeetgaware1057
    @abhijeetgaware1057 3 роки тому

    Hi max can you make it one course react with typescript & react native with typescript ?

  • @binihalex8097
    @binihalex8097 3 роки тому

    That shirt is on flick🧨

  • @rickystah101
    @rickystah101 4 роки тому

    really nice tutorial, thank you so much

  • @sayyedmdqasimrehan2141
    @sayyedmdqasimrehan2141 4 роки тому +2

    Thanks for this course sir.

  • @danielanselmo3392
    @danielanselmo3392 3 роки тому

    Awesome course!!!

  • @santoshmohanroutray6508
    @santoshmohanroutray6508 4 роки тому

    that was really a great tutorial max.. My fav instructor. I have taken almost all of your courses on udemy.
    Can you create a new course on udemy a realtime complete packge of front end as well as backend and explain the architechture of a real world app with mean stack which will include all features that a professional developer use. For ex a admin dashboard that will have several features.

  • @kuldeepsingh-wd7pe
    @kuldeepsingh-wd7pe 2 роки тому

    great tutorial

  • @steffanharmaajarvi9839
    @steffanharmaajarvi9839 2 роки тому

    THANKS))

  • @wolfgangamadeusmozart690
    @wolfgangamadeusmozart690 4 роки тому

    indeed great video sr thank you very much

  • @prisinha
    @prisinha 2 роки тому

    2:55:45 strict option

  • @urla234
    @urla234 3 роки тому

    I got a job thanks to this man, now I make 60k a year

  • @prisinha
    @prisinha 2 роки тому

    2:47:17 outFile

  • @sinanyaman2007
    @sinanyaman2007 3 роки тому

    1:41:49 what is the point of union types then? We can do the same in javascript.

  • @germanantonio2822
    @germanantonio2822 3 роки тому

    At the Union Types section of the course, why did you use the "toString" method on parameters that were already strings? I mean, the whole point of declaring the types as numbers OR strings was to make sure that if they were not numbers they SHOULD be strings (since TS will complain if they're not). I'm confused.
    Also, it really makes zero sense to me that TS complains about the plus operator on the first implementation (without the type check and if/else statement) and that it doesn't on the second implementation (with validation), the operation is literally the same in pure JS, isn't it?

  • @romanjasko2333
    @romanjasko2333 3 роки тому

    Thank you

  • @genericperson8238
    @genericperson8238 4 роки тому

    Also, please don't confuse "value" and "the type of value". Void simply means, that there is no return value. Never means that the function will never return in the first place. There is a difference between a function that returns no value and a function that never returns in the first place.

  • @gideonodiase7151
    @gideonodiase7151 4 роки тому

    Thank you Max! I just love you!

  • @jroamindia1754
    @jroamindia1754 4 роки тому

    I know OOP in theory and i am beginner with angular . i want to learn OOPs typescript features and implement it on angular. how can i deep dive in oops in typescript.

  • @vibhav6642
    @vibhav6642 4 роки тому +72

    Hi Max, Usually I don't comment on videos. But I wanted you to see this. Your teaching style is just awesome. You put every concept that people are going to need in there future. I applied for a job in the meantime I was going through your react tutorial from udemy. I am super happy and will grasp all your courses. Everything they asked or everything that is needed was already present somewhere in your tutorial. There is no need to go through reference or anything while learning from you. Thanks and Love you Max the way you teach.

    • @academind
      @academind  4 роки тому +14

      That is just amazing to read! Feedbacks like this are extremely motivating and truly mean a lot to me! Thank you so much Vibhav!

    • @sharathpaka4198
      @sharathpaka4198 Рік тому

      @@academind Hi, from where can I download code and project structure? I don't see any link.

  • @TheJames808
    @TheJames808 4 роки тому +458

    Udemy course was lifesaver. I got current job thanks to it! Good job Mr. Schwarzmuller. :)

    • @academind
      @academind  4 роки тому +44

      Awesome to read that James, congratulations!

    • @Abhishek-dp5tc
      @Abhishek-dp5tc 4 роки тому +1

      How much pay?

    • @stonecoder007
      @stonecoder007 4 роки тому

      Course link pls

    • @vkray
      @vkray 4 роки тому

      @@Abhishek-dp5tc 150K

    • @theboringtube
      @theboringtube 4 роки тому

      I wish i could afford his course. I just rely only here on youtube for learning.

  • @Gleb_Pastushenko
    @Gleb_Pastushenko 2 роки тому +10

    Hello. A small clarification about numeric types at 42:10 : after the release of this video, in 2020 ECMA added another numeric type - BigInt (the 11th edition of ECMA 262 specification, paragraph 6.1 - ECMAScript Language Types). So now there are seven primitive types, including two numeric types - Number and BigInt. Thank you for this nice course and Good Luck!!!

  • @Rising_Pho3nix_23
    @Rising_Pho3nix_23 3 роки тому +1

    From about 5mim to 20min he talks about all the errors that the javascript code has and how to fix them using typescript. However, by simply adding a plus sign to both const calls, all those problems go away. 2 keystrokes does what took him 15min to do. Just saying

  • @MolaMolaSunnyfish
    @MolaMolaSunnyfish Рік тому +1

    If it is saying that it cannot be loaded because running scripts is disabled, is my company just stopping me from doing tsc?
    Never mind. Fixed it. Had to run a certain popular powershell line.

  • @Eide_Mana
    @Eide_Mana 3 роки тому +10

    Hi Max!
    I took your Udemy Vue and Nuxt lessons, and now I become a front-end engineer!!!
    so lucky to meet you on the Internet :)) Thank you so much!

  • @alexwhb122
    @alexwhb122 3 роки тому +16

    This is one of the best tutorials I've ever seen. Learned so much so fast! I only wish I watched this years ago.

  • @pgallovich
    @pgallovich 4 роки тому +13

    I have this course on Udemy. I am going to use this course to help me build a foundation in TypeScript. I am going to use TypeScript for development in building two real-world projects. Thank you Max this course is a lifesaver.

  • @sachinbabar4567
    @sachinbabar4567 3 роки тому +1

    Very nice 👍🙏 . Could you please let us know course of typescript react + typescript + hooks + redux course

  • @JohnGaurav
    @JohnGaurav 2 роки тому +1

    To run tsc Compiler...VSCODE might throw...unauthorized error like "scripts disabled to this system"
    in such Case... open PowerShell as Administrator
    type in this command
    1. Set-ExecutionPolicy -Scope CurrentUser
    2. Next set .... ExecutionPolicy: RemoteSigned ...press enter
    3. type A to make all changes ...Hit enter
    That's all .......... Now the TSC Compiler is Ready to use with VSCODE.

  • @valentin_gif
    @valentin_gif 3 роки тому +11

    Absolutely great course!
    Needed to learn TypeScript in 3 days for a job interview. This was a life saver, thank you!

    • @supermamoru
      @supermamoru 8 місяців тому

      How was the interview? I think myself and other people would like to know that ❤

  • @adriatic123
    @adriatic123 3 роки тому +1

    Those arguments for typescript are questionable. If you write the wrong code you may expect the wrong results. Funny how everyone mentions the wrong type case as a typescript advantage. And there are 'only' 1000 other possible errors that typescript doesn't correct. For example, if you forget a comma or colon in your code. Either you write proper code or you don't, you cannot use typescript only to check 1% of your possible errors during writing. Re javascript sample at 10:02 it is inefficiently written, one could put return +a + +b and that's all. Only two more plusses, much less code than to write it in typescript. TS has its usage but overall js is just fine. BTW this course completely missed explaining interfaces and classes, important parts of a TS.