Understanding PUT, DELETE & Handling CORS : Node Js

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
okay then hello hello hello everyone good evening guys good evening good evening good evening utpal komal prit subashini Dre Mano good evening guys how are you all tarun surj good evening good evening good evening everyone good evening am I audible guys am I audible am I visible clearly please can you confirm that once everyone good evening guys good evening and welcome back to the stream welcome back to day four technically day four but you know according to our plan it's uh day three because I think the last session was day 2.5 right good evening yesh good evening akib okay that's great then that's great so first of all guys uh I hope you had a good Sunday and once again welcome back to day four in this ongoing node.js masterclass course where we are almost very close to be like you know to in building our first API from scratch just by using the HTTP module in nodejs without using any other Frameworks from core but don't worry in future we're going to be using a library called as Express which is very very famous for building apis in nodejs we'll be using that maybe day after tomorrow or maybe tomorrow only because today's day is completely about completing the API that we have started we still have two basic things to do in that okay then after that we'll be learning how to set up a proper project in nodejs a proper JavaScript project and then after that we'll be also learning how to connect our API to a real database or basically we'll learn how to connect node.js to a real database so that the future apis that we will make we will have a real database instead of using just a simple file right now as we don't know how to use database we are connecting it with a file but that's fine because we are still able to do a lot of things we able to create new data we're able to update data look we have not updated anything yet but we are able to fetch data we are able to fetch single data we are able to create new data now today we have to learn two more end points okay how to delete data and how to update data as these are the four basic operations right and after that we can you know increase the number of data increase different kind of dat data make more end points for different different things but these are all the basic end points or basic operations that we need that we have learned so far but don't worry in the future apis maybe we'll be having you know 10 20 30 end points but guys at the end as I said all of them will be doing either creation updation deletion or reading no matter what kind of endo it is mostly it is going to be doing any of these four operations so no need to worry right now our aim is to just complete these four operations properly to understand the API better and in future we can have 10 20 30 end points that doesn't matter we'll learn all that stuff don't worry but right now let's focus on the core again and let's create the last two end points of this API okay everyone so I hope you're excited please let me know in the chat and also guys I hope that you guys have also created some part of the API have you guys also started creating the API can you please confirm that have you guys also started creating the API anyone one of you and also guys please don't forget to like the session and if you're new please don't forget to subscribe to the channel as well okay have you guys started amazing because guys at the end of the session I would love to see your apis as well so once we finish the whole session or maybe once we finish this API by tomorrow you can give me your GitHub Lings in the chat so that I can also check your apis out why not okay share the links with me tomorrow once you complete because today I'm going to complete it right okay no was busy due to marriages there were two okay okay okay no issues buddy no issues at by the end of this course also it's fine if you guys submit me the link okay it's not very important but it will be very good if you submit me the links that you have created so that I can also check it okay so guys enough talks let's go and let's create now because today we have three topics to cover up first completing the API second setting up a proper project because today we're also going to be installing a third party module okay using npm and then connecting to DB and doing some basic operations so that we'll be good to start with Express tomorrow one of the very important things of this course okay where 75% of coding will just go away trust me guys all the coding that we are doing here 70% of this will just go away because Express will make things easier for us but internally it is still using this I used filter method instead of find method whenever I provide an ID that is not there instead of any giving any Mage uh it's fine see even if you use filter method it's fine but the issue with Filter is find finds one data and then leaves it so if you have you know something like 10,000 data and if you're trying to find only one data find will find out the data once the find function figures out that okay fine I have found the data it will skip the other operation it will not move ahead in the array to check more data okay but in the case of filter even if your data was found at the second place in the array and if you still have 10 20 places is remaining filter will still go ahead and found check for the other data as well so that is like you know waste of uh you know memory or CPU cycle you can say that that's why see we are searching based on ID and we know for one ID there is only one data so there is no point using filter like if when if you use filter it is fine and also yeah filter will always give you an array DX it will never give you a single item because filter is supposed to return multiple items so even if there is one item it will give you a array of that item if if there is no item it will give you a blank array okay so try to use find find is much more better if you're sure that there is only one data in the array that you want to find and we are finding it based on ID so find is much more better rather than using filter filter is used for matching multiple data in the array matching multiple things elements in the array is it clear DX okay so guys last time you can see we created one endo which was for fetching all the products then we created one more Endo which was a little longer but amazing because it is fetching data based on ID okay and then we created one more Endo when someone sends a post request on this particular route or path then what do we do guys we learned that this method so whenever someone sends a post request okay that means they are going to send data through the request body right everyone last time we learned that that means they will send data through the request body this is the request body and the data is coming in Jon format but we know that this data will come through a stream chunk by chunk so here at the server end where we are receiving that data this event is called every time a new chunk is received we used to collect that Chunk we collected all the chunks and then combined them to form a proper data right adjacent string that we have received from the request and then once the chunk is done once all the chunks are here at our side on the server then we are simply uh reading the file converting that file data into a JavaScript array and whatever data we received as the Chunk in Json string format we also converted that to object push that particular object into that array and then again converted that array into a string because file cannot hold array file has to hold a string converted that to adjacent string again and pushed into the file that's what we did so guys let's move on and let's make the next end point that will be delete okay which is again very easier so don't worry about that and guys before we do that let me quickly go ahead in my browser and let me you know we were doing the documentation stuff in the Excel sheet guys I hope you remember that so hopefully let me just quickly open that let me just quickly open that okay which was it I think it was this one right y nice so now guys let's go so this was I used a synchronous method to read file and yeah that's fine asynchronous synchronous anything is fine completely okay everything will work in this case okay so now guys we did one get products we did one go products with ID and we also did one post on the products URL for creation now we're going to do we're going to send a delete request on the same URL so guys in this case we can keep the URL same because our method is changing you can also Al change the url it's completely fine but there's no point changing in the URL because you're continuously working with products so it's fine to keep the URL same because your method is different so it's okay you can write a proper if condition for that okay and guys now if you're planning to delete you also have to tell right you also have to tell the server which one to delete because there are 30 35 products so which product do you want to delete just like here we mentioned get me the product with id2 just like that you you also have to mention which product do you want to delete and again guys you can mention the product by any way you can me you can delete a product by using its name okay delete the product with name this or delete the product with category this but you know that category can be repeated there can be multiple repeated categories in your whole uh file there can be mult there are chances your product's name may be same that is why guys we generally always use IDs because IDs are always going to be unique for each and every data so it's always best to use IDs for operations like getting a single product performing delete performing update only if required we'll go for name checking or category checking or something like that only if it is required at some point of time but normally we always go for ID but again it's your choice guys but mostly it should be ID if you're working with apis so my mom recognize your voice from back oh that's amazing tell her hi from my side I hope she's doing good okay so guys here we go we'll also send ID here so some kind of ID sorry but I to ask one question my brother got one python project with Excel sheet what's best way to write direct python code inside Excel python code directly inside Excel file um my brother got one python project with Excel sheet I'm not understanding with p is it like you know reading Excel file in Python yeah that's possible but writing python code in Excel file I have I think I have to check it or do one thing uh can you elaborate that question a little bit in my LinkedIn I think you're connected with me on LinkedIn right so elaborate your question there and then I can help you okay just after the session we can talk there and you can ask me the question and I can help you there I can understand it better there okay cool hi mangala so let's go guys let's go so now we have to delete a product product based on ID so guys we don't have to send any data through request body nothing like that we just have to send one ID and we want to delete that that's okay and the method will be delete so let's go and let's do it guys so now let's create the other endpoint okay so let me mention endpoint to delete a product based on ID okay don't don't forget guys it's the continuation of the else if or the multiple if statement this is just a comment please don't write any code I hope you know right in the basic programming you don't you should never write a code between else if and if else right you should never write any code between them so it's continuation it's just I'm using this space to comment that's all so else if now if the request do method if the request method comes as delete and the URL is same so and you know I'll just copy this so that we don't have to use any more time and Ur list products now here you don't have to check for ID see guys the reason that we checked for ID here was my URL was same in my both get request my URL was same my method was same that's why to identify that if the person wants all the products or if the person one single product we mentioned that if ID is not coming in the request if the ID is not coming in the URL then all products if the ID is coming in the URL then only single product right guys that's what we did but now we know that in delete ID is definitely going to come without ID we can't delete that's why we don't have to check it we know because there will be only one end point there's no confusion so no need to check for ID just use it directly okay so now that means guys someone will send a request like this so so now they're going to okay let me create a new request we'll keep this post one so that you know it this data doesn't go away let's create one new request okay URL going to be same so I'm going to copy this from here okay so now someone is going to send a request like this it's going to be a delete request and they will also send ID equals something guys I hope we know right how to read IDs everyone okay because we are passing this URL so definitely we know that this ID is going to go in that property yes or no guys everyone we know that right this ID will go in that query property no headers nothing is required no body data nothing only the delete request and the ID that is all okay so first of all let's read the ID so let ID equals now I'm just separately mentioning it but again it's not important so pass URL we know that it goes inside query dot ID right are we accessing it directly hopefully let me just check yeah query. ID so we know so all good so now the ID that the person the ID for the product that the person wants to delete is here now again guys same logic let's just refresh everything we have a file it's a Json file that means all this data is a Json string we have read this file so in the variable we have this whole data in adjacent string format so guys you tell me now what is is the first thing that we need to do let's see if you can answer first thing is we need to convert that dent string into a array so that we can work on it right everyone so that we can do some JavaScript stuff on it now we know that initially only we have read the whole file and the whole Json string this whole Json string is stored in this products variable that whole string so first thing is we need to convert that so let's do it now see guys if needed I should have converted it on the top only I'm doing it again and again so that your mind will never forget this in future we can do that changes but this is something that you're learning for the first time that's why I'm just doing it I know it's not a good practice I can convert it on the top only and use it multiple times but the only reason I'm doing it because you can also figure it out that okay I have to do it only once I'm doing it because I want to hammer your mind in this case that okay this needs to be done because this is one thing that people tend to forget that's why okay so let products are as this is the first time it's fine to do it multiple times okay first thing is json. pars products which is adjacent string so now we'll have our array available Here and Now guys think of this data is available with us and now we have a ID so now what we need to do is by looking at the ID we want to delete that whole product whole object from this array how can we do it so guys in JavaScript if you ever want to remove something from the array you need that elements index so if I want to remove if I want to remove this element so I have to figure out that the element's index is zero but I don't know the index but I know the ID So based on the ID I need to figure out the index of that whole object and it's very easy guys it's very easy I have the ID with me correct so just like when we do this products sorry products array do find right we do this and here we know that every element will be available and how do we extract the element we simply say return if anywhere the product ID that means okay yeah so anywhere my product ID matches my given ID which is in this case this one guys why to write this extra line actually let's directly use this right I don't know why I wrote that extra line Okay cool so whenever it matches this particular ID but it's a good practice to store it in a variable but only if you want to use it multiple times here there was only one time so it's okay okay so from the products array find the product where the product ID matches my given ID now we know that we have also used this operation on the top for fetching single product we know it will return that whole product but I don't need the product I only want the index so guys in JavaScript there's also a function called as find index so from that array find the index of the element where that element or object's ID is matching my given ID so let's say if my given ID was three so it will go in here it will check oh this product's ID is three so what is this product's index so according to the logic this is zero product product right this is first product and this is product on index number two simple so it will give me the index so let's just simply call it let index so now we have got the index in this and now guys we need to remove the element which is on this index from this array so let's do that product are DOT there's a function called as splice okay splice in splice you need to pass the index of the element that you want to remove so I'm going to pass that index now from that index how many more elements you want to remove no from that index only one element that means see guys it's like this now I know that we have also learned this in JavaScript okay but just to confirm if I have like elements like this okay and if I want to remove this 465 okay let's have four elements and I want to remove this 465 so in sply so let's say this R name is a so I'll mention a do splice this index is one and if I mention two that means start from index number one and remove two elements so start from index number one and remove one two elements but I don't want to remove two elements I only want to remove this one so just mention one start from index number one and remove one element so start from index number whatever I've given only one element so start from this index and remove only one element that means the element which is on that index remove that from the array so now guys what will happen from that array whatever element is there it will be removed and that array will be updated internally it happens in JavaScript whenever you splice array that element will be removed from that array and that array will now have one less element and now guys our this array will have one less element and now what we need to do is now we have a new Fresh array just the same logic now we have a fresh array just put that fresh array into the the file again overwrite the file with this new fresh array in the string format so guys what we can do is we can just copy this code from here writing file right after changing the array just this write the file again into this file stringify this array and put this and now here we can say product successfully deleted right and also guys if there is some error you can also to send a response like you know like we know what if some error happens then are we not going to send any response because see we are mentioning if there is no error then all good what if there is some error what if there is some error so in that case guys mention mention it here okay now guys there are still some more validations that we can do here you know if we go on we can also add two three more validations but right now we are not doing that because we'll do that in Express we'll learn how to properly validate things in Express as right now we are at a very starting phase of API development so we don't need to do that heavy validations okay so that we understand this better sir if you want to delete more than one product for delete but then our present random order that is why normally we never delete in apis also like even in database it's possible to delete multiple things but still we don't make AP API end points for that we normally try to delete one element at a time but even if if you want to delete then we need to just write some program if it is some random order then what you have to do is perform a filter or just perform a filter you can just perform a loop find out the index of all those elements and then perform a loop and splice it again and again and then finally you'll have an array in which all those elements are removed so you have array of 10 elements you want to remove three in random order just apply a loop find out the index of all the three elements and then apply a loop which will run three times splice splice splice Thrice one one element removed and finally you'll have a new array where all the three elements are gone so it's possible KL it's possible if you want to do it but technically in apis normally we only delete one element at a time that's how apis work that's the convention that we follow is it cleared use comp oh yeah yeah I forgot thank you so much rishikesh thank you so much I used the assignment thank you so much buddy is it clear KL so it's okay we can do that and guys here we'll just add a you know safety message like if something happens in the the file right operation and there's some error we'll just uh you know mention some problem like that so that user will at least see some problem was H some problem has happened and also you can add the same else on top as well now guys we are not doing complete validation here our aim is to learn basic API development so that's all good okay so guys our delete endpoint is ready should we test it okay so right now let's delete this one only Samsung Universe 9 let's delete delete this one so file is here let's go and send a request delete request on ID number three and also guys yeah our project is still not running so first of all let's run our project so nodemon index.js and guys don't worry about this terminal my terminal misbehave sometime because of the lot of content so it's okay and here we go okay so now it's up and running and now let's send this request and let's see what are we getting as response and and here we go product successfully deleted let's check our file now and see the format has changed that means something happened so now contr a right click format document and let's check if the third number product is there or gone so ID number one is there Cool ID number two is there cool and ID number four ID number three product is gone so now we have permanently deleted data from our file all cleared guys everyone all set your delete operation is also done and we are very close to completing our first API with all the basic features okay so all good everyone now then we only are left with the last end point for updating anything in the data so let's go and let's do that as well okay guys everyone shall we let's go and guys everyone see now we are doing this AP I from I think last three sessions because we have started from basic so I hope you're understanding everything and there is no big confusion going on I think you're like are you guys able to under understand till from like around 90 to 100% of this API more than 80% hopefully everyone confirm that till the time I comment I hope you're able to understand more than 80% of whatever I'm teaching about this API because in express it will become easy but I hope you're able to understand the score as well all okay that's great is it 100% guys is it 100% so now the last end point endpoint to update a product nice final endpoint else if else if let's go now guys we'll be using the put method here so if the request okay first of all guys as we always do let's go quickly in the documentation so now it will be put request and again it will be on the same URL SL products okay and question mark now guys see again logic let's let's try to understand one thing while doing a simple get we are only sending URL simple URL while doing get for single product we are sending a URL parameter while doing a post simple URL but in this case we are also sending data so let me just mention data in request body okay so just try to understand guys what's going on this documentation will help you a lot in what request what are we sending in delete we don't send anything we only send URL parameter now in put in update we're going to be combining everything we'll be sending ID through URL to tell the server which product do I want to update just like in delete you send the ID to tell the server which product do you want to delete just like that input also you will send the ID which product do you want to update but not only that now you're updating the product so you also have to send new data right because you also want to update data so in url you will send the ID of the product to tell the server okay I want to update so and so product with so and so ID but what to update which property name category price which property do you want to update because your products are having many properties discount percentage price description which property do you want to update just like that so in this also you have to send data in request body so guys that means now in a put request you'll also send ID through URL and just like post you'll also send data and request body that means guys you will again have to have handle that data chunk by chunk got the idea and guys once you do this now you're now you know all the things that are to be done in the API inside API these are all the things that are done in some manner in some end points code will be a little larger there will be some more things happening in some endpoints code will be a little lesser but it all comes down to your practice and how you do your things but this is all the basic now so while I was ex executing the project on error please tell function I didn't understand what it was uh churla bunny can you please send me a screen like uh not a screenshot but can you please mention that error message in the chat because if it is saying product array is not a function that means you're trying to use product array as a function because it's not a function it's a variable right see in our case product array is simply a variable so I think you're trying to use it like a function maybe maybe you're trying to apply a bracket somewhere check that out bunny check that buddy maybe you're trying to use it like a function like this see nowhere I'm using it like a function see that I'm doing product added. find index it's just a simple variable product add. splice so I think somewhere you're trying to use it like a function that's why it's giving that error anyway paste your uh error message in the chat so that I can see and I can try to help you in there okay so now guys let's go and yeah let's mention so update a product based on ID let's go guys our final endpoint of this project let's go and don't worry guys in future we'll be having more end points so now let's use this post area only see the only difference between a post input is first of all you'll be sending data that you want to update okay you'll be sending data that you want to update not new data because you don't you're not planning to create data now the method will be put and will be also sending the ID so let's say guys now let me show you how it works so let's say I want to update this product id7 let's say I want to update the rating and price of the product with ID 7 okay so normally what we do is from front end we send the whole data remember guys normally from front end we send the whole data sometimes we also send the single data but normally we always send the whole data so we'll just take the whole dat data we'll go here so ID is what id is 7 right so ID equals 7 and now guys we are not creating a new product so no need of new data paste the whole old data and just change whatever you want to change this is what will happen on front end as well you'll get the whole data and you'll just change whatever you want to change and click on update that's what happens so you're saying wherever ID is seven so let's say I now see old rating was 1499 old uh sorry old rating was 4.25 and old price were 1499 okay so let's update these two things and you can update multiple things guys completely fine so let's say now price is 2999 and rating is let's say 4.01 and you can also change the name Samsung Galaxy book note something like that so you can update n number of properties at one time it's fine okay guys now you might think sir if I want to only update three properties why I'm taking whole data because the idea is replace the whole existing object with this new object that's why the name of the method is put remove the older version of that data and put a newer version of the same data with new updated properties that is why the name is put you're putting a new data in place of the old data but please guys don't forget don't change the ID technically we never send the ID but right now it's a file it's not a real database system that can manage IDs on its own that's why we are still sending IDs okay technically we never send IDs in a request body normally we don't because our databases will be able to manage IDs you know right we have learned mongodb IDs were generated automatically IDs were always there right in this case we are sending IDs because it's a file system it doesn't know what's ID that's why we are sending ID again and again okay okay but guys the reason this is called as put is you just change few properties but even if you only want to change few properties you still send the whole data and it will replace the whole old data so that means this object will be completely removed and at this place this new object will be there in which some properties will be same some will be different and that's how update works okay so this is the request so let's handle it method is put URL is/ products let's handle it guys so request dot request do method is going to be put and in this also guys we are receiving URL ID but no issues because it's a single request there is no need of identification so there is no need to mention any ID we can directly use it no need to mention ID and condition and passed URL do path name is what slash products okay and forgot double equal to here you can also use triple equal to in JavaScript that is a much more better thing okay now we receiving ID here and we are receiving data through request body guys again we are going to receive data through request body okay so understand we again have to receive it chunk by Chunk in the request so guys how do we read it so let's mention it here ID will be directly available because it's coming in the URL right so whatever is coming through URL you can directly read it Parts URL do query dot that variable Name ID we can read it we have seen it and now whatever is coming through data body see guys everything is fixed everything is fixed in API development around 70 to 80% of the things of the format will be always is fixed that's why it's easy almost every time things will be fixed only fewer times you might have to do some extra changes otherwise it will be fixed so again you need to need you need to read request body so again we'll create one variable a blank string in which we will concatenate so leave that so request exactly same like post coml request.on data this event is called whenever a new chunk is received and that chunk is available in this call back function again guys it is just you know a variable name you can change it but it's better to call it chunk why I'm making a spelling mistake again guys you can call it anything you want I don't know what was the spelling last time so let's put it CK chunk okay I think it's only CH andk why I making a spelling mistake in this small variable let me read it why I gave it oh chunk only why my mind is thinking that there is a c maybe now I'm forgetting things okay cool let's go so now every time I receive a new chunk please again guys you can also use plus equal to right rather than using equal to product plus chunk you know there's a short hand that rather than doing this big equation you can also simply write plus equal to the basic operator right which means the exact same thing okay and once we have received everything what was the event guys on end okay and inside this call back function your whole data is available this whole product will be available in the converted format okay so we have it here so now guys again you have got everything that you need now your job is to again read the file which we have got it convert into array let's do it we have read the file already on top which is stored in products but it is in Json string so again we'll create a variable called as let products array equals json. pars okay and products okay passed it now let's also convert this product that we have received from the request we know that it's also in Json string format so let's convert it let's call it at product obj sir your voice and lip are not in sync just want to know why it's I think it should be in syn guys it is in sync or is it late please tell tell me is it delayed or is it in sync yes or no guys can you please confirm guys is anyone facing any issues Okay no Okay okay I think for everyone else okay no issue shash I think just check your internet connection once hopefully it will be fine it is in sync right okay great so guys converting the product that we have received from the request body which is coming in a Json string format we converting into object and storing in this variable so again Json do pars just like we did in post guys but here we are also having a ID so now guys logic we have the array we have the object we have the whole products array we have a single object inside that products array we need to find out one element that we want to update we need to find out the index of that okay and at that place we want to put something else it's like this see guys it's like this if I have an array of multiple elements like this I want to replace this 67 with 78 so what should I do guys I do this right a what is the index of 67 guys 0 1 2 so a of two that means the element that I want to place I need its index I hope we know right guys how to find index based on the ID of the element equals to the new element whatever you want let's say 89 or maybe let's say 70 something like that so we have this new element which is this object and now we need to figure out the index of the old element old object and we have the ID of That So based on the ID we can figure it out right so again we need the index so let index equals products array do find don't use find find will give you the whole element whole object we need the index of that element wherever the products ID so wherever the product ID matches my given ID which is this one again guys no need to use it separately I just mention it so that you know it will be there so this ID wherever it matches give me the index of that and after getting the index now guys before updating check also if it is there or not so let me show you how to check like first of all check what does fine index give you if that element what if like you know you're passing the ID and that element is not there then what so let's check what does find index return if the element is not found mostly it should be undefined but let's check we can check the in a browser actually we can open browser console just to do some basic JavaScript let's create an array let a equals 34 56 78 90 something like that and I have forgotten all the commas that's really great okay nice so we have array now a DOT we'll use the find index okay and not return uh name it will be if n is matching uh 91 now we know that we don't have 91 so see guys find index returns minus one so it's good right that we confirmed it doesn't return undefined it returns minus one find index function see find returns undefined if the element is not there find index returns minus one if the element that you trying to find is not there so if it is not there it returns minus1 okay so if index is not equal to minus1 that means element was found so we can now do whatever we want else send a response that the element was not found so response. end json. stringify send a message the element with given ID is not there not found whatever you want guys you can also do the same thing here right on top for delete also see we were trying to find out index you can do the same thing here if index is not equal to minus one then do this whole operation then splice and all that stuff if it was found okay but if it was not found we can so now we have provided a very good validation right a good thing right everyone so why in else we need Jon stringy because you're sending a Json object right utpal you're sending this you're sending an object just an JavaScript object right but in in response you cannot send a JS object everything should be a string that's why J not stringify this object we want to send it in this format right in ajent format but for this this is the JS object in JS file whatever you write using brackets is a JS object so that's why string a file okay but if it was found guys so now what do we want to do from that array we want to remove that so very good products array from that array on that particular index replace it with this new object simple right guys so in the array on that particular index whatever is there I don't care replace it with this new object and once that is done just the base operation basic operation of writing the file with the new array that's all so same logic on that index after replacing it with this new object that array is now updated it's a fresh new array and just just write the file again write file produ Jason convert that array into string write in the file if there is no issue product successfully updated is that cleared guys everyone so it looks very big but if you read it see guys that's what happens when you go on internet and when you try to figure out how to make apis using HTP module or something like that you see something like this written over there and we get confused but now if you see how simple it is actually right we are creating a variable we are receiving data chunk by chunk once the chunk is completed this function is called we know so once it is called then getting reading the file converting into array because file is ajent string we convert that into array whatever we received in request converting that to object then figure it out figuring out the index of the element that you want to update based on the ID which we are receiving in url and then if it was found then replace it in the array and write that array in the the file again if there's some issue and some dummy message that's all and guys now save it and now see ID number seven is having a price of $499 and rating of okay again I forgot rishikesh okay I don't know what's happening to me today okay all good same thank you so much Rik thank you so much okay so now guys price is $499 and rating is 4.25 and that's I'm updating I'm putting the new price as $2999 and rating as 4.01 as we can use directly without brackets and also without string IFI yeah but then it will be a string right it will not go as Json it will not come as this right it will not come like this then it will come like a simple string correct with P I want the message to be like this so that in front end also if there is some language it can use this Json so I'm trying to send my response as Json rather than a string I'm sending a Json string so that any if right now it's a testing tool but if there is a front-end language or front end application which is using JavaScript or Java that can read this Json and convert into Java object JS object C object whatever they want right that's why we sending Json objects cool guys so let's test it everyone let's test it so send and here we go products okay amazing why guys why we got it why we got this message because I think I didn't save it so let's save it quickly okay and let's check if it is updated first at least message was wrong but that's fine let's see what is happening with the ID number seven I number seven okay it got deleted guys it got deleted why it got deleted I'm sending a put request here why it got deleted how is this possible I think I didn't save it that's why maybe yeah it's delete here and it's put here so what's the issue okay let's check it again it got deleted Maybe okay let's check it once more guys maybe I've I'm doing two request at one time so some issue happened but okay fine fine fine no issues uh let's take this IDE number five product take this whole thing and so old uh old price is $499 let's update it to let's say something like you know something like 611 okay now let's try and ID is now guys what ID is is five send why deleted okay there's some mistake going on let's close this one first that request is doing something with it maybe or maybe we are doing some mistake let's check it what's the issue because here the request method is put and how come Delete is happening maybe it was sending a request of that window maybe because I had two windows open right maybe it's misbehaving the Thunder client a little bit let's try it let's try it yeah see it was doing something like that okay let's delete this one request okay now let's let's check it again so two products got deleted without causing any issues RP to those two products no issues let's format it again Guys these things things happen it's okay it's completely fine you're a developer you know right this will always happen so it's okay just don't try these things directly on production database in future if you're working for a company okay so let's do it for ITA number 25 let's sacrifice one more product guys I know this file is fine surj this file is okay and I have a backup for this file on GitHub we have a backup right so it's okay okay let's try once more and guys please one like equals 2 1 rip for these products which are going away for no reason at all so please do like this video Okay cool so price 70 let's try change it to 90 and hopefully now hopefully it should be working so price of 70 okay please please it's a put request what's going on have I made a mistake somewhere hopefully not okay let's try it send okay good we got a good message nice right last time five got deleted we forgot to change the ID and at least we are getting the message it's not there good now guys check please why it is getting deleted what mistake am I making here guys now it's time to you know debug a little bit else if else if request. method request why it's ending up in delete how come it's sending up in delete okay guys no issues just to check again we're back to normal let's check what is the request method coming up okay so in the console we need to check what is the request method coming up now okay so guys now we are debugging because we want to see what's the request method coming right everyone guys you want to check this because the issue is with the request method so let's check it send it's put it is put very strange how come it's going in delete but it is put very very strange after doing the whole whole big API now we are getting an issue in the smallest of the things after creating this big API with that much lines of code okay one more testing guys one more testing let's put two logs in these two functions just to check where it is coming so console. log if this function is called then delete endpoint and if this one is other one is called update endpoint we'll just put these two things okay now let's check I don't know what's happening app crashed app crashed okay nice okay now we have restarted the app it's going in delete end point wow but here it is put that's also wow so guys okay so that means there's some silly mistake somewhere El if let's check the endings else if it's ending here else if request method is delete and pass all how come it is doing in that the method is coming as put then how come it's going in delete like how can it go in delete see it's printing this stuff that's why I'm checking if I have made a mistake in the my in my LF blocks but no see here we go else if is starting here it's ending here and then we have the another else if here and my now main issue is if my method is put and if my path is/ products how come it can go in delete end point how is it even going there very strange is it some cash issue or something like [Music] that let me restart the server once and let you know okay now here we go finally we are now getting the feeling of that we are a developer so it's good it's good thing it's good thing let's clear all the activity let's get a fresh request maybe there's some Casher issue going on guys so no issues let's get a fresh request so it should be put it should be HTTP colon double slash this one fine body will be this one okay nice now we need to check where it is going still in delete really strange really really strange it's still coming as put but it's still going in delete H very strange let's try post and I want to check if it is still going in delete no why only for put this is happening how come only for put okay see I have once I have like you know two solutions here I have two solutions here and maybe I know what's happening maybe I know what's happening um like but now I think it's working as synchronously no no no no no no no no no if we put above it will work but I I think I know what's going on here maybe but then it should also happen with post if I put my post down here like before reaching put it is calling delete so it's not calling get like it's not calling get obviously but why it's calling delete if I put post like if I just you know guys let's let's do let's let's try it I think I know what's happening but you know just to test it let's put this one on top before uh Delete and now let's check it guys yep now it's going an update but uh calling delete also it's not looking very fine but because it's not going in get it's not going in post but it's directly going in delete delete is getting called but even though I have mentioned that only if delete is there so it is a little strange if I put up then it's perfectly fine but but then what's how come Delete was getting called now it's fine if I put my put before delete it's all good it's not necessary to keep it last right like if we are putting proper conditions then it should be fine if else if and last else part no no last also else if why not like it's not important that we can we should only have else at the last lsf should be fine I something is going on in my mind but I'm just making sure if that is happening but I don't think so true because I have mentioned proper conditions so it should not happen it should it should not go in delete because I've mentioned delete okay let's search for it like the thing that I'm thinking may not be correct because I have mentioned proper conditions calling put is calling delete end point or maybe the endpoint before that no I don't think so it should be there should be I think it's some of our mistake maybe it should like it something that will this will be not there it may see guys what I'm thinking is it is a re like there there there's also one more request which is sent internally but even if it is sent internally it's it still not called delete because delete is mentioned separately I don't think there will be any solution for this online but I want to know what's going on but anyway the API is complete guys uh so now if we check it it should be working but I need to figure out why this was happening I will check it don't worry I will check it after sometime I'll check it I'll sit and check it what's going what was going on here don't worry we will not use our time on the stream to check it but I'll definitely check it and I'll let you know about in the in the next session don't worry about that because one thing is there in my mind find but if I've mentioned condition it should not happen so yeah but I think now it should work so guys let's try to update uh the data try LS If instead of else above delete block above delete Block it's LF only right LS if yeah it's correct so LS if no issues in that right LF is there it's correct and before before that also it was else if right everywhere it's El if yep if else if else if should be correct should be correct okay no shoes guys now it's working but I just need to check what was going on I'll check it don't worry because according to the condition it should not happen so guys now let's update this one with the ID number 28 and let's see if it is getting updated quickly okay so let's go ID is 28 and the old price is 20 let's update the price to 30 and let's check it guys so send and here we go product successfully updated all good let's check it if it is updated the product with ID number 28 and guys yes see the product with ID number 28 now it's updated the price is 30 and also let's confirm if delete is working let me just check if delete is also working so let's try to delete the product with ID number 35 let's delete this one so ID number 35 and delete remove the data we don't need it anymore and send and it's working nice it's working completely fine it's getting deleted you can see now the product ID number 35 is not there anymore 31 is the last one so guys that means so if I forget guys tomorrow please ask me if I forget because I don't want to waste time on this I but I'll check because I have now few theories going on in my mind and I want to clear it but I don't want to use the time on the stream so yeah I'll clear it and I'll let you know by tomorrow okay guys so anyway that will not take anything from our API so I hope guys now at least the whole idea of how I AP API is made clear to you now we know how to handle a request coming from either a you know testing client or a real front end now guys a request can also come from a real front end and it's completely fine is that clear guys everyone are you getting it a request can also come from a browser let me show you it can come from anywhere it can it can come from anything that can send a request it can be a front-end application it can be a testing client it can be a browser it can be a mobile app any testing client or anything that is able to send API request can call our API now but yeah right now our API is on our local server we have to launch it for anyone else in the world to use it but guys we have now created our first API using only the core modules of nodejs not we have not used the advanced things yet only the core modules and we have created our first API which is handling almost all kind of request let me show you guys let's call this endpoint using the browser now we know that browser by default sends get request so we can only call these two endpoints right not anything else so let's check it let's check it let's open a browser window and guys one more thing let me ask you as we have learned do you remember guys that what did we learn in JavaScript to call apis what did we learn in JavaScript to call apis till that time I'll just do it here guys what did we learn in JavaScript to call apis and guys here we go see that our browser is also able to fetch data from our API the URL is same Local Host SC in 8 8,000 SL products and if I mention ID question mark ID equals 2 here we go question mark ID equals 7 it's not there why guys because because we deleted it see our API is working so perfectly fine 13 here we go and if we have a proper tool we can also call we can also create data update data and delete data so guys one question come on answer me quickly what is the thing that we have learned in JavaScript that will that helps us to call apis we also learned that in asynchronous JavaScript guys what was that function come on tell me everyone guys I hope you have the answer everyone come on guys quickly we have learned something in JavaScript that we used to call apis no Ayn and AIT is a way to handle promises utpal remember guys we have learned something called as fetch in JavaScript remember that we learned something thing called as fetch in JavaScript a function in JavaScript which helps you to call apis remember and fetch function returns promises promise is different promise is a way of handling a synchronous tasks fetch was the function which we learned that helps us to call apis in JavaScript and just like that every language Java C every language has its own way of calling apis what I'm trying to say is now we have one API and any front end or any language that will have a ability to call Api can also call our API now any testing tool any browser can call our API now is that clear they just need the proper address proper server address proper route and they can call any endpoint I hope it's cleared guys hopefully let me show you let me write some JavaScript code for you to show you this uh let's go in a browser see now I'm not creating a separate application but I'm just doing it here in the console fetch right that's how we write guys Fetch and here we goes the URL HTTP colon slash Local Host colon 8000 slash products right everyone that's how we write guys then we know that it it returns a promise right guys so then and here we receive a response which we convert into Json guys can you recollect something from JavaScript so one more thing guys please please please first of all if you're not familiar with JavaScript fetch please please please watch my previous sessions where I have taught JavaScript from scratch and asynchronous JavaScript as well please go to that tutorial and watch it again because that is what you need to move forward in not node okay so please don't forget that now we know that it gives us a response and from that response we convert that response to Json which will extract the data which again returns a promise so okay let me you know let me do one thing let me create a separate JS file for you let me open one more vs code just to show you guys as we have done the API so it's good to create a you know so let me create a new file uh text file save it as let me save it on desktop dummy. HTML now I think you'll remember something so guys I'm writing a simple script here some JavaScript and now guys this JavaScript will call our our API so let's run this file on the browser copy path go in any browser so guys our HTML file is running okay and I'll fetch the data and Print in my console okay so I hope you remember this guys fetch guys I really hope that you remember this and if you have guys anyone if you don't know fetch please watch my Js sessions and not only mine you can learn Js from anywhere but I have a separate tutorial which I did before this course so I would suggest you to watch it okay so fetch and then here you'll pass the URL so HTTP colon slash Local Host colon 1000 sorry not 1,000 8,000 SL products this is the URL right everyone then here you get the response correct everyone response coming from the API but we know in that response in that response our data is not directly present whatever data is coming that is not directly present so we have to extract it that is why what we do we call response please everyone one refresh this lecture go back and refresh this lecture once so in this response our status code is available see let me show you let me print it just to you know show you let me print it console log the response and if there's an issue happening just catch the error and print it now can you recollect few things guys everyone can you recollect few things let me show you here we go see okay what's happening Local Host okay mistake Local Host sorry yep that's why we got thereor and here we go see guys it was not planned for today but let me teach you this actually I'm planning you know not to burden you maybe we can do the mongodb thing tomorrow what say guys like let's solve this because this issue will always come so guys let me ask you this question should we yes cause error so now I'm planning to solve it so should we solve it today and then tomorrow I can we can carry forward with mongodb what's say guys connecting with mongodb don't worry we'll complete everything but it's always good to do a certain things in a single session right I don't want to burden with you a lot of things okay so will that be good so let's solve this error let's solve this error so that tomorrow we can completely focus on connecting to mongodb and you know structuring a proper uh API project and then after that we can move on to express and after that we can just you know move on and learn different different different things like that okay cool so now guys see our API was perfectly working when we were testing our API with a testing client correct when we were checking it with a normal browser it was also working see guys a browser or a testing client they are testing tools that's why they are allowed to access any local API guys listen to me carefully they are allowed to access any local API okay now let's go back to our Jam board to understand this problem so remember guys we have learned this that we have a server this is our back let's say this is our API server and guys this error will be everywhere okay so please listen to me carefully and let's say this is your front end server or your front end application or your browser it can be anything okay so this is your front end server or your front end application okay anything and this is your testing client this is your testing client okay now remember guys a testing client like Postman or thunder client they are directly allowed to access any local API that means in the same PC to access any local API there are allowed because they are not considered as a separate origin they are testing clients they are made for this they are not considered as separate Origins only for the local apis guys listen to me carefully only for the local apis okay and I think also for the global apis because they are testing clients they are allowed to access but but but but when you have a separate server in which your application is residing now you're trying to come when you call your API using a separate front end server or a front end application you're trying to access content from one origin to a different origin these two are considered as two different Origins and now when you're using fetch in a HTML file guys that is a front end application right it's a HTML file it's a application even though very small but it's application yes or no guys everyone getting my point please tell me even though it's a simple HTML file but it's application so a application or a front-end server cannot directly access a API server because they are considered as two different Origins and your API server will never allow by default it will never allow any other Origins thing or bot or application to access this origin by default because that's a security issue think if any API server in this World allows any application then you can also create any application and directly access anything correct getting my point then any application in this world can access any API in this world so by default guys by default this Security will be always there it is a default security we can overwrite it but it's a default security is that cleared guys understood the whole concept here please confirm that this is a default security testing clients are allowed testing clients are allowed to access any API server it's okay because they are only testing clients they can only see data you cannot do anything else but a application running on a different origin it's not allowed to access any API server directly because they can use that content they can misuse that content that's why API servers have a default security by default for any other origin for testing clients no it's okay but for any other origin yes it's a security and right now see if you read the error access to fetch at this API Endo okay from origin null has been blocked by cor policy this is a policy that by default every API server follows this policy cor means cross origin resource sharing that means data sharing between two different Origins okay so c means cross origin resour sharing it's a rule regulation or a protocol which all the apis servers by default follow whether you're creating it or whether it's already there they all follow this and by default they will never allow any other origin application to access the API so for this we need to allow we have to tell the API server that please allow this particular origin and you can allow multiple Origins so it's like you have a wall and you're giving passwords to only few of the origins that you are allowed and you are not allowed got the point everyone and see to make sure that you're allowing it there's actually a header that you have to specify on the server the header name is Access Control allow origin this is the header that you have to mention on the server once you mention this server as a response on the API server it will start allowing or Origins to access the API server is that clear guys it's a header Access Control allow origin is the name of the header understood guys everyone please confirm that quickly are we cleared with this all set guys so now what we have to do is and guys you have to do it everywhere no matter in which language you're creting API Java cop PHP you have to do it everywhere okay so this is one header so let's go on our server which is this one and we so what we'll do is see no matter which response we are sending this response or this response for any response I want this header to be there see now we have to send this header as a response we have to send this header as a response so the function is response do WR head okay right head is a function which basically helps you to send a or send a header or something like that okay so any status code is fine so let's say in this case I'm sending 200 okay till now we didn't send any status code but 200 is okay I think there's also one more function like you can simply mention it uh let me see yeah there's also a function called as set header so we don't have to mention that status code yeah just name and value so use set header don't use right head because guys in future we are not going to be using these functions we're going to be using Express so no need to mention status code just set header okay so set header header name was what guys Access Control allow origin right and guys also if you want to read more about it remember HTTP headers I told you that this thing exists here you can go onto this site and read more about it okay so it's a response header you can go here and check it actually somewhere okay let me just search it Access Control see here we go Access Control allow origin response it's a response header indicates whether the response can be shared with the requesting code from the given origin understood okay no that is for web access surj that is for web access that is for file accesses mainly this is mainly used in uh you know I think this header is also used for uh you know yeah but no idox is different okay and sidox was mainly used when we used to create uh you know when we wanted to share HTML files as a response and at that time it was helpful to mention few headers okay here we don't do that here we have to mention it as a response header is that clear surj but yeah kind of similar things yeah you can say kind of similar thing okay so now guys set header the name is Access Control allow origin so write it as it is and the value now here guys in the value section you can mention the origins that you want to allow the IP address of the origin that you want to allow for now star that basically means what guys any orig is fine anyone is fine okay and that's it guys so I have mentioned it here let's test it now let's test it if my application is able to call it or not refresh and oh some issue okay I think you know my server is not yeah application has crashed let's quickly rerun it and let's see still issue okay yes sorry sorry sorry guys please Sly mistake please set your headers before sending your response once you have sent the response nothing will work after that response sending is like return so please set the header first and then send the response simple logic right if you have already sent the response how can you send the header now got the idea guys so please after sending response don't do anything sending response is like return okay my Sly mistake no issues and now let's check it and of you guys see you got the response everyone see that you got the response but you can't see the data because data is coming in a readable stream we learned that right in the fetch data comes in a readable stream and guys again I'm not teaching fetch here so please watch my previous JS sessions to understand more about fetch because I have taught fetch in detail there okay so now it's working guys and now we know that this response is just a core response we need to extract our data from it so for that guys we return the response. Json function this Jason function again returns a promise which we can handle here and now here our data will be available for everyone new here guys please please watch my async Js course on the same channel there have t Tau fetch in complete detail okay so let's print the data here guys and now now so see the response was looking like this from this response our data is stored in this rable stream I want to read my data from this readable stream this response. Json function extracts the data from this readable stream because you can't see your data right coming in the response I'm I'm not able to see my data I can only see the status code and you know all the basic stuff so my data is there and I want to extract it okay so this function helps us to extract and it also returns a promise so we handling it here and now we should be seeing our data many of you guys see 27 products so any application now can also call end point but can we call this one products question mark ID equals 1 will this work let's see no why guys because in our API we only mentioned this header for this particular end point got the idea everyone one we only mentioned this header for this particular end point not for this one this responses are still going without header without the access control header got the idea so now there are two things either you mention this header everywhere or just mention it once outside so that means once the server is created request has came response header will be sent set response will be set and now after that header is set now whatever response you send in any of the end point this header will always go because if you mention your header inside if and else in an if and else only one condition will be correct right so yeah we we have already told the response object that this is one header that I want to send in response by default on the top now no matter according to my condition whichever response is sent this header will be always there is that cleared guys everyone got the idea so now we are allowing the origins yeah we did this right on top so this is now globally settled in the response object can't we mention header univers yeah now we have done that rishikesh and now guys no matter which uh one you call see single product is also coming here but guys let me also give you one more thing now I was not telling you this initially but now I want to tell you this as well one last issue is still there we don't know it sometimes a lot of API developers also don't know it that is the reason we learned API development in this logic because guys when we learn in Express right when we learn Express there we don't need all this stuff trust me there we don't need all this stuff when we are Learning Express because there is one function which will solve everything that is why we learned the core way so that we know what's going on internally okay so guys we have not solved everything yet there's only one issue that is solved but let's test it is post request also working because you can find now get is working should we test post guys should we test post what say everyone should we test post Let's test it let's go so now method is going to be post and guys we Al also want to send some data right so request body guys see in Fetch that's how you mention request body in testing tool you had an option right in this you mention it like this body okay so body json. stringify because we sent it as Json and let's copy one data from that API only this one and guys let's do it separately because it's a very big data right so let data equals this okay or PR something like that prodad this is my product as a JS object because it's in JS file JS area now and this is the data I'm sending sorry not here my bad here and now guys one more thing see in a testing client see please focus in a testing client When you mention your data here you have selected the Json so testing client lets the server know that I'm sending a Json data and server knows that a Json data is coming okay but when you're using fetch fetch is not going to tell server that I'm sending a Json data so you have to tell the server that you're sending asent data so it's extra information so now you also have to mention a header so one of the headers is going to be okay so headers and one of the headers is going to be uh what was that I forgot the name of the header content type content type this header is internally sent from the testing client so guys when you select Json here the content type is internally set the header is internally sent when you select XML it is internally selected when you select text it's internally done that means you don't have to do it but if you're using fetch now you have to externally mention content type application SL Json so that the server knows Json data is coming so that all that Json parts and everything can work understood guys now because you're writing your own code you have to mention that I'm sending Json data is it clear everyone that's how you send a post request using fetch please watch my previous asynchronous JavaScript course guys I have taught all this stuff there so guys done request is done so I'm sending a request on this URL method is post body data is this just. stringify this is the product which I have it here let's change the ID to 78 something like that and header in the header I've mentioned my content type see guys header is always the I have told it in the first session only header is used to specify extra information about the request so I'm mentioning my content type is Jason go ah guys everyone is the idea cleared why did I mention the header in testing client you don't have to because it's internally set here you have to mention Okay cool so now guys let's try to send this request and let's see if this request is working shall we let's go in the browser refresh and see now there's one more issue even though we have handled now see there's the issue and now the issue is again it is blogged and request header field content type is not allowed request header content type is not allowed that means now if you're sending a post request you have to mention one more header on the server that is Access Control allow headers so forget if you mention this header your API will that means other Origins can handle get request if you mention this one that means people can now access the origin people can now access your API server but only get request but they cannot send headers I'm saying that you cannot send headers but now the client is sending a header and I want to allow it so now let's go one more header so response. set header what was the name Access Control allow headers and now here also guys you can mention the number of headers that you want to allow but in this case for beginners let's put star that means allow all the headers coming from the client you can mention content type comma this comma that you can specify how many headers do you want to allow from the client but okay fine so now two things now let's see if it is still working so now let's go to the client and let's run it and new product created is that cleared guys understood everyone are we cleared with this let's see if it is created guys let's confirm that hopefully it is yep product with ID number 78 is here is it cleared guys everyone we are done all set everything is working and that's how you hand so guys by putting these two headers You' have actually handled course this is what is handling course is called so while creating API sometimes people only test API with testing client and then when the API is tested by a real frontend application it fails because cores are not handled so this is a simple way of handling cores cross cross origin resource sharing policy by giving these two simple headers but actually it's not only two simple headers there are some more things also mentioned but I think for now for this API it is working completely fine yeah it is working completely fine so there is uh no issue so guys hopefully we are cleared with this sir whenever possible please start yeah definitely definitely definitely so once we finish the plan that we have done for now we can actually start with CN C++ as well so don't worry we'll do that and also guys if you're new please don't forget to subscribe today I forgot to tell you but please don't forget to subscribe and share it with your friends as well okay so guys all said then our first API is created so you tell me how was your experience in creating your first API guys how was your experience in creating the first ever API in nodejs and guys one more thing just wanted to show you there is now we have not mentioned that but there is one more thing which you can mention here which is you can also mention how many methods you want to apply how many methods you want to allow to your API so you can also mention Access Control allow methods so if you want to block post request you if you want to block creation so you can mention like this get put that means now you're not allowing post request so you can mention it like this so in course we also mention this so get put post delete I'm only allowing these four methods not anything other than this is that cleared guys everyone see this is also one more thing that we mention in our headers so now guys in different languages mentioning the header may be done in different way but these where this will always be the three headers no matter in whatever language you go the format may change but the header names will be this only okay now guys one last thing for complete clearance okay now guys I'm only sending get push post delete right guys I'm only sending get put post delete correct everyone yes or no tell me am I sending anything else no let's see if it is working after me mentioning Access Control allow methods get put post delete I'm expecting it should work let's see let's see guys let's see because now I want to clear up everything now there's one last thing that is left even though it's working there is still a problem let me show you just to give you some extra info let's try id90 just to create one more product and now let's see if it is working guys let's check if it is working because we should it should be working because I've mentioned get put post delet it should be working I'm expecting it will work but let's see send okay it is working actually I was thinking that it will block the options request but I think it handling it internally so no issues it's okay so it's working guys no issues I thought it will not work but I wanted to show you because sometimes that error comes I think something is happening because that error should come now see there's no error and that's also my concern why is there no error that's also my concern now wait guys wait wait okay wait wait wait let me check that delete if it is getting called every time guys today is not a day why why what happened we didn't do good things surj no issue see it's okay this is how things get updated it's okay I want to see if this delete is still hampering us delete working just want to check that's all nothing big and even though there is no error I'll still explain you what's what goes on internally even though there is no error I will still explain you what goes on internally wait just don't worry about it wait see guys see delete working that means see so that's why that's why the error is not coming because this is hampering it this thing is hampering it now I know see I knew something was off something is off with the delete why this delete is getting called every time something is off definitely something is off wait wait wait wait I knew it I knew it I knew it initially also it was getting called guys amazing rishikesh you captured everything but you didn't capture this see guys go ah guys double equal to understood so guys the problem was now solved it when put was below it and this was on top this was not even a condition so for put also this condition was correct see guys please understand for put also this condition was correct that's why delete was getting called and put was not getting called got it everyone got the idea guys so understood so if this was on top and put was below in the if else ladder this one was getting called because this condition was correct and this was not even a condition that's why it was not reaching till put that means this delete functionality is getting called every time so even if I'm sending post request from a browser delete is still getting called and guys that's why I told you that we'll face a error but we didn't face any error now you'll see see now we'll face an error guys now we'll face an error now we'll face an error see let me show you now let me remove this now see guys now even if I have this one now guys it's very important now we have solved it so now it's very important to understand what now I'm sending a post request see what happens let's see if it is work no response why is that see guys no response is coming right no response is coming let me show you how to check it go in the network Tab and send the request again and you'll see something going on here see response is not here and there's something called as pre-flight return and there's no response we have not got any response that's why console is empty now guys one thing to learn here whenever you send a post or put or delete or patch request whenever you send these four methods request whenever you send these four request remember that these four are manipulative request that means these request are going to manipulate something because either you're planning to create or delete or update correct guys so these are manipulative request that's why whenever you send these request from any client that client before sending any of these request internally sends a options request so that means if I am planning to send a post request client will first block the post request okay you wait and it will send the options request internally I will not send it it will send it internally that is what you call as a pre-flight request it's like a checking okay you wait like you know something someone comes to my company let me in I'll say wait let me ask my boss so I'll go to the boss ask this guy has come do you want to allow him in the company it's like that pre-flight request so options request goes on the server and for that options request if the server sends a response back that means it's good then post request is sent so now you can ask so how till now it was working because guys even if I was sending post request my delete endpoint was working guys delete was successful right and that delete request that delete endpoint was sending these responses because that endpoint was working for post also it was sending these responses which I've mentioned these responses these ones these ones and that's why the client was thinking oh it's fine allow this post that's why I got shocked when post happened right that's why I got shocked got it guys so every time you plan to do Post put patch first a pre-flight now now see now when I corrected my delete when I corrected my delete so now this request this Endo will only only work for delete request now that's why when I'm sending a post request you will see that no response is coming now no response is coming why because a pre-flight request has been sent and it is still guys it is still in pending State see that it is still in pending State a pre-light request has been sent options is called as a pre-light requ request and it is still in pending state is that cleared guys and don't worry guys when we learn front-end development I'll teach you how to read this network bar as well right now we are not learning front- end development so no need to worry about this but just giving you idea it's still pending because the client the front end application is yet to receive a response from the back end got the idea guys everyone got the idea understood the whole thing here so now we have to write one extra condition just for handling options request so on top only just to allow it I'll put this in LF and I'll put an F if if and guys let me show you as well wait let me show you that options is coming let me show you let me print the request method console. log request. method let me print it okay just to show you and let me send the post request again send and see guys now what's print getting printed in the console see that guys which request is coming options method is coming and do we have any endpoint to handle options here we are handling get here we are handling get here we are handling post here we are handling put here we are handling l in delete correct so we don't have any end point to handle options so there is no response going and if there is no response going how come the client will confirm that oh the server is allowing it client needs some response for options so guys I'm not sending options I am calling this code which is sending a post request but by default every front-end application every testing client will send a options request internally but as a developer we have to handle it understood guys initially why it was getting handled because our delete methods code was wrong so delete was not even working so this response was going for options this response was going for options this response was going for options and that's why it's it was working but now when we have corrected it it's not working anymore so now we have to write an extra line of code to handle options okay everyone so here on top if request. Method Keep this if else as it is for handling other kind of request or simply you can just put lse if here and this one can be a if if request do method is equal to equal to options guys just send a blank response because sending a response is only thing to allow so response. end and that's it just send a response blank response that's all and guys option request only comes for postp put patch not for everything else understood guys everyone you can test it actually by not handling it see get was working let me show you how for how many kinds of thing it it is uh going to come let me show you so uh I think you can also read it you can also read it so you can also check it here in in this but you can also check it here so op options request is sent for what request types you can just read it somewhere so you see see as I mentioned guys correct for get it is not sent for postp put delete it is sent for get I don't think so it is sent because it was work okay now also okay fine we didn't check it for get right let's check it for get without options also guys yeah yeah yeah actually let me check because we should check it let's check it let's check it I think yeah for get also let let's check it guys let's check if get is at least working or not should we write guys we should write everyone so now guys we have dugged the whole ground of API development now literally literally we have we are actually have learned everything now about API development almost everything now guys let's check it for get if get is working or not at least let's check it yeah get is working that means get doesn't need to handle options understood guys only for put post patch delete so I don't know why it is mentioned here so no issues okay not forget get is working fine is that cleared guys everyone hopefully but for post you need it see it's blocked so now let's go and to solve it guys only simple thing is write one condition for options let just send a blank response that's all and now post should also be working let's check it out then is that cleared guys so these two main headers and this one line this is what you call as handling of cores and if you ever want to block any headers or allow any methods sorry not headers you can Al always have this header Access Control allow mainly these three headers are always mentioned now here you can mention everything that you want to allow get put post patch delete and also guys please don't forget options if you forget options then options request will never come on your server if you block the opt options so please mention options as well just actually mention everything but just showing you that this is there guys right now this one is not important but just keeping it here so that you know that this is also there you can block methods so this is how you handle course this is how you handle cors so guys understood right initially that delete one was handling our options request internally we didn't even think of it that's why I got shocked when that post worked without giving error I got shocked but I thought there might be something going on but see we solved it and now we also know why that delete was working even we were sending put because that extra equal to we forgot that extra equal to so guys everything now is everything cleared tell me that is everything cleared hopefully I hope so guys you can prepare your own notes for it I'm going to share this whole code to you okay I'm just going to comment and guys guys if you're new please don't forget to subscribe to the channel as well so handling options guys this is what you call as pre-flight sometimes they ask it in interviews so please don't forget options is called as a pre-flight request so handling options pre-flight request which comes for post put and delete which comes before automatically just mentioning it so that you can you know have a note something like that and here we go so guys our first API is done and dusted and now you can create an number of apis but don't worry guys the journey is has just started because now in future we'll be connecting real databases not files and we'll be using Express and we'll be having multiple collections to access not only products we'll be working with users products and their relations as well so we have a lot of things to do but I hope the whole idea of API is cleared now learning from a great is a blessing thank oh that's amazing K that thank you so much for the kind words Kum thank you so much thank you so much so guys yep that's all for this session and yes rishikesh yes so yeah we last in last two days we created the whole API almost and today we did all the all the security stuff and we solved all the issues that you may face so yeah all good at the end right so guys the only thing that will stop you to become API developer from becoming a API developer is not doing enough practice so please sit today tonight or maybe tomorrow morning and at least complete 70% of this API because once you write write The Code by yourself you'll understand things better okay so please write this whole code once face all the issues but try to complete it thank you so much Jonathan thank you so much buddy thank you so much surj that's great that's great buddy so yep guys thank you so much everyone the first API is completed this whole code will be uploaded on GitHub in the next 10 minutes fin it out but guys please it's my kind request practice it and don't worry guys at the end of this course I'm coming up with something amazing for you guys okay so I'm planning for a small competition just for my subscribers okay and there will be some prize as well okay just like a game for us okay so be prepared for that but we'll talk about that at the end I'm just giving you a hint today we'll talk about that small competition at the end of this course okay so be ready for that as well it will be a subscriber uh uh competition only it will be very small competition but yeah it will be amazing with some gifts and as well okay just from my side just to you know have some fun with you guys as well okay so yep guys that's all for today thank you so much for joining in at the end no at the end of this course that is nodejs then after that I'll take a five six day Gap just to create thumbnails and content and once that is done we'll start with react okay so guys after node one week break almost one week break then react then one week break then flutter it will go like that I'm not sure but mostly one week break okay so by January before January 15th we'll try to complete react and flutter as well oh that's great isik that's great buddy yeah I have seen you I've seen your name there as well so y guys that's all for today thank you so much for joining in please subscribe to the Channel please share the Channel with your friends and like the video before going as well and I'll see all of you tomorrow where we're going to be learning how to connect our API to database how to connect our nodejs to database and also structurizing structuring the whole API project because right now it's not structured it's just one file and having everything tomorrow we'll see how to also properly give structures and all that stuff as well okay no that react is on let's upgrade rishikesh so that is uh uh not this one that is only a 5day essential course here it will be a complete course just like node complete course no days limited if it goes for S days eight days it's all good okay rishikesh so yeah thank you so much KL thank you so much thank you so much means a lot so yep guys that's all everyone bye-bye see you guys tomorrow when we start with connecting to database and introduction to express as well okay bye-bye guys good night see you all bye-bye good night guys for
Info
Channel: Thorabh Codes
Views: 1,272
Rating: undefined out of 5
Keywords:
Id: iuoOfCkMIY8
Channel Id: undefined
Length: 114min 1sec (6841 seconds)
Published: Tue Nov 28 2023
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.