JavaScript Async / Await with project.

hello everybody i am khanam and in this tutorial we will learn about async await okay we will understand what is this and why these are useful okay before learning async of it you have to know the basics of promises and also you have to know how to fetch the data from api okay these two topics i have already uploaded this videos in my channel if you want you can refer that one and you can study about async of it okay if you know the basics of promises and how to fetch the data from the api then it becomes easy to understand now in this using async await we are going to fetch github users data and we are going to make a project on this you can see here i am fetching this data from the github okay this using this api i will be fetching this data if i just inspect this one you can see here it's responsive and in my console if i show you i'm getting this response and also i'm getting this array okay now we are going to make this project and we will understand why async and away is useful and also you have to know promises and how to fetch the data if you don't know how to fetch the data i will be explaining you in this tutorial but you have to know at least the basics of promises to understand why we are using async and await now you can see here i have this definition why we are using async and it is it is a special syntax to work with promises in more comfortable way which is called as async and await okay it is very easy to understand the concept once you know the promises then async can have it is very very useful and it is very easy to understand okay now let's get started into the code i'll just open my vs code editor now inside this if i show you i have this index.html file and inside this i have changed my title i have one h1 tag and here i have one diff container which is having the ids root as of now i'll just remove this one and here you can see i have linked my javascript file here now if i open my project you can see this is my project where i have this heading here okay this one async await this heading whatever i have written and here i have just given inline styling okay in this okay in this file we are just going to understand the concept of async and avid and later on we will be doing the project on this now i have just opened my console here now you can see we are going to work on this i will just come to script.js and inside this i have written some basic definitions okay so that it will be useful first we are going to write normal function i'll just write one function here i'll be giving function name as my function okay so that we can get to know where we have to put that async and avail keywords now this function will return i'll just give here console console.log and i just want to print some data i'll just come to index.html i'll copy this text from here and here i'll be pasting that one i'll save this now if i refresh my browser now if i just refresh this one and now if i show you i don't have anything okay i'll just adjust this one now i'll just bring on my right side now if you see here i don't have anything in my console okay because i have not called the function it i'll be calling the function here i'll save this now if i refresh my project you can see in my console i'm having this async and avid as my output this is the normal function we were using now after es6 we are using arrow function that is fat arrow function instead of this you just have to replace like that okay now we are not going to see fat arrow function okay this is the normal function and we used to call this function to execute whatever output we are having inside this function okay now using async and avid we are going to define the function okay you can see here i have this definition for async function async keyword it must be placed before a function which means that i'll copy this entire function from here and here i'll be pasting that one i'll just uncomment this entire thing now you can see here async keyword it must be placed before a function now this is my function and this keyword should be placed before my function here okay this keyword should be placed before my function and if you see here the word async before a function means only one simple thing a function always returns a promise okay this entire thing it is going to return a promise and promise is nothing but either you are going to resolve the promise or you are not going to resolve the promise which means that you will fulfill the promise or you are not fulfilling the promise if you fulfill the promise we have resolved function if you don't fulfill the promise we have reject function okay once we fulfill the promise to display the data offer promise we have then method for our results and to display some error we have cash method for a reject okay this is how promise works okay this simply means that it is going to return a promise which means that either it will be fulfilled or it will not be fulfilled either it will be solved or it will be rejected now whatever data whatever output you are getting inside this function that will be wrapped in a resolved promise automatically which means that it is just assuming that it will resolve the promise which means that you are fulfilling the promise and it will wrap all the data inside that resolves method okay now we are having this function and this function is nothing but this function is returning our promise i'll just save this one now now if i refresh this you can see i'm having the same output now then what is the difference between our normal function and this async await function okay the difference is this function is returning us the value here okay this whatever i am getting this is the value it is returning but this is returning a promise we have already seen in our promise video that if the function if the function is resolved that means we are fulfill the promise to display the data of a result we have then method so instead of this instead of this returning the value i'll just create one variable here and i'll give my variable name as sentence you can give any name here okay i'll be writing here promise promise is resolved i'll change the spelling promise is resolved inside this function i'm just returning the promise here i have just created one variable and this is the promise in resolved state you can see my promise will be in resolved state so i am just assuming that i have fulfilled the promise now to call the resolve function we have this then to display the data of a result we have then met it and inside this i'll just pass this alert i'll save this now if i refresh this one you can see in my alert i am getting this this page says undefined because i'm not returning anything here i'll just return here return and i'll just return this sentence i'll save this now if i refresh this one you can see i'm getting this promise is resolved okay whatever text i am passing here i'm just storing that inside the sentence variable and i'm just returning that one now here i'm when i when i'm calling this function i'm just returning this then which means that my promise is resolved and inside then i'm passing this alert okay in this alert all the data whatever i am having here that will be stored now instead of this if i just write here console console.log now inside console.log all the data will be stored and in my console i'll be getting the output i'll just refresh this one now you can see i'll be getting the output in my console okay this this then method is used to get the data of my resolve method and that will be printed okay this is the basic difference between our normal function and our async function we have seen that it will return a promise and all the values will be wrapped in resolve promise automatically now instead of writing this one okay instead of writing this we could explicitly return a promise which would be the same okay we will be getting the same output but we can explicitly return the promise now we will see how to do that one okay before my function i just have to write this async keyword and here i'll be defining my function i give my function name as my function you can give any name here inside this function directly i'll be returning promise so i'll just write here promise and all the functions and all the output will be wrapped inside resolve so i'll be using this resolve inside this i'll just pass this text here whatever i'm having here i'll just copy this one and here i'll be pasting that one okay this is the same way we are just modifying this one instead of writing this i am just returning the promise and inside resolve i am passing this data now to print this data we have to write this one we have to call this function and using then method whatever data i am having inside this result that will be printed in my console i will just comment this now i save this now i have this output i'll just refresh this one you can see i'll be getting the same thing promises resolved okay okay either you can write like this or you can write like this but this is more specific because we will understand this using this async function we are returning our promise and using this then method we are printing the data of a resolve okay this is how we are going to write i would suggest to use this one i'll just give here um vvv so that we can get to know whether we are getting the output or not now you can see i'll be getting the output okay i'll just save this now i'll just comment this now we have this await keyword now we will see what is this await keyword and where it is useful and where we have to use this one okay you can see here it works only inside this async functions okay which means that it is not going to work inside my normal function if i use inside my normal function i will be getting an error it should be worked only inside async functions and it will tell we have to wait until we resolve a promise we have already seen that async function is going to return a promise and this await keyword will tell us until you fetch the data if you are trying to fetch the data from the api if it is taking some time to display the data it will tell this await keyword will tell us to wait okay until the promise is resolved until you get the output this will wait and the promise will be resolved and the data will be displayed to you okay now i have written here we can't use this await functions inside a regular functions or as we will be getting an error now here we will see an example of await i'll just define my function i'll be writing this async keyword and here i'll be writing this function you can use arrow function as well i'll give my function name as my function inside this function i'll be creating new promise i'll just create one variable i'll give my variable name as promise inside this i'll just create new promise here new promise and this promise will be having one executable function and inside this function we have two arguments that is a result and reject okay we have already seen this completely about promises in our tutorial in our previous tutorial okay promises will be having this executable function this executable function will take two arguments resolve and reject resolve is when you fulfill the promise and reject this when you don't fulfill the promise to display the data of resolve we have then method and to display the data of reject we have catch method now inside this function i'll be giving this set time out and here i'll just okay i have got the syntax here and here i i'm using this fat arrow function okay you can give your function name as well and here i'll just set the time as 2000 which means that two seconds after two seconds i want to display the data i'm just setting the time i'm just telling this one after two seconds whatever function i am having just display the data here inside this function i just want to display this resolve resolve and inside this i'll be passing some text i'll be writing this i am async and await keyword i'll just write this one now inside the set timeout interval i'm just passing this result which means that i am fulfilling the promise and here i am get i'm just passing this text after two seconds now to display this resolved data we have to use then method only then our output will be displayed so before that we have to use this await keyword now inside this function okay once i come outside the set time out now here i'll be using this await keyword i'll just give one variable i'll just create one variable now inside this variable i'll be passing this away keyword i'm just telling that i have to wait for two seconds so i'm just passing this one here and this one whatever you have created whatever variable you are having just pass this one here okay i am just creating the new promise here inside promise i am having this executable function this function will be having two arguments resolve and reject now inside this function i am just setting the time out after two seconds i want to display this data okay now once i come out of the set timeout function i am having this i'm just creating one variable result and inside this i'm just passing this away keyword which means that i'm telling that you have to wait until my promise has been resolved okay now it is going to wait this promise is having this data it will wait now i'll just come here i'll do console.log console.log and all the data will be stored inside this variable i'll be passing this one here i'll just copy this one i'll be pasting it here and here i'm just calling the function now i'll just refresh this now you can see after two seconds whatever value i have passed inside my resolve that i'll be getting here okay i am i think an await keyword okay i'll just explain you i'm calling this function here this will go here this will see this is async and this function is going to return promise here i am just creating new promise and inside this promise i am just passing this two arguments resolve and reject now inside this function i am just setting the set time out and here i am telling after 2000 after two seconds just print me this data okay resolve data which means that i am not having any error and my promise has been fulfilled now here i am just creating one variable and inside this i am passing this away keyword which is telling that until my promise is resolved you have to wait okay once my data once i get all the data i'm just storing that inside my result variable and in my console i'm just printing this data whatever i'm having here that i am printing okay this is how we are going to use a weight keyword inside our functions now we will see what happens if we use await keyword in normal function i'll just copy this entire thing i'll just comment this one and here i'll be pasting that one normal function is we don't have to write this async keyword now this will be my normal function inside this i'm just creating new promise and here i have passed this resolve and is passing the same thing result now i'm just using this await in my normal function i'll save this now if i refresh this one you can see i'll be getting an error a weight is only valid in async functions and the top level bodies of modules okay we can't use await in normal functions it will be valid only inside async functions if i use this async keyword here if i just copy this one and if i paste it here now you can see by seeing this you can tell that this is my async function and now inside this async function i can use this avoid now if i refresh this one after two seconds i will be getting the output without getting any error you can see this is how await is useful i'll just remove this keyword i'll be commenting this one now now next we have reading api data now we will see how to read the api data using this await and async okay i'll just declare function i'll just use this async i'll be writing this function i'll give my function name as my function i'm writing it again and again because so that it can go so that we get practice now inside this i'll just create one variable i'll give my variable name as response okay here is equal to i'll give this away and i'm just fetching the api data and inside this i'll just come to browser and you can search for here i'm having this github users previously we have seen fake store api i'll just take that one fake store api or instead of that i'll just write here fake api i'll be right i'll just write fake api and here you will be having this json placeholder click on this and here inside this you will be having the link okay this link copy this link i'll copy this one and here i'll be pasting that link if i enter you can see i am having only one data i'll just remove this keyword id from here one i'll refresh this now you can see i'm having this api data now i want to read this data using async and avid i'll just copy this copy this api i'll be pasting it here okay now using i'm just telling that wait till i fetch this data and then display now i'll just copy this one now if i just do console console.log i'll just paste that one call the function here i'll copy this one and here i'll be pasting that one i'll save this now if i refresh this one you can see here i'll be getting the response and inside this response i'm having this data status body everything will be having and this is my url now to access this to get this data now you can see here this data is in json format okay because my name field is also enclosed in double quotes which means that this data is in json format so now i have to convert into object format i'll just create one variable i'll give my variable name as user object i i'll be giving user data inside this this response is having all my data i'll paste that one and now i want to convert into object format so for this also i have to pass await okay because i'm converting this only this data i'll be writing this away keyword here i'll save this i'll just do console console.log and inside this i'll be passing this user data which has been converted to object now i'll save this now if i just come here now if i refresh this one you can see i'll be getting 200 array of objects okay 200 the length is 200 and i am having this array of objects inside this api okay this is how we are going to access the data we are going to read the api data we are just going to write this async function function name and inside this you can give any variable name here you have to write this await keyword and using this fetch method you have to access this api link you just have to paste the api link whichever link you are having and if you do console.response this will be the data in json format you have to convert this data into object format so to convert this data into object format we have this json method and this is the function okay this whatever data we are getting we are converting into object formats so until it get converts we have to wait so we are using this await keyword here and i am storing all this data inside this variable now if i do console.log i'll be getting all the data here inside my console whatever data i'm having here this complete 200 200 ids i'll be getting the data inside my console okay this is how we are going to read api data okay you can read any api data using only so much of lines okay if you remove this console and if you just remove this console and save this you will not be having any output but you can print this data inside our browser as well you can just give id to one variable and you can print this data now we are going to see how to print the data in our project but this is how we are going to read the data i will just comment this entire thing now next we have our project reading github uses data now we have here project before that i'll we have all we have only seen about resolve okay we have only seen about result we are just assuming that our promise is fulfilled and we are displaying the data now we will see if we get error when fetching the data how to handle that one okay okay i'll just create normal function okay you can just implement this one using await and async i'll just create normal function i'll give my function name as load data inside this i'll be passing one argument i'll just give here url now inside this function i'll be returning this i'll just return i want to fetch i'll be writing this fetch method and inside this i'll be passing this url i'll be giving the url whenever i'm calling the function now here this fetch method i'm just assuming that it is it has been resolved so i'll be using this then method and whatever data i'm having that response whatever response i'll be getting that i have to convert into json format okay before that i'll just check some conditions here if whatever response i'm having this response i'll just paste that one here okay this this is how we are going to check in real life example as well if my response status if my response status if the status if it is equal to equal to 200 which means that i got my data successfully if it is 200 then i want to return this response whatever response i am having i'll just paste it here and i'll be converting into object okay we have already seen that whatever data we are getting from the api that will be in json format we have to convert into object format so we are using this one okay here i'm just fetching the url that is my api and here inside then which means that my api is been resolved i got the output so i'm printing using then inside this then i'm just checking this condition in my response if my response status if it is equal to 200 i am just converting it into object else if it is not equal to 200 i will just throw an error throw and using this new keyword i will be throwing an error okay you don't you don't have to worry about this here i'll be throwing an error i'll just copy this response i'll be pasting it here and whatever status whatever status code i am having i just want to print that one i'll save this before calling this function i'll just come to my previous project here i'll just come uncomment this one i'll just uncomment this now if i show you the output you can see here inside this inside the status i'm having here 200 which means that i am getting the data successfully here so here i am just taking the condition if my status is 200 only then you convert this data whatever i am having convert into object like this object if you if i'm if i'm not having this status as 200 just show me this response dot status here i am having this response okay this is my response response dot status okay i'll be getting the output here whatever status i'm having now i'll just comment this one i'll just uncomment this entire thing i'm just call i'm just writing one function now inside this function i'm fetching the api url i'm assuming that i have result and here i'm just checking the condition if my response status if it is equal to 200 then convert the data into object format else throw an error and just show me the status of this whatever error i am having if i am having 404 i'll be getting this page not found error recalling this function i'll just copy this one here i'll be pasting that one and instead of this url i'll just pass some random api random link i'll just write here fake api json fake api um i'll just write some data here fake api fetching data dot json okay assume that this is my api i'll just write here fetching now here if i get an error i have to handle this using catch and here i'll just give her alert i'll save this i'll refresh this one now you can see in my alert i'm getting the error type error failed to fetch this is i can't access this data and it is telling me that it is type it and i can't fetch this data okay this is how i'll be getting an error now instead of this api if i give my api this one which is having the data i'll copy this one and here i'll be pasting that one i'll save this now if i refresh this one you can see i don't have any error and also my output is not getting displayed because i have not consult anything but i do not have any error which means that okay it is successfully accessed this api okay now i will be getting this response is equal to 200. now instead of this um here i'll just do console console.log i'll just do here response i'll save this i'll just come here now if i refresh this one you can see i'll be getting this response okay without getting any error i got the output when you are working in bigger projects then you have to write like this and you have to check the status and you have to display the data if your status is 200 only then you have to display the data or else you just have to throw an error okay you have to handle this one using catch and you have to throw this error okay this is the simple example i have you can just write here async and you can just write here await now i'll just comment this one now next we will be working in our project okay this is the project we are going to make using async and avid and how to fetch the api and how to fetch this github users i will just inspect this one now you can see i have this output here i am just fetching this data now if i just come to my folder i have already written the code i'll just come here i'll just comment this one because i'm getting error i'll just refresh this now you can see i have all the data i have response i have this data i'm just displaying in my browser here okay now we will see how to display this one using this github api link github users api link this link will be having some restrictions okay it just tells within one hour we can i exactly i don't know how many times we can use but we can if we reach the limit the data will not be displayed and we will get an error so you have to be very specific okay don't refresh it again and again don't refresh your page again and again just write the code and later on finally you just refresh it and after one hour you can use this again okay now we will see how to create this one how to create this project now here i'll just create one folder now inside this i'll be creating one folder i'll give my folder name as async async await now inside this folder i'll be creating one file i'll give my file name as index.html and also i'll be giving the style.css style.css and here i'll just i'll be giving i'll create one more file i'll give my file name as script.js now inside index.html i'll just come to my project.html i'll just copy this entire thing from here i'll explain you this one i'll paste it here now i have just i have just written this basic boilerplate of html and inside this i have changed inside this i have changed my title i have linked my css file here and also inside my body i have this async avid fetching github uses text and here inside container i have just created one diff which is having this container and ib is equal to root here inside this container i'll just create one diff i'll give the class name as cards and inside this cards first i'll be giving this image and inside this image link i'll just come to i'll just search for pixels.com and inside this link okay you will be getting all the images which are completely free to use i'll just search for nature i'll just copy this link and here i'll be pasting that link below this image i'll just write one h1 and for this i'll just write h1 heading and i'll be writing here username i'll save this i'll just copy this path i'll be closing this one now and here i'll just paste the path now you can see i have this heading i have this image and i have this username okay now we are going to style in this way i'll just copy this cards and here i'll be pasting that one three four times i'll be pasting that one i'll save this now if i refresh this one you can see i'm having this output here now i'm not going to style this one i'll just do control b i have already styled this one i'll just copy this entire thing and inside my style.css i'll be pasting that one okay i'll just explain what i have done here now inside index.html i have given the class name as title for my this heading so for this i'm just giving this text align to be center and for this container which is having all my cards you can see all my cards are wrapped inside this container and for this container i'm just giving display to be flex so that it will come in horizontal row just if i contain space around and flex wrap to be wrapped in my small screen devices it should be wrapped now for my cards for this cards okay this entire cards for this also i'm just giving display to be flex justify contains space between a line item center so that my image and my text will come in horizontal row i'm just giving padding i'm just doing the normal styling so i have just returned this one and for my image i am giving the width as 30 percentage object fit to be contained so that my image will not be squeezed in my smaller screen devices and i'm just changing the h1 font size i'm just decreasing this one i'm giving the width to my h1 i am just given padding right here i have just written this basic media query so that it will be responsive in my smaller screen devices like this all will come on top of each other so i am just i have just written this one okay the basic coding of css okay so i'm just not saying if you want you can just take the screenshot of this okay you can take the screenshot of this i'll just come here and also you can take the screenshot of this and also you can take this and you can give your own styling okay now once we are done with this i'll just come to my project here now if i refresh this one you can see i'll be having this output i have my first cut second cut third cut fourth and fifth now we will be fetching the data i'll just come here here you have to write github users api i'll just open this first link okay from here i'll just copy this link inside script.js inside script.js i'll be pasting that link i'll just paste the link here i'll just comment it out later on i'm going to use this one now inside this we have to fetch the data first we have to read the data from the api so we have to define our function i'll be using async function i'll just use this async function i'll just give my function name as github uses i'll just give here get github uses inside this function first i want to fetch the api data i'll create one variable i'll give my variable name as response and here i'll be using this await keyword i'm just telling it to wait until i get the data and here using this fetch method i'll be accessing my api link now this whatever link i'm having i'll just paste that one here i'll copy this and here i'll be pasting that link now if i do console console.log i'll just do response here i'll save this and here i'll be calling this function i'll copy this one and here i'll be pasting that one i'm just calling the function here i'll just refresh my project i'll inspect this one now you can see in my console i'm just getting fail to load resources file not found projects.jc okay i'll just come to index.html and here i'll just write here script.js i'll save this now if i refresh this one you can see i'll be getting this response reference error s is not defined okay we will fix this one but you can see i got this response here i got this response now we are going to convert this data into json format i'll just remove this s from here now here i'll be creating one more variable i'll give my variable name as data and inside this i'll be passing this away keyword and here i want to convert this whatever response i am having i want to convert into json format i will be writing this dot json if do console log i'll just pass this data here i'll save this now if i show you the output you can see i am getting array of 30 data you can see i got this data here now i want to display this data in my browser so to display the data here whatever card i am having i'll just close this style.css now this is my array you can see here this is my array array of objects to access this particular id now this is the data which is holding all the values now if i just do your console.log data i want to get a 0th index whatever i am having here i just i just want this i'll just copy this one avatar url and here i'll be pasting that one i'll save this now if i refresh this one you can see here here i am getting this link okay which is stored inside this zeroth index link okay i got this link as my output okay to access this object's data we have to use this dot and we have to access the property and this is my array now i want to store all the data in my browser okay we have already seen this using fetch method now we are going to see this in using await and as async now here to fetch all the data we are going to use map method and map method will be applied to two arrays now this is my array which is having all the data i'll copy this one and here i'll be pasting that one now using map method i want to access all the values i'll just write here values you can give any name for this argument and inside this here i'll just close the function and this values will be having all the data now first time it will be having 0th index data second time it will be having first index data third time it will be having second index data okay it keeps on going like that now first time i'll be having this first data so here i'll just create one variable i'll give my variable name as a display i'll just give here empty string now here i want to display all the data display is equal to inside my backticks i'll just come here i'll copy this first i'll just copy this card and here i'll be pasting that card now instead of this image src i'm just going to remove this source and instead of this i'll be passing this values which is having all my data dot whatever image link that is my image is in this avatar url i'll copy this one and here i'll be pasting that one okay instead of this username i just want to print the name okay here i don't have name i just have here login now if i just show you you can see i have this login i'll just copy this one and here i'll be pasting that one first i'll write this values dot login i'll just copy this and inside this alt also i'm going to paste that one i'll save this now if i come to my browser now if i refresh this i will not be having any effect here i will just come to index.html and i am going to remove all the cards from here i'll just remove this entire cards and also i'll be removing this and this card okay now i don't have anything inside my index.html i'll save this now if i refresh this one you can see i don't have anything and my browser is empty now now this data whatever i have written inside javascript i have to display all the data here like this i have to get directly from the api and i and it should be displayed like this now if i just close this one and if i show you you can see all the data will be like this now we are going to access our this id root id i'll copy this one and below this i'll be writing this document document dot get element by id and inside this i'll be passing i'll just paste that id dot inner html and i want to display this one i'll just copy this and here i'll be pasting that one i'll save this now if i refresh this one i'm just getting here display is not defined i'll just come here i'll copy i'll just bring it above i'll save this now if i refresh this one you can see i'm having this last data last data of the user if you see here this user is at the end and i'm having only the last data so to get all the data you just have to write here plus and all the data will be added this data first i'll be having empty data plus this card then again this card plus whatever new data then again this card plus whatever new data i'm having now if i just refresh this one you can see all the data of the users from that particular link it got displayed here okay this is how we are going to fetch the data and we are just going to use this await an async keyword okay async is nothing but it is going to return a promise and await will tell us to wait okay until we get the data it will tell us to wait okay this is how it is useful now if i just um give here one more now here below this i'll just write here some more lines okay so that we can understand in more better way i'll be using this await keyword and using this await keyword here i'll just create one new promise here i'll be writing this new promise and inside this promise i'll be having this resolve and reject i'll just write here resolve and reject now this resolve i'll just now inside this one i'll just set the time out set time out and inside this function i'll just write here two seconds and instead of this i just want to pass the result i'll just write here resolve i am just setting the timeout function to my result and here i am just giving the time as two seconds after two seconds i want to display the data to display the data of resolve we will be using then now as of now i'll just do console.log i'll just come out of this function i'll be doing console console.log and i'll be passing this all data has been displayed all data is been displayed i'll save this now if i refresh this one first i'll be getting all the data then after two seconds i'll be getting this output all data has been displayed okay this await keyword will tell me to wait and i'm just creating new promise and inside this i'm passing this resolve which means that my data has been my promise has been fulfilled and here inside console i'm just printing this one okay this is how we are going to work with async and avid this is very similar to fetching the data from the api we are just adding these two keywords async and avid okay if you know about promises and how to fetch the data then this is very easy to understand we have already seen the definition this is very easy to understand and very easy to implement okay that's all for today's tutorial thank you so much for listening have a great day

Channel: Step by Step

Views: 1,546

Keywords: async await javascript, asycn javascript, await javascript, async await, asynchronous javascript, async await javascript khanam, complete async await javascript course, javascript async await, javascript asynchronous tutorial, complete async await tutorial, javascript for beginners, how to fetch data from api, how to fetch api data and display data in browser, advance javascript tutorial, modern javascript tutorial, fetch data from api, fetching data from api, javascript, html

Id: KuoIVGhDb-E

Length: 40min 19sec (2419 seconds)

Published: Mon Aug 02 2021