TypeScript Full Course for Beginners | Complete All-in-One Tutorial | 8 Hours

Поделиться
HTML-код
  • Опубликовано: 14 ноя 2024

Комментарии • 588

  • @alwynjohn597
    @alwynjohn597 Год назад +162

    You are the definition of dedication , consistency and hard work. You have no idea how many lives u have changed with your educational video. Thanks a lot Dave for all the effort u put in.

  • @teknolovedigital
    @teknolovedigital Год назад +253

    Spending time choosing educational materials, recording videos, then editing videos is not easy.
    And you make time for it all. Thank you very much. May your life and your family always be filled with happiness and prosperity.

  • @zombiefacesupreme
    @zombiefacesupreme Год назад +14

    It's wild that I've spent multiple days of my life listening to your voice at this point.
    Thanks for everything, Dave.

  • @kavorka8855
    @kavorka8855 Год назад +7

    OMG! You don't leave anything fully unexplained, do you! You're natural!

  • @techchannel0
    @techchannel0 Год назад +19

    I absolutely love how descriptive you are with every action you perform. You are beating what many tutorials are missing and that's being a good instructor :)

  • @Joel-if2bg
    @Joel-if2bg Год назад +9

    20 mins in and man you are extremely clear and on point! It's also super helpful that you explain what you're doing so you can type and listen rather than have to stop every 30 seconds to see what's happening.

  • @dorcasM30
    @dorcasM30 Год назад +23

    Dear Mr Gray, words are not enough to thank you for all the knowledge you are giving away through all these videos. Truly this channel is a real gem that every aspiring developer should adopt. May God bless you and your business endlessly.

  • @ahummbrahmasmi
    @ahummbrahmasmi Год назад +174

    Mr gray is filling colors to our lives

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +27

      Thank you! 🙏

    • @gurvirbaraich2028
      @gurvirbaraich2028 Год назад +3

      He his fill his colors, thats why he is gray 😅😅

    • @MrFrenzaldude
      @MrFrenzaldude 7 месяцев назад +1

      This is such a sweet direct translation into English. We should totally adopt this phrase in English, it's so nice.

    • @ahummbrahmasmi
      @ahummbrahmasmi 7 месяцев назад +1

      Like tsc does to js

  • @yoyo-zm8mi
    @yoyo-zm8mi 6 месяцев назад +3

    thanks a lot, as an non-native English speaker, this tutorial helps me to learn ts while pratice my English

  • @universecode1101
    @universecode1101 Год назад +40

    Typescript is a better way to write Js code, so it can be very useful to learn TS. Great content 👍🏻

  • @maccodifavole
    @maccodifavole Год назад +5

    I just got hired to work with react, node and typescript and you are realising all of this... you're an Angel, Dave!

  • @adnanamin3666
    @adnanamin3666 Год назад +21

    Just in time ♥
    I was trying to find a good in depth tutorial to get started with ts for the past 2 weeks. Here it is finally. Thank you so so much, Dave. Best wishes! 👍🎉

  • @ogunsinapelumi1505
    @ogunsinapelumi1505 Год назад +2

    Mr. Gray, you are one of the best tutors I've ever seen you taught me React, and now Typescript I'm grateful.

  • @bragagamingz
    @bragagamingz 4 месяца назад +1

    I learned TS with this video, and applied it to the startup I work at to modernize our codebase.
    TS interfaces have already saved us dozens, if not hundreds of hours, and will make our Vue 3 migration much easier.
    Thank you for the incredible value, Dave.

  • @mujibulhaquetanim
    @mujibulhaquetanim 4 месяца назад

    I watched it a long time ago, but whenever I need to refresh my knowledge on the topic, I look it up in my watching history. I have great respect for that, man.

  • @99aabbccddeeff
    @99aabbccddeeff Год назад +2

    This is a great video. But one thing, when we write "constructor(public name: string)", we don't have to initialize the name field inside the body of the constructor "this.name = name". When we specified "public" (private or protected, and etc.), we had already done it implicitly.
    By doing this in TS:
    constructor(public name: string) {
    this.name = name;
    }
    we get this in JS:
    constructor(name) {
    this.name = name;
    this.name = name;
    }

    • @KidusDawit-h9g
      @KidusDawit-h9g 6 месяцев назад +1

      He already said "assignments in the body of the constructor are not required here" at 2:13:32

  • @SHAMITHADEVINDA
    @SHAMITHADEVINDA 11 месяцев назад +5

    Even the smallest detail is covered in this video!, very easy to follow and would recommend to anyone who wants to learn TS in depth. Thank you Dave for this golden content.

    • @Ba-dastooor
      @Ba-dastooor 29 дней назад

      Bro did you understand everything because I didn't get keyof typeof

    • @SHAMITHADEVINDA
      @SHAMITHADEVINDA 29 дней назад

      @@Ba-dastooor my memory fades after 8 months😐

  • @akitoakito
    @akitoakito Год назад +12

    Yet again Dave releases a master course that is easy to understand and follow. Thanks Dave.

  • @gdd546
    @gdd546 8 месяцев назад

    learning typescript for my qa playwright automation and im understanding everything so far

  • @santhoshreddy5948
    @santhoshreddy5948 11 месяцев назад +3

    Dear Dave, Your method of teaching is simply fantastic. This is by far the greatest video I have ever seen. You placed importance on each and every action you took. Learners gain an immense amount of understanding about the language, tool, and implementation from it. Thank you for this video.

  • @dfields9511
    @dfields9511 Месяц назад

    just finished this one, great, I learned some new things. there are some things I don;t like about the syntax with all the ( ) and { } all over the place, my old eyes often times gets them confused. coming from a C++ background () is for functions and { } is code blocks. I will have to get use to it
    and the => functions fname = () => { } , I prefer function fname( args ) { }

  • @florianackermann1233
    @florianackermann1233 10 месяцев назад +1

    Thanks for the useful and educational video. One thing that I was told from other OOP languages, is that the T in generics usually stand for the "Template" you want to create (see in the video at 3:04:00). Kind regards

  • @kashmirtechtv2948
    @kashmirtechtv2948 3 месяца назад +1

    1st 25 minutes and i am satisfied with the course.. great job

  • @PROJECTJMUSIC
    @PROJECTJMUSIC Год назад +12

    Thank you for making this! Chapters 7-9 were extremely helpful to me and now I finally have a better understanding of those topics!

  • @proexpert6325
    @proexpert6325 Год назад +2

    Man typescript is the goat 😂. And awesome work Dave!, you’re the best teacher ever

  • @mandaudaykiran2106
    @mandaudaykiran2106 Год назад +1

    My simple advise is teaching slowly after you become good teacher
    hope in next class you have to follow the tip or advise you will be power full maker for content to the learners

  • @azaanibrahimmohamed2846
    @azaanibrahimmohamed2846 7 месяцев назад

    You have helped me with a complete language that is useful for myself, thank you very much from somalia

  • @xzex2609
    @xzex2609 4 месяца назад

    This is the most complete and best typescript course ever .

  • @lukavarshanidze5367
    @lukavarshanidze5367 Год назад +2

    this is the best typescript course I've seen. thanks Dave. it's my first time learning from you and already fallen in love and looking for other courses to learn from you. again thanks a lot and hope you're doing well.

  • @mastercago3361
    @mastercago3361 Год назад

    I am moving from a pure sql position to a typescript based position, and i feel like this i helping prepare me tremendously. I do have an IT degree, but i have extremely limited experience working on the front end.

  • @LowProFile1803
    @LowProFile1803 8 месяцев назад +1

    Loved the easter egg at chapter 2: "let meaningOfLife equal 42". The Vogons surely love TypeScript, just hoping they are not writing poetry with it!

  • @ScaerieTale
    @ScaerieTale Год назад

    If you're getting a tsc.ps1 script error (Not signed) in VS Code do the following:
    On the right side of your terminal window in VS Code, just after the "+" sign, click on the downward arrow (looks like a 'v') and select "Command Prompt". It should work now 👍
    This forces VS Code to use the tsc.cmd version which is, essentially, identical. There's a way to change powershell policy, but I'm not comfortable telling anyone to do that who doesn't already know how :)

  • @ayushkathariya
    @ayushkathariya Год назад +2

    Thank you. I'm going to learn Next JS before learning Next I have to learn Typescript . This video is very helpful. Thank you very much!

  • @RuslanMahats
    @RuslanMahats 7 месяцев назад

    Thanks, Dave! I'm grateful that I can learn web dev from your tutorials. I can only imagine how much time and effort was spent making such quality content. You are the best teacher for me!

  • @maxmad4771
    @maxmad4771 10 месяцев назад

    Great lecture, only problem I have is pacing is bit slow, I listen set to 2x, and I wish it can go faster (3x or more), as even on 2x it kind of seems slow...

  • @kpm25
    @kpm25 9 месяцев назад +1

    Your hard work is very much appreciated!

  • @MuhammadUsman-fl7lo
    @MuhammadUsman-fl7lo Год назад

    Your voice is very clear even at 2x speed. God bless you!

  • @omarkraidie
    @omarkraidie Год назад +5

    One of my goals this H1 is to create a few ts-react apps using modern tech. I can already see that this video guide will help a lot and inspire some new design pattern ideas!
    I'm gonna "A chapter a day keeps the doctor away" this course.
    Thank you (your vscode theme is still pure bliss) :D

  • @jessedv5915
    @jessedv5915 2 месяца назад

    As a C# developer learning tsc you can easily tell the same person made it, and thanks to this amazing tutorial it is much easier to learn
    A tip for anyone 📝
    If you don't want to use the browser you can click the plus terminal and run node main.js where your js file is and use it like a normal console app🌠

  • @cryptojosef4035
    @cryptojosef4035 8 месяцев назад +2

    In lesson 6 there is some things that doesnt show in the console, like the Param error. its because he has commented out the "noEmitOnError": true, in the tsconfig.json file. in a previous class we made that to true, so there was no way that it could compile with an error. If someone is wondering why the cant see the console as he can in that lesson =)

  • @socialpeople6615
    @socialpeople6615 Год назад +2

    Your lessons are absolutely fantastic! They are well-organized, crystal clear, and packed with valuable content. Thank you immensely!

  • @freedmoresidume
    @freedmoresidume Год назад

    I just discovered your channel. I already envision my transformation. Am going to camp here for all my Web App development learning. Thank you for this incredible content.

  • @andreo5027
    @andreo5027 8 месяцев назад

    the best TS course you'll ever watch

  • @trailerverse319
    @trailerverse319 Год назад

    the best typescript tutorial , if u looking for to learn ts , choose this
    i am highly recommend

  • @jjeverson2269
    @jjeverson2269 Год назад

    Someone finally figured out how to make me understand Generics and index assertions. I still need a bit of practice to do it by heart but I understand it quite well due to this amazing tutorial

  • @browser736
    @browser736 Год назад +1

    love this, I've done a few typescript courses on udemy but none have been as clear as this one good job!

  • @renaissancejames
    @renaissancejames 6 месяцев назад

    Thanks for a great series. Been doing React for years and it was time to upgrade to TypeScript. Did a lesson a day for a couple of weeks.

  • @arjunsemwal02
    @arjunsemwal02 2 месяца назад

    Thanks Dave, for putting up such a great tutorial on Typescript, thanks a lot 🙏😊❤

  • @mustafahaider9115
    @mustafahaider9115 Год назад +1

    I absolutely agree that the meaningOfLife is 42 Dave

  • @yehannk448
    @yehannk448 Год назад

    I really wished i had your channel a few months ago , i have followed your Redux course and learned a lot from it and i am following your next js course.

  • @vasinsuksuchit1552
    @vasinsuksuchit1552 Год назад +1

    You hold nothing back! Pure knowledge Thank you So much!

  • @hirenchauhan908
    @hirenchauhan908 Год назад

    woww.... when you start teaching any topic i can't stop video myself till it finished...
    your all courses are like gems....
    amazing skill sir you have
    thank you very very much

  • @johnnydoe6696
    @johnnydoe6696 Год назад

    Just completed the video and I have learned so much (and also forgotten so much)! I am going to review and build some projects of my own to solidify the knowledge. Thank you so much for providing this resource, you're amazing!

  • @crasso4831za
    @crasso4831za Год назад

    Very useful course. Small correction @1:41:00, the terniary operator is unnecessary, because the comparison operators in javascript always return a boolean.

  • @ankitaburman5406
    @ankitaburman5406 Год назад +1

    Thank you so much Dave .A very much needed tutorial of 2023... I’m also glad that you covered the react with typescript 😮😮Cant thank you enough 👍

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +1

      You're welcome! Yes, I thought adding React from chapters 12 through 17 would benefit those who wanted it, and those who do not want it can stop after chapter 11. 😀

  • @annanlanre7419
    @annanlanre7419 Год назад +1

    I won't lie, this tutorial is 🔥🔥🔥🔥🔥.
    Just 2 hours in and I'm already seeing the possibilities.

  • @yogeshvanzara5553
    @yogeshvanzara5553 Год назад +5

    I watched three tutorial before but this one is pure gold ❤ TIME WORTHY ❣️

  • @zabantak
    @zabantak 5 месяцев назад

    The only perfectionist who is sharing programming tutorials ❤️🌹

  •  Год назад +1

    This is an absolute masterpiece. Thank you very much for providing this source...

  • @prajwalchoudhary4824
    @prajwalchoudhary4824 Год назад

    Completed this series today learned a ton u r a great teacher Dave

  • @WEWESification
    @WEWESification Год назад

    Dave I have only done two chapters so far and I will continue but I already say a big thank you for your dedication and the word is not strong enough!!

  • @ncinzer
    @ncinzer Год назад

    The way that you structure the final project its awesome, gives me an another way to think the build of projects, u are the best dave

  • @DavidHope-p2p
    @DavidHope-p2p Год назад

    This course was exactly what I needed and your instructions, detail, and pace were exactly what I was looking for! Thank you so much!!

  • @oluwatobilobaibuola5950
    @oluwatobilobaibuola5950 Год назад

    Thanks for your great contributions Dave.
    I supposed that the reducer action type from lesson 16 and lesson 17 should be typed based on the object key type instead of a string. This will foster code consistency as the type manipulated (Union type) from the key of the object depends strongly on the key of the object provided that the object is asserted with const. And that only the literal types from the union can only be passed to the action type instead of any strings.
    const REDUCER_ACTION_TYPE = {
    ADD: "ADD",
    REMOVE: "REMOVE",
    QUANTITY: "QUANTITY",
    SUBMIT: "SUBMIT",
    } as const;
    export type ReducerActionKeyType = keyof typeof REDUCER_ACTION_TYPE;
    export type ReducerActionType = typeof REDUCER_ACTION_TYPE;
    export type ReducerAction = {
    type: ReducerActionKeyType;
    payload?: CartItemType;
    };
    Example of a successful runtime error which static type checker could not help is shown below (This can occur when working with someone else that felt like creating another action but misspelled the action-type without a reference to the object created by the author):
    const onDeleteOrder = () => {
    dispatch({ type: "DELET" })
    setConfirm(true)
    }
    I also implemented this using enum in one of the lessons (lessons 16 | lessons 17)
    export const enum REDUCER_ACTION_TYPE {
    ADD = "ADD",
    REMOVE= "REMOVE",
    QUANTITY= "QUANTITY",
    SUBMIT= "SUBMIT",
    }
    export type ReducerAction = {
    type: REDUCER_ACTION_TYPE,
    payload?: CartItemType,
    }

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад

      You're welcome! And yes, you did good work here! It is true that even though we can provide the correct info with TS support and intellisense, someone _could still get it wrong_ as your example error shows. Very thorough addition!

    • @oluwatobilobaibuola5950
      @oluwatobilobaibuola5950 Год назад

      @@DaveGrayTeachesCode I am happy to share that with you and also many of us (student). You have really helped me a lot in my learning process.

    • @oluwatobilobaibuola5950
      @oluwatobilobaibuola5950 Год назад

      @@DaveGrayTeachesCode
      Hi Dave, Would you mind if I make a PR on this repository though I know it is not open source?
      I would appreciate it if I can, It will greatly boost my morale. I am also looking for an open-source project where I can contribute and a Frontend / Full-stack role (Junior/Intern). I am open to this opportunity. I will greatly appreciate your input. Thank you gray

  • @franciswayungi8896
    @franciswayungi8896 Год назад

    All I can say is THANK YOU DAVE !!!, these videos are great

  • @kareendawn4991
    @kareendawn4991 Год назад

    Wow! I finally found the kind of typescript tutorial I have ever wanted. Thanks so much, Dave !!!

  • @riteshgaihre6277
    @riteshgaihre6277 Год назад

    I have completed html course from you and now i am in CSS typography.. after completing Css, i will head to Java script. Thank you, for valauable web development course in your channel.

  • @kruseverve
    @kruseverve 3 месяца назад

    Great videos!! I have been following your playlist from HTML -> React. As I was going through this playlist, in the Generics section, I had a doubt in the isTrue function where you used `as keyof` in the second if statement:
    if( isObj(arg) && !Object.keys(arg as keyof T).length)
    { return { arg, is: false }
    As I was playing around to check my understanding, I queried chatGPT with this code, and it gave the following response:
    "When you use Object.keys(arg as keyof T), you’re effectively telling TypeScript to treat arg as if it were a union of the keys of T. However, Object.keys expects an object, not a union of string literal types"
    It provided an alternative of using Objects.keys(arg as object).length if you want it to be a little less type safe or put a type guard:
    if (isObj(arg) && typeof arg === 'object' && arg !== null && !Object.keys(arg).length) {
    return {arg, is: false};
    }
    So now I am confused.I feel that GPT response seems correct but since I am new to TypeScript I am not sure if i fully understood the keyof functionality.

  • @kassimalimohamed8817
    @kassimalimohamed8817 Год назад +2

    Thank you Dave, this is exactly what I have been waiting for many moths.

  • @danishdotak1998
    @danishdotak1998 Год назад +1

    love you sir from bottom of our heart you have no idea what you are doing this is free and it is so helpful for the people who are not able to join any bootcamp or even purchased any course god bless YOU!✨✨✨

  • @RPInside
    @RPInside 10 месяцев назад

    Awesome. Your Explanations are clear and i (my english is almost scolastic) can follow your steps without slow back the playback speed!

  • @dfields9511
    @dfields9511 Месяц назад

    gr8 video , did your CSS and Python videos as well, I found them very good, I came back to this one as I already have some experience with Angular/Typescript as a refresher. I have been focusing on Python more. Actually I like Python more then Typescript but they both have their strengths and weaknesses .

  • @hengkyvanderhouff3572
    @hengkyvanderhouff3572 Год назад

    thank you so much mr dave!, just wanted level up my dev skill by learning typescript and boom this course released! love u so much ❤

  • @erikmaxim9923
    @erikmaxim9923 Год назад

    THANKS! now, we are waiting advanced course

  • @weehongayden90
    @weehongayden90 Год назад +8

    Your courses are always so fantastic!
    I benefit a lot from your course.

  • @leonardmbibi8013
    @leonardmbibi8013 Год назад

    In lesson 13, useMemo, when myNum is declared outside the function, App; it throws this error: "React Hook useMemo has an unnecessary dependency: 'myNum'. Either exclude it or remove the dependency array. Outer scope values like 'myNum' aren't valid dependencies because mutating them doesn't re-render the component."
    I had to delare myNum inside the function, App.
    Thanks for your nice tutorials.

  • @mconstantin123
    @mconstantin123 Год назад

    Great course, very clear and thorough! If I were to suggest anything, some things are a bit repetitive, from lesson to lesson or sometimes even within the same lesson.

  • @joshc2368
    @joshc2368 Год назад +1

    Thanks for the tutorial Dave!

  • @nicolasbrandaor
    @nicolasbrandaor Год назад +1

    High quality material here! Thank you so much.

  • @waqaskhandev
    @waqaskhandev Год назад +1

    This is the perfect video I was looking for. I watch one chapter daily from this video and I am learning alot each day. Very clear, with usefull examples cases and full explanation. ThankYou So much for awesome contents. May God bless you.

  • @squidman8662
    @squidman8662 Год назад

    Love your channel Dave, addicted to your videos. Sending you love and good health.

  • @rincondepython
    @rincondepython Год назад

    excellent course! a little advice: in CartProvider, if you put the condition of action.payload on the top of reducer function, you could save to rewrite on every case in your switch(action.type).

  • @shafayyzzz4978
    @shafayyzzz4978 4 месяца назад

    sometimes by your voice it actually feels like saul goodman from breaking bad is teaching me, anyways you're a perfect teacher mr gray!

  • @KingLeoBull
    @KingLeoBull Год назад

    Thanks a lot sir for being my TypeScript GURU.🥳

  • @manikantaprasadlopinti8375
    @manikantaprasadlopinti8375 Год назад

    The most underrated chaneel ...sir i want to learn next js ...should i need to know typescript first ?

  • @tmt878
    @tmt878 Год назад

    Hello ;
    Currently I am learning " Vanilla JavaScript". I have plan to practice building projects after I completely done with " Vanilla JavaScript".
    My questions are ;
    - Do I need to master "Typescript" and learn it ? Or only JS is enough?
    - Where I should put "Typescript" inside my roadmap ? I mean after finishing "Vanilla JavaScript" ? Or after finishing frameworks? ( Since I have plan to learn vue.js and react.js sequencly)
    Thanks for replying back
    Best regards

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +1

      JavaScript is enough to get started building projects. When you start looking for jobs, the industry is moving to TypeScript.

    • @tmt878
      @tmt878 Год назад

      @@DaveGrayTeachesCode
      Therefore, the good idea is to learn "Typescript" , after I completely done with "Vanilla JavaScript" and its Projects ?

  • @adnanahmad_7
    @adnanahmad_7 8 месяцев назад +1

    We want to see videos on backend as well like message queues, pub/sub, kafka, nginx, redis please.

  • @alexanderkomanov4151
    @alexanderkomanov4151 Год назад +1

    My biggest appreciation for so amazing job and content!

  • @niteshprajapat7918
    @niteshprajapat7918 Год назад +7

    Can't thank you enough for this......
    just insane you are ❤️
    Thank you Sir ❤️🔥

  • @west-la-coding
    @west-la-coding Год назад

    Thanks Dave, learned the best practices from you!

  • @holderchannel4393
    @holderchannel4393 Год назад

    Thank you for the interesting tutorial. I can now read the documentation more easily.

  • @Orgix
    @Orgix Год назад

    Started watching when I was learning React and later Redux. Now, just when I thought it's time to get into Typescript, I come across this video. Hats off to you and your content Mr. Gray ! :)

  • @NotePortal
    @NotePortal Год назад

    Wow typescript really is helpful when writing js. Gonna use it from now on.

  • @gtechlabs7
    @gtechlabs7 Год назад

    You are the best Teacher ever, Thanks a lot.

  • @sweatermanny94
    @sweatermanny94 Год назад

    Super clear video! excellent for a beginner, thank you!

  • @MartinKamau-gs1st
    @MartinKamau-gs1st Год назад

    I love you Dave Gray!! Best teacher ever!!

  • @CTILET
    @CTILET Год назад

    Dave Grey have the most well understand courses in a net

  • @uzochukwuemeka3449
    @uzochukwuemeka3449 Год назад

    I haven't even started the lesson yet but thanks , just taking your next js 13 i kinda of understand typescript, this lesson will be awesome

  • @gagiknavasatariyan7316
    @gagiknavasatariyan7316 Год назад

    Thanks!
    So much better than many paid courses.

  • @kvelez
    @kvelez 6 месяцев назад

    {
    "compilerOptions": {
    "target": "ESNext",
    "module": "CommonJS",
    "outDir": "./dist",
    "strict": true,
    "forceConsistentCasingInFileNames": true
    },
    "include": [
    "src/**/*.ts"
    ],
    "exclude": [
    "node_modules"
    ]
    }