ADVANCED TYPESCRIPT CONCEPTS PART 1- Live Webinar | Hacklunch

[Music] okay very good so let's get started so III prepare for you few just just a simple things but how we how you going to learn basically I'm going to build some I'm going to show you some different aspect of typescript that you might know or you might you probably don't know but know today - today there is no github repo because I'm gonna do some demos but those those demos and videos and the github repo if you want I can put it together and give that back later so that's a question from Olivia but you're going to have access to those video on the YouTube channel of hacker geez so no report is time people we've been building some amazing content in the coming weeks so we have we're gonna have like session on tap strip and graph QL we're gonna have session on tap script and react we're going to have session on building web component in like building one web component in one lunch actually lunchtime this is so amazing so let me go back quickly to what we have today so if I say Union type and discrimination Union does that speak volume to people I guess yes so if you hear you probably use Union in intact grip so you would go something like this you say okay I have I'm gonna have a type and say a string and number for example okay so you said this is basically this type and you're gonna say this is a string it could be a string or a number okay so that that's that's a simple Union so if you look at this you see it you see that this tink will be either string its endure string or or a number okay but the there is something you can do with this to leverage the fact that you're using Union in your code so I'm gonna I'm gonna go step by step here and show you a few things let's let's for example say we have an interface of dog okay and then we're just gonna have the kind of dog so we say this is a dog okay so look I'm using an interface I'm basically saying the kind here is a dog so don't be confused this is basically where you can write that you would say well instead of saying it's a string I'm assigning it the value the type of dog it is a type right there okay so I'm just typing the thing and then I will say a dog bark so let's say and then we said this one is a string okay let me make sure that that flow goes well and now let's say for example we're going to have another one which is a cat so if there is a dog there is a cat somewhere right so stay with me so now we have this this one is a cat and a cat obviously and you say yeah obviously so as you can see here I have two types so guess what those are they are anymore right so I can have a dog as anymore or a catch okay so that's that's a basic that that's the way you will do that so you can align them one after the order and then use that in your courage to make to basically write much much stronger code so what do we have from now we're going to have a function let's say let's let's have let's actually have the animal sound okay so and then obviously sure you're going to have an anymore and then you say it's a if it's of type animal okay so what you want to do is like you want to go through the the the parameter and start looping through the possibilities and then decide which which sound needs to be yelled okay so now what you're just gonna do here I'm just gonna take a simple anymore and then you see when I say animal I only see at the property kind kind is just the property which is you can see it's the share property between dog and cat right so if I had other properties that are shared between those types I will see them right no that's basically the union of both so here I can only check on the kind okay so that's so far it's something you should know right or you might have seen so now let me just say in case of now which case do we have the fact that we're checking on kind by just saying I'm putting that empty string it gives me the option to have and or a cat or a dog okay so I'm just gonna say a cat here and let's say this one just going to return let me put it this way the cat did the cat is so what does the car - right so it's here's the cat so we know that we're dealing with the cat at this stage so when I do this you can see that in that use case I only see I own see since I'm checking on the cat when I tap dot here I only see information about the cat so animal here is cat that's basically what we have okay so and I look and you can just say this is for the cat okay so that's one step and now if I say I want to deal with the case the dark is I would just take it here and then say like okay when it's a dog so once again I have the second option that's like a dog and then you say the dog and as you can see right where here you can see that now have an error already saying you're not in the in you're not in the dog in the cat scenario so that should be a dog here right so a dog what does the dog - so work okay sorry let's barking okay so this is our two two use cases so what I'm going to do I'm just going to gonna call that that function okay and I'm just going to pass a kind so and then you see that even when I'm typing the I'm calling the function I can see that he gives me those two options so I'm just gonna say cat and then and then I would just say here and what does a cat does well you you you know it so say my here so now as you can see well not when I run this code I'm just gonna run it here as you can see we have the cat is marrying okay it's it's pretty clear so far right so if there is any question please ask them right below in the intersection the comments section I'd be able to answer them or on this part or during the Q&A session right so we can see that with that function works so so far we're not doing something really special but we're missing on on the few things right the first thing is the fact that when we have we say animal that kind if you don't handle that use case here you see here there is no error there is nothing is happening right so this rule basically raised a concern because you're like okay this animal what the return of this function so far it's if I check the return here so we say it we call this thing and then he said you return a string but sometime it could be a cat or a dog and you don't know so that here that case is an handle so I'm gonna show you a few things that can make this code more robust by using typing in touch grip typing in touch screen there are times in time script okay never mind you you're getting this so how would you do that so the first thing here is basically to say I'm going to add a return a value here so I'm going to say this is a string right so that's that's the first thing I just add a type right so here is a string in return Ettore the second thing right I'm going inside my TS config and I'm going to change the strict null check and I'm going to put it on true right okay and then you will say now when I go back here you can see now just by turning the tears inside the chest config I turn this trick no to true now you can see that in my Kurt string here is complaining is basically saying this function lacks ending return statement and return does not include undefined yeah because if that case isn't handle the next one here would be return and define right so that's basically what you're saying it's gonna it's gonna just return something undefined but that's not what you want so maybe is what you will see here is I'm just gonna say this is undefined so you handling this that way but you're actually going around the problem you're going around the program by doing this so here is one of one of the good reasons to already put the strict nil a true right that's that's one one good reason so but strict now when you put strict no in your code it could become really really difficult for people that are not used to tie script okay so with the type system only I was able to detect that this is an issue so look let's go back here put it back and as you can see now the error is gone it is gone there are two things with it we just add a return value and we add the strychnos to true right here that's what we did okay and now when you see here in our playground we see that that the there is no more error right so now let's take let's take the [Music] I'd say that will be so let's let's take let's take a situation where for example we have we don't have the strict Neal right so let me put it back to force I was reading your question right there but I can see some people are answering questions so keep going it's really great so I'm going back here and then I put I put these like I'm removing this part okay so here is the thing you can see now even with the return value we removed a strict no and we still have or we don't see the error right so now what you could do that you could you you can actually I'm going to introduce you a concept call never write so never is a concept in touchscreen that just says well that will never happen that I think it's it's it's kind of a way of saying you will never go in there you know you will never go in that that space right that's basically the idea so the way you will do that you will create a function so let's create a function here and then we're gonna call that function fail okay so that function is gonna take an argument and that argument is gonna be like an ever argument okay and that function is going to return never right so what you do here that's a mirror I'm just gonna throw I'm just gonna throw an error a new error right and we don't there is no need to put anything here at this stage right I'm just creating that failed function right so now I have my fail function what's going to happen now the fact that I'm going to add a default case here and then I will say well there is the default just return that fail function but that failed function is gonna take the anymore so you see right away there is a problem you can read that it's there argument of type Doug is not assignable of parameter of type never right so what is basically happening right there is the fact that this function is helped to handle the fact that some time you add the parameter you're going to pass in there like what when all those cases are checked if one of the cases that comes from animal so that comes from here isn't handle right the fail will basically raise that error right so this without actually turning on the strict nor is a way for you to make sure that you have that function that will block the known handle cases right so you can go back here in in that scenario and then you put it back you see it's working okay so this is basically the way you will use yeah I'm talking here about discrimination discriminated unions in combination of strict no okay and I just introduced a concept of never type okay the never type so you can read more on the never type it's actually some amazing thing that you could use right there okay so very good so let's move on let's move on to our second example okay so let me remove this and we're going to move to the second one so second one I'm going to talk about index type and introduce the concept of generic right you know generics right so if you if you if you never if you never use generic please it just go ahead and learn a but check that it's it's an amazing tool that helps you write code a bit like quite quite quite it helps you write generic code that's basically what he does generic code and and you developer I know you you love writing things and make them generic so this is a very good opportunity to deal with us so let me let me show you something you have the fact that so we're talking about index type and I'm going to show you generics and key off so I have for example let me take a type so let's say let's say we're going to create an object company right and that object has a name packages obviously and then I found it yeah okay so say 2060 okay so that's that's basically an object okay so what I can do here I can say once I received that object and I want to create that's probably an object that you received from a back end somewhere but once you have it you want to create a dynamic type out of it like based on that so what you would see here is company so you should just say company and you will say okay I want to get the you want you want to get the property from that the company object so what I'm going to say here is I just want to take the key of company let me go back here say let's say type of company is good here but that's not what I want yeah okay so basically it gives me it gives me this this object right so when I say type of company because here I'm dealing with an object so I'm cannot use I cannot use key off right so and then when I I got this now I can say well okay I died I dynamically generated a company object so if I go here and I say let's say one of our partner let's say who can I so let's say for example hva okay so here's a company right I can say this one is a company and right inside I can say I want to have access to a so obviously here you need to add the name and add founded year so as you can see I don't know which year it was founded so now let's put some some somewhere in the interface so I just dynamically here what I did I dynamically created created a type that's what I did right so so far I'm not using type of right I'm not using type of it's just basically I'm not using key off right but look what you can do I can for example now say I have company so let me turn this entire thing okay so here I shown you how you can dynamically create we're gonna need that in a few minutes okay so let's let me go back here and then say I'm going to create a class and now we're gonna create we're gonna call that class so this is a string and this is founded and then you will say a number okay all right so we have both and now I can say for example I want to dynamically get the keys of that of that thing here so what you will say you say okay I want to I'm just gonna have a type that is that is based on that company here so I would say company property okay so what you do you just say key off and now I'm going to say key off company right company so look what is happening here it's important that you understand what is happening we're gonna see that on the for example but it's really important that you get what is happening here when I had when I had a property like company for example and I just add a name packages right so when I had this you can see that I was able to get ax to have access to all this property by just doing type company type alright okay I can just say as I say type of type of the company so I missed a bit here so so you see here below here it's an object so this is an object and here you have like we have a class so that's basically a blueprint but look at exactly what is happening here I say company so a bit of typo but that's not a big deal typo okay look why not over here you see it says company property is named or or found so you have that union of both that it basically generate that dynamically from this okay and when I go here you see that it basically took the shape of this right so type of was able to go and get the information of this object and then I can dynamically use that and it's the same thing with here I'm basically dynamically looking up the properties that are available here so I'm kind of looping so see this you see the result of that it's exactly the same one you say I in JavaScript yourself or let a key in keys for example and then or let's say for example here that loop here so let me call that yeah we had an object somewhere not never mind so think about this as an object we can dynamically add that here so we say name Chandan okay so this you see that syntax here what it's going to do it's gonna get all the keys and make those keys available you can store them right after that's exactly what that thing does okay so now keep that in mind and let's move on to the example I want to show you so I have a function here that function is called black and you might have know you might have used that somehow somewhere before okay so what we have this we're gonna have to plug what it does you give it an object and you're able to get the properties of that object so property name of that object and I think is an array so we don't really care here without at each stage I'm just gonna leave it like that for the moment and what you want to do is like that things to return you a property name and apply so that was something was went really fast you have property name and then okay I need to type it because it's it's it's gonna help me write faster yeah yeah yeah I use any I know I can see you there already saying any stop using Eddie slow down slow down I'm gonna fix it in a second I just need help a little bit here okay so now I have a map that's why I use any because I'm not giving your way I'm not giving away their the thing right away so now I have a map and I say for each key in that I just want to get the object key right yeah yeah yeah I see you turned on saying five euros I'm gonna pay those five euros no worries I'm gonna get rid of them in a few seconds yeah anti cages we have a rule that says if you use any you gotta pay five euros for those any but sometimes you need them so that's why we give you credit that you can use them okay so now I have a simple function here so now let me use that function I'm just gonna call that plug and I'm going to pass something like name here and say Davi and then company say Hika juice okay so I don't know what happened with the company here but so as you can see here let me make sure that I'm passing the right argument so yeah those so that's the first one so give me a second we're fixing it and then an array that says okay I want to get out of that object yeah I want to I want to get the same thing by just saying and give me the the name okay so if I go here you can see that it returns me that that that are right here so let me remove that me putting a little bit outside so you can see what is happening here okay so that that basically work right so yeah indeed any comes Andy in sometimes believe me a mattress that's that's completely true I used that but you still pay five years for that it's it's okay so now let's go back and and make it work and so for example what I want to show you here is when I say that I can take the name you see it's return that the name right there see if I say I want a company it gives me the thing right so so but if I give a value that doesn't exist I don't have an error I have nothing right now let's use typing and generics and key off to make that happen okay so um the the way the way you go about it use you for example say you have object here you want to make sure that okay let's let's let's think about it for a second so what you have is is the fact that object will be used here as something right that has keys and stuff like that so instead of any right you can say this thing is is a key as a key and that that key is a string string here let me stay here so so that's a string and then it's going to return any because that you don't know and and that's basically okay let me remove this for a second so we can can come back to it a bit later or I can put it a bit up there so it doesn't yes very good so let me go back here so what we have well okay I just broke the internet with this okay so what we have here I just said this is a set of keys right so that that's one way of approaching it and then I would say what is any here what what is it what what could be those property well I think the property name are mostly string right so it's it's it's kind of thing but that doesn't change anything we're just typing the stuff now let me leverage generics okay so the way you will do that you will say here like okay I have I'm gonna have a tea which gonna be the type of my object right and then smart work and then you gonna churn instead of object here I will say this is tea okay so now you can already see we have a small problem here but we're not done we just transforming the entire thing so now I'm going to have another property here that is key and sorry Kay that's K here what do you think cash will go okay should probably be the it's a case that it's the property name it's basically what you use on the property now so K is the thing you use right here instead of string right so you're basically saying T is the object K is the list of property so the type a within that which we kind of know it's cut up your string you know but um we get a simple error here that now says type K cannot use the can count cannot be used in NXT so there is literally something we can do there to fix that so someone is asking any bad about No yeah the thing is like okay I can answer that question right after so keep that and dead okay quickly here is the fact that you're trying to get a property inside our object but that thing doesn't exist so that your intention is to get that property but you don't get it you you by putting the thing there you can also say okay I just wanted to see if the property exists in the thing and that's a way one way of saying that but you can also make sure that okay I want to make sure that that function always returned me or check on the fact that that property is in there okay so the way you do that here is okay that's a property and now what you got you're gonna you're gonna do is to say T is objectives of type T and then property name is of type K array of K and then you see here we have this small thing type K cannot be used to to end X type T what do you think is the link between T and K okay we have a small delay so I'm gonna wait for for you so there is a link between T and K so if you see this is D and this is K so there is a link between those two so I'm gonna give you that because we're good we're running almost out of time so the link here is the fact that K here is a set of keys from the type T right so what you could say here is K is K extend right so you're saying it's extend key off T right so what I just did right here you can see right away that now we have an error that says know the type cannot be anything but name or company right so do you see what just happened I just said key extend this it's it's a set of key of that okay so what basically this says it says then key technically behind-the-scene what is happening it says key k here is K here is of type yeah what you basically saying in our case it's gonna be either Devi or company but if you remember what we saw with the Union before at the beginning it's gonna check on them so that's where you actually leverage what we saw like a discriminant indiscriminate unions it's basically saying none of these much none of this much the thing you're looking for right that's that's that's the thing so here you're basically using that's it's called index types and you're using generics and key off to actually make your code safer or like stricter in term of making making sure that you're not gonna just have a bug in production for for something not intended okay so here we kind of not done entirely I just want to make sure that you understand that what is the return type here what will be the return type for you okay giving that away so we could have an array and that array is like this okay I said now here I can change that and say okay I want Devi I want you to name and then you see the name is coming okay so now let me quickly so I was on number two number three here okay so now let me go quickly on number three so we talked about index type generics and key off so let me show you how you can use map type and the idea of type programming level so type level programming so what I'm trying to say there is the fact that when you when you're writing code like I shown you before like this code is you know object per you're basically programming that's programming which with the object and stuff like that here I'm programming with type right as I said this one is going to loop through the things so here when you say kick okay extend a key off T you basically looping through each property inside the T type and then create a type out of it it is really important to understand that okay so let me move on quickly here and then we if you have any question I take I take them as we go okay this is really good so now we got oh it's people doing Aram Dodgers here it's really nice so yeah you can use that to leverage to make your code much much easier and for people doing like really using touchscreen this is really powerful okay so now let me go I'm gonna go to this one kurse we almost out of time and I'm gonna make sure that we go quickly on this one although it's not that simple so what we have here I'm gonna take I'm gonna take some example so it's gonna be easier for you so I have an interface that interface has two property a title and an author right so then you cannot create you cannot create an object out of that right so what i'm doing here I'm just saying okay I have a course and I'm creating a course okay I do inside script concept and your tourists me okay so now that that's that's that's basically a simple example so here's my question how can you you I'm talking with you and how can you freeze or turn or properties of these objects into rent read-only property so that's basically the point here right we're talking about the map types right so that's what we're talking about okay so um so yeah I guess people if you use elm and you try to compare with Ty script there's well it's it's it's it's on another level okay so but in touch people already have things that can make your code way much easier so let me quickly make that happen here so how can you do that so you have many ways to go what you can say object dot freeze right and you can pass courses all right so look what is happening here before I even do that what I'm trying to do is to say okay I have a course and then there is a title and I want that title to become typescript or TS advanced yes right so okay so if someone sees this and they won't be able to know exactly what is what is happening there right so there was like what is advanced yes unless you know that's it start script so I don't want these to happen I don't want someone to go and change that so if I do this okay I need to move it just a little bit here by using object freeze I'm basically saying okay I want to freeze that that thing so these things going to return me a freeze object of freeze courses right all right now I have this so if I do if I do freeze courses what and I tried to access the title and then say for example let's add something here you can see that freeze doesn't let me do that so what basically happened behind the scene look at this it just says freeze has been turned into a read-only property so then you cannot change this anymore you can't change that but what you actually did here you get you you use JavaScript there is no tab script related thing here you just used JavaScript right but I had to I had to over this thing to see that that's a read-only property that's a read-only object object indeed so so you can use free so that's that's one way of doing it so now let me show you another way of doing it so a second way you can actually manually go and then say okay let me take that interface and let me add read-only everywhere so read-only and then as you can see by adding read-only here it's already freezing here so the problem now is like I'm actually activating existing code instead of making sure that I can actually still use that and I emitted an avoider mutation of the team by creating another variable as we did right here okay so and then the other problem is guess what now you want all of this to be read-only so what are you going to do so you're going to basically add if you have an interface that has 20 property are you just gonna type read-only no you're not gonna do that so what you going to do if you're using tab script you can use type level programming to do that to automate that right so here's the way you would do this so let me remove that read-only here we don't need that and we don't need this one as well okay so what I'm going to do here is basically approaching it differently so the way you do that you cannot say okay I'm going to freeze that course okay I'm going to freeze new instances and then people can actually use and of antifreeze freeze the one and the other one so the way you will do that you're just going to say okay let me create how would you say that how would you call that let me call an interface here and then I'm just gonna call that freeze okay and I'm going to freeze so what what do you have in freeze so you're going to have something of type T so now what I want to do is just to to rewrite this thing to basically use to compute two entirely freeze that okay so and let me use the type it's I like type for these kind of things that they're much easier to use in that case okay so what am I going what am I doing here I'm just saying that for each property I'm gonna take each property in key off so I'm gonna take each property in T right and I'm just gonna make them read-only so now I have one step so one step is basically take each property so it's at a loop you should see that as a loop it's really important to understand that I'm looking through each key which means that what I'm going to use freeze I'm going to use that with courses for example that here I'm actually taking all the keys here and I'm transforming them the transpiration hasn't happened at this stage I'm just taking them or listing them and now I can just put here this as read-only right so by doing so now I just turn anything that goes in here into a read-only property here so now I can now say I have my my this this part so let me just copy this and we're going to create we're going to create something that looks like this okay then we're going going to pass courses here so what did I just do I took I took this thing and I said well I'm going to turn that into a freeze course and I'm gonna freeze everything inside and then pass this but by passing this I guarantee you that if you go here and then you say freeze courses and you're gonna do try to do title and then you say here I want to change that it's this one that I want right you can see that it's not okay with that cannot assign to title because it's a read-only property right so if you go here you see has been freezed right yes Oh each property in there has been turned into a read-only property so those are the things you can do and as you can see if you're using Thai Street a script 3.8 I think you would pretty can probably earlier than that this thing is already it does exist not natively in touch grip it's called read-only right so yep they made that available for you already in there so you can use that to make your code to safely create read only properties or read-only classes right okay so that is one thing I'm almost done but stay with me for a few more minutes I mean five minutes and then we can jump on the question but please keep asking questions so now if we go let's let's take another example here I have an interface so let me come on top this right so I have an interface mentor right and I say this thing is read-only and I want for example that what I'm trying to do here I'm gonna give you a quick scenario what I'm trying to do here is deep and read-only oh this is fantastic I like the question so I'm gonna show you something that can get to help you do this exactly so you can you can do that you can basically say and for each property that URIs you have inside your so you Rick you just Rick Rick Rick rusev Lee called read only inside your class right so but but let me show you that which with this example so the purge here is how can I write how can I actually go the other way around right yeah this is exactly that Victor that's exactly so you say deeper yeah I'm gonna I can show you that I'm just gonna copy it from here and you will see that an example right here and cuz I'm about to show you also how you will you will use it but we can we can talk about it in in a few minutes so stay with me and we almost done so I have this and I just want to reverse the entire thing right or you take an object that has been freezed and you want to reverse you want to reverse the entire thing so read-only okay so look yeah okay keep that question matches okay I will answer that in a few minutes okay so what is happening here is I just want to reverse that so I have this which is entirely read-only and I want you to reverse that so what you cannot do sure and then say okay I'm gonna write a type and what do you think that that's going to do this is a little bit more trickier I mean it's it's it's not that difficult but it's gonna require you to actually go a little bit to think about type a little bit differently right so I'm gonna create and something that you can write so a right table property right so what you do here and you just say okay I'm going to take what are we trying to do we try to turn everything that is read-only into writer boating okay so the the way you would you approach that you will say you have you you want that thing to be read-only so therefore I'm gonna need your generic so I'm gonna need a property T generic team right and T is going to be a list of IQ k you can think of it like okay I have a property dear then I will take for each P in ceramic right at this way P in T of T you will sell for example you want t let me put it this way right so I just took something that is writable and I I just add that something that is read-only and I'm turning that into a non-tree donating so what do you think is happening here question what do you think is happening here right so for example now if I take writable course and I'm going to say this thing is writable and we're going to take our right table mentor yeah pretty close pretty close so we're going to say this one is from mentor okay so what I'm going to do there I'm just gonna get a mentor and put it right here right so here when I look at this is just say well it's a writable mentor but how about if I say writable mentor dodged courses and I try to change the value I still have the fact that it still read-only okay well we're almost there I just want you to see what is happening here right and and understand a little bit this is not trivial even for lunch it's it is not trivial okay so what do you think is happening here so it still still it's it's not working okay so let me let me explain quickly how you will do that here so I'm gonna keep I'm gonna keep that writable and what I want to do is to say like T which is the type that I'm going to receive here is going to extend that kind object is going to extend an object so just can I say like this can extend an object and what you get there what is an object you get a key string and then you said but I don't know what is the the value that's going to be there right so that is one step so basically you're saying that on the left you're going to have T as a as a thing and then you have a K which is basically an extension what's going to be K here in our in our case you have the fact that okay okay here it's I'm gonna extract it and explain it quickly right because we're running out of time so what is happening here you say I'm not saying key in key off anymore I'm just saying P is in key in K here right and then here I have something that says the the relation between T and and P is basically the fact that each property that's going to come from be here it's gonna be the key for T and T is that the class that we're going to receive so here the way I will say that I would say okay I have a mentor and I have all the keys of mentor okay so what I just what I just did right there I just say like okay writable it's gonna be you get a right over here and then you get the fact that I'm gonna pass a mentor and then the key of mentor so what do each era do we have is not a several tough courses yeah indeed now indeed 1/2 something what is what is courses by the way we have course this year which is something different so I need to create I need to create the new course this year and then say this is courses for example so as you can see here and then I go right table mentor and I can look up that and you can see that it has been changed so let me explain what is happening here once again that's not trivial it is not trivial but stay with me so what is happening here is the fact that I'm saying and you can see the way I'm writing it right here I'm saying that T extend an object right that has keys and you don't know the values right it's gonna be any right and then okay extend string so K what is K once again is just the leaf stuff of values that that that's our insider that object right and then you get you get you're able to have that right so no you're not gonna write that this way you're not gonna write that this way because typescript indeed made that available for you for free so let's say I'm just gonna rewrite that and then put it right here so you can have an example of the different ways of writing it so what you going to say there is just I want everything here to be so you go back and then you say you want to get in key off yeah and then you say I want to read so C and Peter there here is the link between the two so now you just copy the entire thing here you just copy that it's just a simple copy and then here you just say I want it to be read-only there you go so and now here I'm just gonna fix it because we don't need this anymore and there you go so that's the way you will be able to just reverse that right and and by using that read only you see here I'm just using that syntax here so how do you feel about this so far I just want to get to feeling of okay you you're getting there you it's magic I love it but it's not magic actually so how do you feel people you know I can go for hours but you have you have to go back to you have to go back to work right so so so I shown you like you have this example that basically explain how you will think about type and and then here's types creep is making it super easy for you to do the thing so that example when I show that to developer during our training they always go like what did what is that and I feel like they've been doing touch script for a long time and then they see that they're like okay I have to go back I have to go back to to to learn typescript yeah so there are many many map types that you you you you have so you can use like there's pick that is one of the thing okay let me actually get that I'm gonna show you the example here so let me let me get that for you so there are many many of them right so let me just get peak here yeah so you have you have a few of them let me just switch my view so you should be able to see my my screen right below right so there are many of them you're gonna have you have pick that is one of them you have record yeah I mean just go ahead and play with them like they are I think you also have you have like read-only for example you have no yeah yeah indeed it's called read-only I guess yeah you have a way to basically so read-only is here that is the partial one which is also pretty powerful partial is really really powerful yeah you can you can go ahead and play with that but indeed the tie script type script can make your life either super complicated or really enjoyable and I prefer the enjoyable part so tell me what is a click on click on read on vs yeah tank Mike this is Michael that that's really good because you can actually access it directly here so if you go and read only you can you can access or look at this look at this this is super cool because you have record as crude extract omit no nullabor yeah there are many of them right and fundamentally if you able to understand what we just did right here you you yeah you're gonna make a leap in touch script so really good people so if you have any questions I can answer them maybe we still had a question here but the demo is done so look I had more stuff to show I have more stuff to show but I think I'm just gonna reorganize a second a second part and you will see it on our YouTube so subscribe on our YouTube channel you're gonna have a lot of awesome stuff coming your way in the coming days and I'm gonna redo this video to explain a little bit better like shooting it and making sure that you understand what is happening there and if you if you know the team's gonna send you a survey and it's interesting for us to actually know what how you find how you found this decision was it too hard for you just give us which background you have so we can also add just decision by saying like okay this is advanced that's already what we're doing this is entry level this isn't another level so it's important that you mentioned that in the yeah so okay someone said I wanted to leave a feedback on the type form but the mandatory email field deter me for doing so okay yeah that's something we can fix actually so yeah subscribe our YouTube channel we really have awesome stuff coming your way in the coming in a coming days so yeah that was cool questions I take I take out a tank thank you I you called JavaScript feet I love it yeah I I I take yeah it was good thanks Jordan so I think someone had a question that I didn't answer oh yeah oh by the way yeah okay if you're leaving the stream it's not a big deal it is not a big deal but maybe I can show you ah no okay I'm gonna show you I'm gonna I'm gonna send I'm gonna make a video available how you can make this thing writable recursively so you can go deeper and deeper and deeper it's it's it basically used the same the thing Victoire here ROG yeah so you can use something pretty close to to that and then we say a writer board and then yeah actually I'm already there so you can make the right table part my my idea is quite slow and then you can make distinct right table as well if I'm not writable yes yeah that'd be the trick here you can you can still do that and that's gonna make sure that you go you go deeper and deeper like recursively yeah so okay thanks Alex avianna if that but we should then prefer and no any yeah so no nostalgia okay you actor know how to pronounce that but no don't use like no that's the point you want to make your code safer you want to make your code easy for your team to understand what is happening right here so yes that it's important to actually give that yeah to use it to to narrow down the kind of type you want to take from it okay I'm still scrolling just to see if anyone had a question that I didn't I didn't miss tank Shannon yeah so you can still ask question if people are living that's okay I'm still around so feel free to ask your question and I can always jump on the code only if you hopefully that was clear for you so if you have any question don't hesitate okay okay we didn't have yeah okay great people that was great okay yeah okay so check sorry oh I will see you in Brussels yeah yeah I'm still amis home I mean the little Ivies home yeah Amsterdam dan ha I don't know it's it's just it's here but uh I'd be in Belgium more often as well so thanks Laura yeah enjoy your lunch okay yeah it's it's a it's important to you strong strong strong typing a la nostalgia is good okay people thanks again for everything and you rock all of you you rock yeah okay darío I will I would put you in touch with with my team the team in Brussels so that we can organize that anytime and yeah I don't know if you want to do that live or if you want to to do that like what one when this situation as yeah past we can do that right after so yeah Thank You Stephen I was good thanks Dario okay people thanks for joining and keep going keep keep going yeah Dario I will I will take you I will send you a message of line so we can get that rolling thanks key yeah great people so yeah that was advanced I scraped number one and just if you if you if you in if you're in Belgium you have the JavaScript lab Belgium meter group that you should subscribe to that's where also you can also find things there if you're in Amsterdam JavaScript lab I mean in your country or in your theory just go on JavaScript lab on meetup you might find already we might be there already and doing some awesome stuff for the community so yeah very good okay people bye you

Channel: Hackages Learning

Views: 3,065

Rating: 4.8125 out of 5

Keywords:

Id: SYA_Q4hxujE

Length: 64min 52sec (3892 seconds)

Published: Tue Apr 28 2020