Typescript Generics Tutorial
Вставка
- Опубліковано 2 жов 2024
- Learn how to use generics in Typescript. I go over how to use them in your React.js code and create your own in functions, interfaces, and jsx.
#typescript
Code: github.com/ben...
----
Follow me online: voidpet.com/be...
#benawad
One of the best tutorials on Generics I have ever watched. Thank you Ben!
Not for beginner though, while I was watching this I could see the useful parts, but some times I just didn't get it (most parts in React part) ... I will read and fully undertand their full important, I won't give up.
@@edwingarcia5043 The generics explanation was very good, you're probably lacking other information needed to understand the code, I recommend revisiting more basic concepts of programming before jumping into this.
@@georgestan9563 No it was clearly noting to do with the basics of programming and more about him not understanding how React and Formik works. I think he pretty clearly said that in his comment. Which BTW is quite irrelevant for him unless he want's to use either of those, this was just more of showing a practical example for people who are familiar with React and Formik.
He's an asset in the JavaScript community
Was about to say the same thing. No nonsense, really clear and focused!
This is the best generics tutorial on UA-cam
Finally I understand generics. Thanks!
This video legit dropped right when I was reading Typescript docs
Mad props for making this. Found that the docs were pretty lacking when it came to generics and this really cleared things up. Been using TS for a while now but still found this super helpful
Think of generics as arguments to functions except your doing types :) ur welcome
I like that
Yeah that’s how I think of it anyways
Yes! That's what I thought aswell :)
is there other way to think of it? damn
The point that i couldnt get is why should i use generics while i can basically make type definiton for parameters and returns? Can you help me please
Great video! I’m so glad that you used example functions other than an “identity” function that just returns the argument. It’s much easier to understand when you can infer how the thing it’s doing is something that could be useful.
Best generics explanation i found on youtube so far. Thanks.
to return the tuple you can also assert `as const` at the end of that function
Yes, that might be another way but the disadvantage will be that typescript will not allowed to push more values in returned array as we declare it as ready-only via const.
Or u can use keyword readonly.
Can't expect better explanation than this. Thanks Ben.
I can't count how many times I've use a Ben's video to settle a discussion :D Thank you for the all awesome content! Inspiring programming style, using TS at it's best, always!
absolutely brilliant tutorial, thanks!
By the way ur killing it my dude. Keep grinding your in your way
At 19:37, it seems to be some sort of parsing error which mistakes for JSX instead of a TS generic. You don't necessarily have to "extend" something to get the parser to realise it's a TS generic -- a simple would work as well.
Great video, Ben!
I was running into the exact same error at 4:16 too! Thanks man
Thanks Man
Great video. Really liked how you included some React as well.
I've been youtubing and googling for over an hour trying to wrap my head around generics. The first 5 minutes of your video did a better job than all the other videos and articles and documentation. Kudos, and thanks!
At 11:50 when he mistakenly wrote boob :)
Really good as always, Ben! I've been using TypeScript for a while now, but I still learnt a lot from this video! Thank you.
i miss these kind of videos @Ben
This was an awesome video sir. Thank you for this
This will take some time to digest.
When you want to use only one generic arg with react FC you can also write it like that:
Wow! amazing ... I just realized its Parametric polymorphism
I love this.... Just started rewriting an open source library of mine in typescript and this was just what I needed. Thanks @Ben Awad
Thanks. 3 new uses for generics
Thanks man, this really helpful!
Ben, to get the most out of your videos, one must already be familiar with the concept
Here's the easiest generic:
let arr = [].
🤣
ياااخي احبك والله ضحكتني والله تحياتي الك بن عواد هههههههه
When using a generic with JSX it'll scream at you if unless you use but you can also say , took me awhile to figure that one out.
nice one! just what i was looking for.
WOW!!! I could kiss my screen right now!!
Ben you beautiful mind you!! Thank you, I understand Generics now!
Love how typed language nazis accept generics. LOL what, types are great but here are generics that allow you to USE ANY TYPE WOAHHH kinda like untyped language?
Someone from a Java background should have issue with Typescript
The mountainous volleyball wessely search because yak puzzlingly harass into a unknown appeal. reflective, giddy doll
Thanks bro. I was look for interfaces that implement generics just right now
Thanks bro. This tutorial really helped me out understand generics. I used to look at 's all around a codebase and I was like wtf is this shi*?
really good explain Typescript Generics..!👍
As a developer we always look for short video but better to explain. you did good job to explain and that what i like about this video.
the bob was a typo on purpose xd
Man, this is amazing stuff! Thank you bro
Aaaand... that's it? xD Man, I was watching others trying to explain it like it was some sort of a rocket science. Thanks!
TypeScript it's much more then react uses... Better you go with classes and other useful examples, not react.
TypeScript logo has rounded corners, but logo used in the thumbnail does not have so.
Thank you very much.
At 9:53 / 21:55 you deleted everything within the . and again at 9:52 / 21:55 you delete ', number". how do you do this. i am aware of CMD + Del and OPT + Del
Funnily enough, if we move the object passed on line 33 @ 12:13 into a new variable, and then pass the variable into the fn, the error goes away. Wierd Stuff
This helped me alot. Thanks Ben.
Great content! Btw: what keyboard you use? Any recommendation? Tks
Отличное видео, спасибо!
Typescript is like rolling a turd in glider (the turd being JavaScript)
Thank you so much, for your great Generics tutorial.
This is awesome.
What is the shortcut you did at 9:56? How did you remove everything inside the `` without selecting it?
Thanks for this video it really help and simple to understand typescript generics
dopest video ever. i always come to this when i forget generics. this video alone is 80% typescript
Awesome tutorial 🔥
Great content. Keep up with the good work.
Ben Awad the boss of coding on youtube and some of the best explanations that I have seen.
This is a good ass tutorial!
I just finished a whole project without generics, I wish I watched this video before. Why is this rarely mentioned in Typescript tutorial on youtube?
At 19:43 Line-18, you don't _have_ to write ** instead write it as ** notice the comma after T
thanks
What video recording program did you use? Love the code editor view with you in frame
This tutorial cannot be free! Thank you so much :)
Thanks, great explanation
- The best generics tutorial I've ever watched!
19:58 is that a common approach to use children in this fashion? It is not obvious for me as for newbie.
The video was really quickly but you give the concepts clearly and concise, thanks, man
11:48 when you see it
this the best typescript tutorial video i have ever watched, thank you
You have the best tutorials on UA-cam. Thanks so much!
very great tutorial, now i understand Generics ❤
how to set generic to @Input and @Output properties please
Hi,
Can anybody tell me about the keyboard shortcut he used 9:56
makeArray(“a”, 5)
To
makeArray(“a”, 5)
Removed
I believe he used dt( to remove ( "dt(" means delete from current cursor position till parenthesis)
FYI he is using VIM for these fast edits ;)
I just love that you're using Vim.
I need help, I'm stucked, i couldn't figure out how to take the type that I passed inside a generic at run time, let's say I have a generic, Content, and the ContentType may be Facebook | UA-cam | Reddit... , how would i know which content type is currently being used.
The example Tab is really similar to my current situation, but i wan't to know what type i've passed inside the Tab generic
Still relevant in 2024, thanks a lot Ben :)
Just got into Typescript pretty hard about a month ago. Was always confused what the
Excellent video, learned a lot.
Thank for the video! Very useful!
11:50 nice
you are looking like kid ,How old are you brother ?
Thanks Ben,
Please keep making videos like these on Typescript
Thank you Mr. Awad for the short, concise, and elegant explanation of generics.
I read few blog posts about generics and thought I am too stupid for that but your explanation made me understand everything I struggled with before. Thank you
When I try to do a generic react component, typescript either screams that the function has no explicit return, or that the function cannot be used as a jsx component. Anyone know how to fix this?
At 8:52 if I pass undefined instead of null, it will also work. Strange typesafety
Microsoft is proud of you 😹
This video is really great to start with typescript generics
With C++ background, these are easy :)
Thank you Ben! Now I can refactor my project better.
Thanks dude, I'm studying for a week, but this video clears all the doubts, you're rock!
Love it, thank you, man!👍
Thanks Ben!
Your videos are always great. Thanks Ben. You explain everything really well.
15:22 - Such a good expression )
awesome, thx.
Thank you! Really clear explanation.
Would you consider doing a video on your process for auto generated code that you use?
Are you referring to github.com/dotansimha/graphql-code-generator
TypeScript makes me dizzy
Thanks for thie video.
Great way to explain things. Thanks Ben