Mastering React Hooks with Typescript

all right welcome back to it we are going to look this time at typescript and hooks let's get right into it okay so i'm going to go in in my temp directory create a new project called ts hooks and i'll use yarn create for that with react app and then i'll do ts hooks and then i'll give it the typescript template and that's going to create a typescript project for us pretty much the usual sort of thing the spinning react logo with uh you know just in typescript as opposed to javascript so another thing i'm also going to do in this is put a few little touches on last week's video around uh basic component stuff and typescript just to make sure i got some good great feedback on that and i just want to pass it on to you to make sure that you know everything you should about how to do typescript components nothing really but no big changes i would say just you know some little little touches some ways to use const as opposed to using function and then also how to export the props as an interface so okay let's uh go jump into vs code on this and we'll start it up okay looking pretty good we got our spinning react logo it's time to go make a few visual changes just so we can have something easy to work with i'm gonna remove all this stuff all the boiler plate get rid of this don't need any of that and then over or you know what i'll go in and add in like a hello world and then over in the index.css i'll move it into the center of the screen i'll make it max width of 800 pixels and then put a little padding on it and then make the font size extra large just so we can see it let's go take a look all right there you go hello world tada cool so what i'm going to cover in this is i'm going to cover use state use effect use context use reducer and use memo and use ref use callback don't really there's not a lot of typing to do that there's actually not a lot of typing to do with use effect but you know you'll see as we get there i just want to make sure that you have a pretty pretty solid foundation of these and we'll do a custom hook as well and show how to put some types on that and as i said we'll go and talk about the react component stuff and make sure that you've got all your bases covered on that okay so let's go and do state stuff so i'll create some headings here so we can kind of see on the page each different sections so i'll do use date and then i create a component for each one of these sections so we'll call this uh use state component and all right so i'm going to go and create a new component called use state component okay so the first thing i want to do is create an array and then have a way to push items into that array i'm gonna have a button that pushes items into the array and then have the array so i need to create some state right so let's go create some state i'm gonna import use state from react and let's go down in here and i'll say that we have an array and an array set now some of the feedback i got was hey don't you use set array you can use either i use array set and the reason is that i like to be able to go and grab this and actually have both of them selected simultaneously using extend selection command d really up to you use state and it's an array right so just start off with an array cool and i'll go here let's say uh so we'll have we're gonna have two different examples here so the first one will be that array and i'll create a button say add to array and then i'll have the array so put in here json stringified array right so what what is this thing going to do on click it's going to do an array set and it's going to take the original array and then just add the length to it you know just so it starts off as nothing and then you get one and two and three okay so it's telling us it doesn't like this so why it doesn't like that well saying the argument of type number is not assignable to a parameter of set action state action whatever that is never in other words type number is not assignable to never where do you get never from i didn't say never what happens is that when you state looks to see what this value is because that's the only way that it knows anything about typing on this it comes up with never right an array that would just be that empty array forever and ever and ever it's kind of weird so the way that you coerce use state to say that this is going to be an array of numbers is you do less than and then number an array and then greater than that's basically saying okay so i know that you're looking for a type in this i know that you're looking to infer the type from this value what it really is is an array of numbers and this trips people up a lot this kind of array thing here and there's one more variant that i'll show you that also trips folks up but let's make sure this works for first so let's go and copy that and then export that as the default now we've got to import it over here how smart are you going to be no you're not going to be very smart about that okay so we're going to import it okay let's try this out hey it looks pretty good okay all right so the other one that trips folks up is let's say that i want to have a variable that starts off as as null and then maybe gets set to a and a string so let's do that so i'm going to say name and name set and again i'm going to start this off with with null because it when it boots it should be in the null state so copy that and i'm going to say i want to set the name to jack that call this set name and then over here we're going to json string file well just put in the name you know or there you go let's put that in there so it'll tell us whether it's null or not but again it's saying we got a problem with this argument of type jack is not assignable to a parameter type set state action null right so it's saying hey in this case the only thing i know about this i don't i'm not a mind reader i can't tell that what you want in there is a string or a null so again we'll use less than and then string or null and there you go so there we go so this is really good when you are working with say a payload that you're getting back from a server it's going to be null if you don't have the payload yet or it's going to be whatever the payload type is if you get that and so you're going to have a payload type in here and then null or undefined whatever you want however you want to play it in there so all right let's go back over here set the same oh perfect okay so looks like everything's working okay i think that's kind of the basics of use state let's jump on to use effect so i'm going to go and create another one here use effect and then we'll have a use effect component that we're going to build out so let's go and create a new file use effect component and again we'll create a use effect component and we'll export that so we're going to need use state and we're going to need to use effect so use state and also use effect so i'm going to build a timer and we're going to learn a couple of things from that we're going to learn one about the the typing on use effect which is not much and then we're also going to learn about how to build a timer that doesn't blow up so okay so the first thing we need to do is have a value in here and also that setter we use use a state for that and we'll start off with one why not and then we'll go in here and just put you know div bow pretty easy so now we need our use effect so let's go bring in use effect and let's go check out the typing on this so hit right click on that hit go to definition and over here you get the definition for it okay so right away we notice that there is no there's not like you know t in there i shouldn't really edit that but you know okay but what we do have is this effect callback so let's go to the definition of that and just to make sure that we're doing the right thing so basically what this is telling us is that use effect takes a function and that function either returns a void or it returns a function that in turn returns either void or undefined okay so let's do that so let's go create that function and we're only going to run it on startup which means that our dependency array which is the second thing in there is going to be an empty array and then within that we're going to say we want a window set interval which is how you do it timer now in turn also takes a function confusingly and val set and naively we're just going to say hey okay we got a timer callback let's go and do that with val plus one we don't want it to happen incredibly fast so let's go and put in a thousand in here just make sure that it's a thousand milliseconds to a second so this is only gonna fire every second and we're gonna save that out and so there's two issues in here so all right let's all right we didn't actually bring this in yet so let's go do that use effect component and then drop that in there okay so interestingly it goes from one and then it goes to two and it stops so why does it do that well so that's an interesting thing about this so let me get rid of a few of these things so we can kind of concentrate on the code here so what's happening is that this is what's called the closure and it's actually capturing the state of val the one and only time this is ever run so use effect runs and then sets up this window set interval it sends pass it a function and says well what's the value of val at this point which is actually one right and so it says great okay so this is essentially stuck on one forever so the way that we fix that is we do v and we make it a function so we say v equals v plus one or it's a function now because the setter we got back from use state can either take a an actual value or it can take a function and that function gives you the current value and then you can mutate it so in this case the current value comes in as v and then it does v plus one so let's save that out and now one two three so that's working we fixed that bug but there's one more little sinister bug in here that we haven't fixed which is that this set interval never gets cleared so there's a clear that needs to happen so the way that you do that is you grab the timer handle basically and then remember how over here in use effect if i went in here and it said the effect callback can either return nothing which is what we were doing before or it can return a function that returns void or undefined well that's what we're going to do in this case and that function is a cleanup function so we're going to do return and we're going to return the cleanup function so this basically tells react hey when you get rid of this component make sure to run this little function on the way out the door to just clean everything up and then you'll be fine so in that case the way you clean it up is you say window.clear interval and then you give it that that timer so there you go there's a a cheap and easy way to do a nice timer that time actually does the timer thing and also cleans itself up when it's no longer needed so let's go back over here to our yep looks like it's going going pretty well there okay all righty so let's talk about uh use context next that's another cool one so let's go and let's look at our list of hooks api so we've got use state so far we covered that we got covered use effect now let's cover use context so if you're not familiar with the used context it's a way of passing data around the whole tree without prop drilling so prop drilling is when you you take state from a parent component and you drill it down into the components below it this allows you to context allows you to go and pass around that state without actually having to uh prop drill so let's bring back our files create a new file called uh use context component and there's a bunch of things i need here so first off we need some we need to read it create a context so the way that we do this normally is we we actually externalize this because you're going to have context share between multiple components so you really are creating what's essentially a store so let's go actually create a store file again we'll use ts for typescript and from react in this case we're going to bring in create context like that so what we're going to do is we're going to set up our initial states we're going to say const initial state and this will hold say first name and last name okay and then we're going to go and create some context so we'll say context is create context and then we'll give it the initial state now that actually does do the type inference it figures that out so for example if i go over here to the definition we can see that create context takes a default value and that becomes the type because it returns then the context for that type but you know hey let's actually be a little bit more systematic about it so the way that i do it would do that is well i don't have a type for this i haven't declared one so what i can do is i can say type of and then give it the initial state and that basically says okay i want you know this as my type all right let's uh go and export that context i'll go back over here and we'll import let's call it user context and now i want to have a couple of components because i want to kind of sprinkle stuff around so i'm going to have the top level component we'll call that again use context component and what it needs to do is it needs to provide that context down the tree so if i go under user context i see haha i've got this provider thing so that's what i'm going to do i'm going to provide my context down the tree but what it needs is it needs a value so it needs a value to provide down that tree now there is the default value that comes in but i i want to provide my own value so i'm going to go and again use use state to track and provide that value so we'll call that user and that's going to go into that value like that and i'll say okay great i i want state but i how do i know what that what's that is supposed to be so i need to know the structure of this this thing that i want to provide down to all my components i'm going to go back over here to use effect to the store let's get rid of use effect components don't confuse ourselves and we'll go over here to initial state and actually i really want to export this i want to export the type of this because i want my my state to match this the schema of this particular thing so i'm going to say export a new type we'll call it user state and we'll just give it the type of initial state and now this user state can be used to define the shape that i want from use date so i'll bring that over here user state and then using greater than less than now i can say great so use state in this case is supposed to be one of these user states so if i jump in here and i hit command space oh there we go excuse me first so let's say you know jane last name is smith there you go and it seems happy everybody seems happy that's great cool okay so let's go and actually now consume this somewhere so i need a sub component that's going to go grab this so we'll call that consumer component this is the the component that's going to consume that context and this is where i'm going to use use context finally after all this we're going to finally use use context so i'm going to go get user from use context but i have to give it this this user context so it knows which context to get it from well let's go get this from react first use context pop that in there and then i'll just you know just put nice little div what's reactive is not multiple nested divs first is user dot and check that out so immediately use context because it knows it's coming in with user context it knows what the structure is of this thing now you know i could if i wanted to i could say use context like that i could say that that's fine too and look everything's fine now so it's it's still happy with that right but it's inferred which is probably okay but you know let's let's do that that's fine do first and then last all right now let's export this and finally bring it into our app call this use context use context component if you want to know how i did that by the way so let me undo that here i hit i started with you use effect component on that third line hit command d command d and then i just typed in use context component and away we go let's take a look well that's because i haven't actually used this so let's go bring in that consumer component drop it in there in there save it and there we go first is jane smith and away we go cool nice all right so let me just go and add a button to that so we can change that let's show you how that's done call it change context provide a click handler and then set that user to i don't know josie smith josie whales i don't know who knows okay and now click on that change the name away you go cool nice so notice that we haven't done any prop drilling between consumer component and yeah this state is automatically being essentially transmitted through that context down into that consumer component and when that context changes it automatically updates the consumer component and away you go so let's see is there any i think i think this is actually pretty good as a place to end on used context really i'm sure there are a few more variations in there but maybe i'll address those in a later video okay so what else we got oh we got use reducer so this is an interesting one because i'm not going to go into state managers in this video but in a later video we're going to talk about redux and actually a lot of what we would do in redux we're going to do right now as we talk about user reducer so let us go and create yet another slot for use reducer and get ready to create our user reducer component so let's go here use reducer component okay so when you do a use reducer why would you do a use reducer that's a really good question well you'd use it to use reducer just like you would use use state except that if you've got complex state so you've got a state that has multiple things in it then that's when you want to use something like a use reducer but i'm not going to do that necessarily in this case i'm just going to create something pretty simple so i'm going to create a an initial state that is a counter starts at 100 and then there's going to be two different actions that i can apply to this state i want to be able to increment it or decrement it and so what i'm going to do is going to define a type we'll call it action types and we're going to say that it's either type of increment with a payload of a number or it's decrement with a payload of a number and i'm going to create a reducer we'll call it counter reducer and it takes two things it takes a state which is the type of the initial state and then it takes an action which is a type of action type i'm going to get rid of the equals there because that's not syntactically correct and now on a switch on the action type so like hit dot there it knows because from this action that it's either going to be action payload in this case or action type i'll do that and then when you switch you have to give it a bunch of cases so let's see case aha this is cool so this is actually where typescript is helping us because we've done this work so this is telling us cool well you're you're switching on action type and i know that action type actually has to be either an increment or a decrement so let's do increment first and then the contract of one of these is that it needs to return the updated state so that's going to be everything is currently in state but with the counter set to the state counter plus because it's an increment the action payload all right and then we'll do the same thing for decrement except that it's minus and then finally you need a default so the default in this case we're going to just throw a new error that says bad action we didn't know what you're talking about so okay all right so it's giving us a little what's the problem user can be compile okay counter reduce is never used okay so let's go and let's go and use all this stuff so let's go and create our new use reducer function use reducer component all right so we'll start off by creating that user reducer and what you get back from user reducer is you get a state and then you get a dispatch and then you use use reducer save it did it import it oh my gosh it did finally it did doesn't always so what does a used reducer take it takes a reducer hey we got one of those we got this guy counter reducer so let's drop that in there and then it takes an initial state and we got one of those too that's the initial state up here pretty cool all right let's uh now go and build the ui around this your usual divs and the first thing we want to do is show the count there you go and then we want to have some buttons button button who's got the button so we'll say increment and we'll give it an unclick and now we're going to use this dispatch because we want to dispatch an action which is going to be one of these action types to our reducer so let's go dispatch and now oh look at this cool it's automatically telling us type should be either increment or decrement so let's do that let's do type and then what oh wow that's nice he even did that so payload let's do um 10 up every time you hit increment we go up by 10 all right and i'll put a little pipe in there and then i'll have a decrement let's get hinted again now yep there we go decrement and this one we want to decrement by five so let's do uh decrement there it's a long file but it's not actually doing all that much just kind of that's the way prettier likes to lay it out okay so all we need to do now is export this export default and then go back over here to app.tsx and we'll drop that in there and of course it's not going to go and auto import it for us so let's go and bring it in like that now let's see how we go oh i'm pretty good so far so let's increment it oh yeah there you go nice pretty cool okay so obviously this is not let's go to a few files here this is not all that much in terms of uh complexity but you can imagine where you've got an initial state that's fairly complex it's got a whole bunch of different values in it um and you've got a whole bunch of different action types so that this is basically sort of when when use state kind of runs out of gas that's where user reducer comes into play so and if you can actually see that it's written up in the documentation as well so here you go go to definition says uh there you go so user reducer is usually preferable to use state when you have complex state logic that includes probably off the screen multiple sub values so there you go it's pretty much honestly it's basically redux built into react all right let's continue on so we've covered use state use effect use context use reducer uh let's talk about a custom hook in the or actually let's talk about use ref first and then we'll talk about a custom hook and and use memo so use ref isn't all that big of a deal it's really just typing the type that you expect from the reference but let's go check it out anyway close that out call this use ref and we'll create a new component use ref component you know you don't often use references or use you know for usually you're keeping track of an actual html component or you've got some type of current data like a handle you just want to hold on to but you don't necessarily want to re-render when you change it all right here we go so ring and use ref and we'll create a new component and it's going to have like an input field in it and we just want to get a handle onto that input component so we use input ref and then we use use ref and we start off with null and then we say that the ref the reference to that particular input component then that this is going to actually hold the actual html dom element is input ref and the only thing you need to do necessary we don't need to do it but and it's doing it automatically for us at this point is you can define what this input ref is going to be and that would be an html input element because it's an input or null that's how you're going to define that used ref this is actually covered in in some detail over in the cheat sheet and this is this is basically a sort of practical look at how you'd get this to work so you can use use ref for other things but this is you know i would say the primary use case of it so save that off it's really not going to see anything interesting here but i'll just put it on the screen just because and you can also grab this component or this this code from github check it out for yourself and play with it yeah there you go so a nice typed version of use ref over there cool all right so let's talk about custom hooks so i want to have a new file we'll call it custom hook component i'm going to talk about how to type custom hooks so i'm going to go grab my new favorite data set and that's the happy valley growlers list this will go into the public directory happy valley is where i live and there's these growler stores where you can go get um growlers filled with whatever you want beer wine cola whatever and this will be a list of all their taps so let's go back in there and just it's just a nice data set so we're going to go and use a fetch we're going to create a custom fetch hook to go and grab this data and put it into our component so let's go build the component first so create a custom hook component all right and we'll export that and so now we want to go get the data so instead of just going and using use effect and use state we're going to go and create our own get beverage data hook right so i'm going to create a new function for that call it use fetch data and i'll take a url which would be a string and it's going to have a couple of things it's going to have a use state it's going to have data and it's gonna have uh done so let's let's whether it's gotten the data back and whether it's it's done so let's go and import those so i need to use state and use effect so the first one is the data and now it's going to start off with null so this gets us back to that that use state null thing so we got to watch out for that oh let's go get this syntactically correct first there we go cool and then we're gonna have done i'll call that false because it starts off and hadn't gotten the data yet so let's go fetch that data and to do that i'm going to use a use effect and we'll go fetch that url and then we'll convert the response to json and then once we have the data back we will set the data we'll call that d just make it easy on ourselves we'll set the data and we'll also set done to true now we only want to run this when the url changes so put the url in there is it a list of dependencies cool and then we'll return the data and the done neat okay cool now we really want this to be typed so i'm going to go over here to heavyweight tablets.json i'm going to copy command c this and i'm going to use this this really cool extension built not built in but i added it on to type 2 vs code that converts anything that's in the json in the clipboard as json into a typescript interface it looks at the json and says oh what are the types in there and there you go so i'm going to run that now this convert json clipboard to typescript interfaces and cool so if i look at this this root object matches this right so strings and numbers and all that good stuff so but that's not really root object is a great name for which we'll call beverage and this guy is going to be an array of beverages or null right because that's really what we want we're going to get an array of beverages off this this fetch data and then this guy is going to be that that beverage array cool nice all right and so what this is going to do is it's going to return data which is a beverage array and done which is a boolean like that well let's let's try it out let's see if this actually works or not well hold on so what do we got here so data oh i see or null right okay so that's why that's why that was a problem so let's go do this let's go do the fetch data we'll say data and done is using our cool new custom hook called fetch data and we're going to go to grab hv tap list dot json which is the same thing as what's over here in in public save that out and now we'll say if we're done then i want to put out a uh let's see so an image because there's this really cool logo in there right so i'm going to say that this is the alt alt is going to be the beverage image beverage logo and what's the source going to be well the source is going to be the data zero dot ooh check that out because it knows it knows that i'm getting back an array of beverages it knows all the different things in there so i'm gonna say logo now i know and you and i know that done means that this is not going to be empty if it's done so i'm going to put in a bang there exclamation point and that's going to tell it hey no it's cool don't worry about it i'm going to guarantee that that's in there all right let's see if this actually works so i'll go over here to use rev we'll call this custom hook component custom hook all right let's try it out let's see if this worked out whoa right away that's pretty cool okay custom hook so cool all right so we've got now our logo in there of the first one in the list we can have some fun and say that you know the second one let's look at what the second logo is nice okay cool so that's neat all right let's go back to the zero with logo so a couple of things about this one this is really cool and what happens if i want to go and actually make this generic right so i want to compete with tanner inslee's use query and uh i think we got a good starting point here so how do we how do we do that well one thing we can do is we can say well let's go and take everywhere where beverage is which is just those three spots i'm just gonna say that's that's payload whatever that is and it's gonna be the payload and i'm gonna put in here payload so i'm making it now a generic function and that's pretty cool but now down in here it doesn't understand like whoa i don't know we've lost all notion about what this is you didn't tell me any anywhere where that's a beverage so i'm gonna go grab that beverage again scoot down here to use fetch data and once again open and close those greater than less thans and put in the it's of a type beverage and now this is a generic function this is really neat so i can point this at any data set anywhere and as long as i can give it the the output what i expect to see from it it's going to go and automatically do all all the coercion and that's just really cool so let's talk and that that's basically how to do the custom hook stuff but it kind of works with uh with use memo as well so i want to talk about a little bit about use memo there we go so there's an issue there for a little bit but now it isn't uh use memo cool and that's the last one i'm going to cover before we get into little touch-ups on the component stuff so okay so use memo so let me go walk through a little use case here so i'm going to say that we want only the portland taps so we've got our list of beverages but we only want to show the ones that are from portland portland taps and i'm going to use use memo for this one use memo and what use memo does it takes a factory method it doesn't take any inputs at all and it returns some some data so in this case i'm going to say that it's based on the data or an empty array and i'm just going to filter that array just down to the portland item so filter and now notice right it already is hinting to me that the value here is going to be a beverage because the array of data is a beverage so let's say that's a bev and now as i do bev dot i'm starting to see some cool stuff so i got producer location there that's probably what i want i want to say includes and then portland and then the next thing i knew one need to do when it comes to use memo is tell it what data is going to change is going to trigger me to actually rerun this cpu compute intensive function in this case it's just data so whenever data changes right we're going to then go and recompute portland taps so i'll drop that in there for the data i'm just going to show the first portland one and i can now change done to like something like portland taps.length so when length is greater than zero then we automatically show it and let's save and boom okay i guess that's the first portland beverage i certainly hope so so i think it is honestly yeah if we go over here yeah this is in portland oregon let's see are there other ones there's papyrus iris that's a great name all right so there we go let's put in one there what does papyrus iris look like oh that's a good looking looking logo there all right so what have we gotten through so far we've gotten through a couple variations of use state use effect use context use reducer use memo use ref all that good stuff okay well let's talk about last week's video and some of the user feedback that i got that is particularly relevant here or i want to clean up a little bit so let's just clean up a few of those things call it even more react component even more react component stuff create new file for that even more all right so there were a few things that i wanted to go over and the first one was that i showed how to define props but i didn't show how to export the interface of a set of props for a particular component and i think that's worth going over so the the first one that i did was i did a header heading component which took a title and that title was defined as a string all right you know pretty clear and the criticism i got was hey by the way you really should go and export that as its own props so let's just say that i want to export this heading i want to export a default here as well so i'm going to say you know test component and we'll return a heading with the title hello like that and i'll expose export that as the default so let's go back over here so another nice thing to do would be to say export interface and then say heading props put those together really and and there you go so this is a good thing to do it's absolutely a great idea i'm sorry i didn't mention it last time absolutely worth doing let's go and check it out you know does it work yes hello perfect let's change it like an h2 or something like that or h3 so i can visually tell the difference yeah okay perfect great so yeah no this is a really good idea for sure and the second piece of feedback that i got was you know why do you do functions why not just do const so in this case you can do that for sure absolutely so you can do const and then do uh equals and equals great you know equals greater than and that that's fine too so whichever way you want to roll with that that's fine and then the other was around specifically generics and const so let me go and kind of reproduce what we had originally so we had a list generic function that would take a list of items and we'll call this list item and then we'll take an array of those and then would also take a render function and that render function let me let me get this to save so it's it's nice and spread out or not and that render function would take an item which is also defined as a list item and return a react node for that now are you going to import that for me oh it did oh thank you so sweet okay and we'll go and return out a unordered list of items we get the item and then the index and then we do a list item and within that then we call back that render function with the item and we give it the key of the index yeah and this is a nice generic way of doing lists so if you want to see this actually run let's go and make this a fragment or a div or something so get a list its items are a b and c as easy as one two three and the one thing that we're missing is a render function so we'll give it a render and we'll say for any given string output i don't know strong with the string in the middle of it all right let's go take a look there you go abc nice okay so the other piece of feedback that i got was hey this functioning thing is really cool can you do this as a const i really dig on the const flavor of defining my my functions my components and of course you can it's just a little bit twistier i would say in terms of uh its implementation so let's go as we got the const right and we're going to say this we're going to define the variable name list and then let's see it so that all this works works for our character works and but now we have to define the return type so react node that's what it's going to return and then we need to define the implementation so we're going to do items and render and then again another dash greater than and there you go so there's the constant variant of that but i gotta say to my eye that's actually pretty hard to read so i'm gonna go and grab this and say this is a new type called list component and equate it to that and then this just becomes list component and i think that's just a little bit easier to read i would say and we can also of course export that as a type as well if you want to have somebody else derive from that so you know pretty clean uh interface there so hopefully that helps out when it comes to functions and generics wow wow that was a big video the longest edited video i think i've ever put up on youtube really excited about though and i hope that you've gotten a lot out of it in terms of being more comfortable now with hooks and typescript and how they work together to make a more typesafe code base one that's easier to work on and you get all that hinting and all those other great benefits that you get from typescript if you have any questions or comments be sure to put those in the comments section down below or you can go on the discord server that's linked to in the description jump on the pound typestrip channel and jump on in ask you any questions and hopefully the community myself included will help you on out with that in the meantime of course feel free to like and share this video with your friends subscribe to the channel if you haven't already but in the meantime from me to you be happy be healthy and be safe

Channel: Jack Herrington

Views: 20,247

Rating: 4.9678159 out of 5

Keywords: react js, react js tutorial, learn react js, typescript, typescript react, typescript interface, typescript react hooks, typescript react hooks tutorial, typescript hooks, typescript hooks react, typescript state management, typescript hooks course, typescript react series, react hooks for typescript, typescript for react hooks, typescript and react hooks, typescript react hooks course, react hooks typescript series, react hooks with typescript, typescript with react hooks

Id: zM_ZiSl2n2E

Length: 55min 11sec (3311 seconds)

Published: Wed Feb 03 2021

Reddit Comments

[u/[deleted]]

Amazing!