Full Stack iOS Notes App - Setting up Database and Web Server (Lesson 1)

hey code crew welcome to the full stack ios notes app where you'll not only be building the ios app this time but you'll also be implementing the database and the api now i don't want to reveal too much because this app series is going to be led by a guest teacher who will walk you through how everything works his name is ali and he's been working with us here at code with chris for the last couple of months i'll let him introduce himself hey guys i'm ali and i'll be showing how to make this really cool notes app so let's just get into it i'll start by showing you the interface and i'll explain the different parts of the apps once we get there so to begin with we have our xcode project which is just the iphone app itself and i can add a new note so i can write new note this is the first note and i can save that and i can add multiple notes as well so this is the second note and second note and it'll save the date as well with the title and the actual note itself and this is all being saved to a database so if i restart my app so if i just go in and close my app and open it again we can see the notes are still there because it's saved to a database and not the device itself and i can also update notes if i click on the note i can say this is second note updated and if i save that it'll show that this is the second note which has been updated and i can also delete notes just click the delete button and i'll delete notes now the cool thing about this is the actual database is not core data or realm which is what you would expect for an iphone app in fact we're saving to mongodb and how that works is i actually have a server running and this server is running on my machine and what happens is the iphone contacts the server to save the data and then the server saves the data to the database and tells the iphone that it's saved and i can show you how this works in real time if i make a new note new note test and if i save that it'll show on my iphone and then if i go to my terminal if i use the and i'll show you how to actually how this actually works later on but i'll just show you the actual data which is being saved in the database if i say show dbs use new db db.datas.find you can see that this note has been saved on my local machine which is mongodb and i got the note here i got the title and have the date so i'll show you all how the different parts work and watch you get started with installing the actual dependencies like mongodb and once we've got that done we can start working on our actual app all right so before we start working on our actual app i just want to take a quick second to look at how the architecture and data flow of our apple look like so our app is going to have two main routes and routes are just functions so for example we're gonna have a route or a function to send something a database we're gonna have a route or a function to retrieve something from the database and how this is gonna work is that we're gonna have our iphone which uses xcode and lmlfire and that's going to send what the user has entered in their text field to the server the server which is made with node.js express.js and mongoose will then process that data and save it to the database which is mongodb then the database will tell the server if it's saved or not and if there were any errors and the server will tell the iphone if it's saved or not and if there were any errors and that's all the first route is and that allows us to save something to our database and the next route we're going to be working on is retrieving something from a database so we want to be able to see all the entries in our database and display on the iphone so the way that's going to work is that we're going to have our iphone which is made with xcode and ammo fire again and that's going to actually ask the server for the information now so last time it was sending data but this time it's just asking the server to send everything back so then our server is going to look through the database and it's going to take out all the entries and once it has the entries it's going to send it back to our iphone and then our iphone will refresh itself and we're going to see the new data that we've entered in our database so those are the two main routes sending something and retrieving something but we also need to make routes for updating and deleting but those routes are more or less just variations of these two routes so once we have these two routes down it shouldn't be too hard to get those working as well all right and now the last thing i want to do before we start actually working on some code is just giving you a quick lesson plan of what the different things we're going to do in this video series are the first thing we want to do is actually install all the dependencies for our project like mongodb node.js expressjs and mongoose and after that's done right you can start building our server so the first half we're actually going to start writing the code to build our server and make sure our server works then what we're going to do is we're going to test our server using an app called postman so that just allows us to test our server without having to make our iphone app first so once we know our server works successfully and we can update items delete items create items and fetch all items from the database then we'll actually start working on our xcode project and in our xcode project we're actually going to be making our app and making our app can communicate with the server and we're going to use alamo fire to make the app communicate with the server and make sure that the user then can add entries update entries delete entries and fetch entries and once those two things are done our app should be complete and we'll have a final product of the finished notes app so before we actually start writing any code i just want to take a quick second to look at the different tools we're going to be using and what they are so the first thing is our database which is mongodb and mongodb it says is a cross-platform document oriented database program and it uses json with optional optional schemas so what that allows us to do is save our data in a format which is called json and that's the exact same format as when you work with the api for example and you fetch some data it'll return it back in json so what this means is that when we actually want to access our data from the database it'll make it super easy to be able to access and work with the data we saved in the database and the other reason mongodb is super popular is because it's really light it's easy to get started with so that's mongodb which is our database and the next thing is node.js and what node.js is is open source cross-platform javascript runtime environment which allows us to execute javascript outside of a browser and that's really what node.js does so usually for example if you go to inspect you can actually run javascript inside your browser so i can do like console.log hello and it says hello right there so i've actually ran javascript inside my browser but to run javascript outside of your browser you actually need something called node.js this will allow us to run javascript on our machine to create a server then our iphone can interact with that javascript we wrote to send and receive data so that's all that node.js is it's just a program that allows us to run javascript outside of the browser and to actually create the server we're going to use express.js and what express.js is is a web application framework for nodejs so express runs inside of node so node runs the javascript and express is what we actually use to create the server so we need to create routes or functions for example to add things fetch things update things and delete things and the way we're going to define those functions and the data they take in and give back is using express.js so express.js will make it super easy for us to actually create those four functions and create our server and the last thing we're going to use is called mongoose and if you go the actual documentation for mongoose it says mongoose provides a straightforward schema based solution to model your application data and that's really what mongoose does it just makes it super easy for us to first create our schema or actually define what our data looks like so for example our note has a title a date and a note so it makes it super easy for us to define that object and also makes it super easy for us to interact with our mongodb database in our actual node.js file so without mongoose it's a bit harder to save data or update or delete data but using mongoose it's super easy to interact with our database all right now that we've got that done let's actually start working on some code all right now let's get started actually installing the different stuff like mongodb and node.js and as we're installing it i'll tell you what it actually does and how it works and why people use it but before we start installing any of those things we need to install something called homebrew so if you just google homebrew it says homebrew is a free open source software package management system that simplifies the installation of software on mac os and that's really what homebrew is it just makes it way easier for us to install different things like mongodb and node.js and different software packages like those so instead we have to unzip files run installers all that stuff you can install packages with a single line of code so if we go to the homebrew website you'll see it says right here install homebrew and there's one line of code so all you have to do is copy this line of code and then in your search bar just search for terminal and click open and once your terminals open you can simply paste that one line of code and enter your password and then click enter and it'll say installing and downloading homebrew so just give it a quick second and it should work and it'll tell you installation successful so now we know that homebrew is installed we can install different things like mongodb and node.js with a single line of code alright now that we've installed homebrew we can start installing things like mongodb so if you just google install mongodb homebrew and you click on the first link it'll say install mac install mongodb command edition on mac os so just click that and it gives you the instructions here but before we start installing let's just get into why people actually use mongodb and what it is well mongodb is a database like you just like you have core data or any other type of database but what it does it stores data in a json format so if you ever worked at the rest api you know returns back json so mongodb stores data in the exact same format as that and what that means is super easy to work with on websites because websites use javascript and json is inherently javascript and the other thing is mongodb is super light and super easy to get running so those are the three main reasons people use mongodb it's super popular as well so if we just scroll down we can see it says brewtap mongodb brew so let's copy this line of code and we'll open our terminal again so we just open our terminal and we run that one line of code and what this does it tells homebrew to install the actual package of mongodb and once homebrew knows what to install then we actually install it using this line of code brew install mongodb community at 4.2 so run that one line of code give it a quick second and it's installed so now that we've got both mongodb and homer installed the next thing we have to install is something called node.js and what node.js is it's just an engine that allows us to run javascript so if you just google node.js it tells us node.js is an open source cross-platform javascript runtime environment that executes javascript code outside of a web browser so normally if we're running javascript it's usually in a web browser or a website but what node.js allows us to do is run javascript outside of a web browser which means we can use it for various different things for example you can make the server right now that we're gonna make you can also make like google home apps stuff like that you can make tons of things with node.js and all it really is is just the engine that allows us to run javascript so to get started on installing node.js is super simple so all we're going to do is open the terminal again and all we're going to type is is brew install node brew install node and once you click enter just give it a quick second it'll download and it's installed okay so now we've got both mongodb and node.js and if you want to test out that your nodejs has installed successfully all you have to do is type node-v and it says right here v14 and that we know we're on the 14th version and it's installed on our machine correctly so now that we've got both both mongodb and node.js installed let's actually start working on the app and start building the server all right so now looks like you start building a server but before we do that i just want to take a quick look at what text editor you should be using so when you're making iphone apps you only have one text editor or ide which is xcode but when you're making websites and web services there's a ton of different ones you can use the most common one is visual studio code which is what i'll be using and i recommend you to use as well you could also use any other ones you like like notepad plus plus but vs code is the most common one for software engineers who are web developing so that's one i'll be using as well you can just go to the website and download it for mac so once you've done that just make a new folder anywhere you want and just title it anything you like let's call it server for note app once you've done that you can just right click it and click services and open with vs code now this will actually open your folder in vs code so the first thing you want to do is you want to click the little button next to where it says your folder name it's a little file button which is new file and just type in server dot js and what that means is it'll make a new file which is a javascript file which is why it's called.js so once you've done that again right click server.js and click open in integrated terminal this will open a little terminal on the bottom where you can write commands the first thing we want to write is npm init and what npm is it's like cocoapods or swift package manager it just allows us to easily install other software packages and dependencies and what npm init does it actually creates a file that allows us to track what dependencies we're using and the version of it and actually means node package manager initializer so just run it and it'll take you to a quick through so you can click yes on the package name and if it says it can only be url friendly characters just call it server then versions fine 1.0 descriptions fine you don't need one entry point should be server.js testcommand you don't need one we're not making git repository for it now you don't need the keywords authors fine license is fine and yes and if you see on the top left i actually made a new file called package.json and this will allow us to keep track of what dependencies we're using and the versions of it now let's write another command on the bottom we're gonna write npm install express and it'll actually install the express.js file so we can use in our app same thing where i npm install mongoose and then i like to install mongoose on our app in our folder so we can use it as well so now let's go to our server.js file and we'll write you far or you could write const as well const express is equal to require and in brackets in a string write express and we're going to write cons to mongoose is equal to require mongoose and one more thing right const is equal to express with two round brackets and what that does it actually creates an express object so we can actually use express in our project so the first thing we're gonna write here is mongoose dot connect you're gonna write two round brackets and you're gonna make two quotation marks inside that and you're gonna write db dot slash slash local host slash new db and what this means is that we want mongoose to connect to mongodb which is running on our machine which is localhost and we want to go into the new db folder of that mongodb you can name this anything you want you don't have to name a new db you can call it mydb but what it is is just the database or the folder that all our data is going to be stored in so after that we're going to type mongoose.connection.once so once mongoose has made a connection we want to we want it to tell us that it's connected so we can write open so once the connection is open we want to call a function so you can write function two round brackets two curly brackets and inside the function you can just write console.log which is just javascript's version of print connected to database so what this means is once the connection is open this function will be called and what this function does is that it's going to print to our terminal that is connected to the database and we can after that we can write dot on and then we can say error and then this is going to call another function and this function actually takes in the error so then we can write console.log failed to connect plus error so what this means is if it's connected it'll say console.log or it'll tell us connect it to database and if there's an error the dot on function will be called and this function will be fired this function takes in an error and what's going to happen is going to print fail to connect and then it's going to print our error and if you want to make your code a bit cleaner instead of writing all these function keywords you can actually remove the function keyword and replace it with an arrow so now you can have two round brackets and then an arrow which is an equal sign and a right sharp bracket so equals and a right sharp bracket like that which will make the arrow and then your block of code and we can do the same thing right here remove the function keyword and then marry equals with a right sharp bracket and then this block of code and this makes a bit more sense it's gonna take in an error and then it's gonna shoot this function which is in this block of code and this function is gonna print fail to connect plus the error so now that mongoose either connects or it doesn't and it lets us know if it connected or not we can actually start working on the routes but before we do that we want to make something called a schema and what a schema is it's basically an object that holds all our data so if you ever worked with core data before you know that you define an entity so you give it a title and you give it what it wants to hold we have to do the same thing for for our schema so we have to tell mongodb exactly what a note object holds so for example a note holds a title it holds a note and it holds a date so we want to tell that it holds that thing and to save it in that format so to do that we're going to go back to our file directory on the top left again click that new file button and write note schema dot js and this will allow us to actually define a notes object so knows exactly what a notes object is and what data it holds so in this file we're going to write var mongoose is equal to require mongoose just like we did in the last server file and we're going to write bar schema with a capital s is equal to is equal to mongoose dot and i'll actually give you a list of things you can write we're gonna write mongoose dot schema so once we've done that we can actually define a new schema or a new data object so we're going to say var note is equal to new schema and you can write two round brackets and two curly brackets inside that so now let's think what a note has so it has a title and the title is going to be a string a note also has a date which is a string and it has the note itself which is a string so now we've got that now knows what a note object is so it knows that a note holds a title a date and a note so the next thing we're going to do is we're going to export this so that the server can actually see this schema because right now only the schema is only held in this file node schema and we want to transfer that file to the server so what we're going to do is write const data is equal to mongoose dot model and we're gonna write two curly two round brackets and we're just going to call it data and what is the data well it's the note we made right so we can just write after data put a comma and write note so what this does it creates a data object and that is actually a note schema the last thing we're going to do is we're going to type module exports equal to data and what this allows us to do is that it sends where it allows us to access the note schema from the server.js file so right now the note schema is only available to this file so using the exports keyword we're able to send this to the server.js file so if we go into server.js let's type in far data is equal to require just like how we had far express or constexpress is equal to require express but this time we're going to write dot slash note schema so what the dot means is it tells the computer to look in the same folder as this file so if you go back here our file is actually located in the server for note app folder right so we're telling this file to look in the same folder which is this folder and look for the note schema file which is right here so that's how it knows where to look so if you save both of those now and you can actually save by going to file and clicking save or you can click command s now server.js has access to the schema so we can start creating and saving notes all right now it's like you start working on aki creating saving updating and deleting some data so let's think for a second we're going to have a route to create a note we're also gonna have a route to delete it out we're gonna have a route to update a note and we're gonna have a route to fetch all notes so let's think for a second when we're creating a note are we sending something to the server or are we retrieving something from the server well we're sending the note and the data we want to save to the database so when we're sending something to the server we call that a post request because you're posting something to the server same with delete are we actually taking something from the server or are we sending something to the server well we're sending the note we want to delete to the database so we're going to write post request and what about updating a note are we sending something to the database or the server yeah we're sending the new note right so again it's a post request and finally we have fetch all notes so are we sending anything to the database we're not really because what the server is going to do when we're fetching is going to go through the database and send the notes back to us so this actually called a get request because we're getting something from the server so look back on the first one which is creating a note so we can type app and the reason we type app is because we imported the express object and we saved it to the app variable so write app.post because it's a post request and then we're going to write in the brackets we're going to write slash create because for example if you go to google.com search it actually shows you all the stuff related to searches right so if we go to our app slash create we want to go to the part of our website which creates a note and we're gonna call a function right so you can get the two round brackets the arrow and the two curly brackets but this function actually takes in a request and a response so what a request is it's actually data that the iphone is sending us so for example what's going to be in the request object well we're going to hold the note we're going to hold the title and we're going to hold the date and that's all the data the iphone is going to send us and the response object is what we're sending back for example when we're sending all the notes back we're going to send those notes in the response object but that'll be more clear once i get started working with it so the first part we want to create a new data object so the first part we want to create a new notes object so we can write var note is equal to new data right and the reason we write data is because we imported it as data when we wrote data is equal to require note schema and then two round brackets and two curly brackets so if we go back to our schema a note holds a title a date and a note so we have to give it the exact same data so it's going to hold a note it's going to hold the title and it's going to hold a date now to actually get what the iphone is sending us it's going to be stored in the request object so we're going to write request dot get and then we're going to write note same for title we're going to write requests taught get title and finally same for date we're going to write request dot date request i'll get and we're going to write date and the reason we write note title and date is because when the iphone sends us this information it's going to package the note and on the top of the note information it's going to tell us that it's a note and on top of the title information it's going to tell us it's in title this will be more clear once you actually start sending requests from the iphone and this is a list so after every note or after every line you want to add a comma because it's actually an object that's a list so you want to add a comma after every line so once we've done that we've actually created a note object and that object will hold the information the iphone sends us so now what we're going to do is we're going to write data or we can write note dot save and that'll actually save it to databases that simple but we want to know if it's successfully saved or not so we can write dot then [Music] and what dot then does is once it's saved this this dot then function will be called and the dot then function will actually call another function so we're going to use our function notation to create a function and in this we're going to say if we're going to make an if statement if note dot is new it's equal equal to false we're going to say console dot log saved data so what the is new function tells us is that if the data is stored both on the server and the database it'll return false so what does that mean well if the note is stored on both the server and the database we know that it's saved to the database but if is new is equal to true that means the data is only on the server which means it failed to save in the database so if it's false we're going to say save data and then we can write else so if we save data the opposite of that is not saving the data so we can write console.log failed to save data and one more thing in the is new is equal to false part we actually want to tell the iphone that we received the request so we're going to say res dot send saved data so this will tell the iphone that we successfully got the data and we saved it and that's all this route is is done so now we can actually start testing this route and see if it actually works but before we do that we actually have to give our app a url because right now there's no url we can type in our search browser or the iphone can ping right to access the server so to do that we're going to type the var server is equal to anyway app.listen and you get the first argument you're going to give it is 8081 and the second argument is a string and this is actually your network ip address so if you open settings or system preferences and you go into network and you use click advanced on the bottom right you see that it gives you the ipv4 address so just copy the ipv4 address and close that and paste it into the server and what this means is any device on your network so your iphone your physical iphone any laptops any computers that are using your internet connection or your computer network will be able to access the server and the last thing we want to do is we want to call a function one is running right so we can use our arrow notation and we can just say console dot log server is running all right to get to our server all you have to do is type and i can write it as a comment here you're going to type http colon slash slash your ipv4 address which is your string right here colon 8081 slash create and the create comes from this route we created with the slash create so if any website or if any service pings up this address it'll go to the create route so we can actually test this now so if i open my terminal using right click in the server and clicking open an integrated terminal we can just type node server.js and we actually get this big error so this looks kind of intimidating at first but if you read it it says server is running at the beginning so that was the message we wrote right up here which was server is running and after that it says field to connect network error so this was super helpful because remembering wrote dot on error and it says fail to connect plus error well the field the connect string is right there and then the error is this big dump that we got right here so what this really means is that we haven't started our client and to do that what we do is we go back to chrome and if you remember the website where we where we installed mongodb from homebrew remember we had to use the brew install command if we scroll down here we see brew services start mongodb community 4.2 so just copy that and open terminal and paste that line right there and now it says successfully started community and now our is running our mongodb is running so what this error said was that mongoose couldn't connect to mongodb but now that we've turned on mongodb if i exit the compiler or if i exit the terminal using control c and i type node server.js this time it should work successfully and it does you see server is running and connected to database so now we can actually test our server using something called postman so if you just type postman and click the first link and what postman is is that it allows us to test our routes like our create and delete route but we don't actually have to make a whole iphone app first because what if we create the whole app and it's and it works on the xcode side but we find out that our server doesn't work for some reason so what postman allow us to do is send requests and then we can debug our app to see if there's any problems so if you scroll to the very bottom it says download the app and you can click the download button there so once you've downloaded and installed it just open postman and click the new button on the top left and once you click the new button click the top left button which is get request or request create a basic request and you can call this whatever you want you can type let's say create route test and then you have to give it a folder so i've already created a folder called notes app demo where you can just create one here so just call it notes app just save that and it's saved in the folder and click save so now that we have to go now that we've got that let's go back into vs code and let's take a look at our address i gave at the bottom here so the address we want to go to and you can click that you can type the address right in the middle here where it says enter request url you can type http dot colon slash slash 192.168.0.117 and this might not be the same for you it's just the ipv4 address you copied earlier and then you're going to write colon 8081 which is the port and then you're going to write slash create and the reason you write slash create is because we're accessing the create row so when we're going to access the delete route later on we're just going to change the slash create to slash delete but right now we're doing the slash create row and the next thing you want to do is you want to change this get to a post because remember we're sending something to the server and in the server says app.post so you want to change that to a post request and now what you're going to do is you're going to go down on the headers so click the headers and there's a key and a value so you can name the header key note and we can just copy paste it from here just call that note and the next one is title and the last one is date and these have to match exactly what we told the server to look for because if i write notes the server is only looking for n-o-t-e so if i send data with the title n-o-t-e-s the server doesn't know what to look for so you have to make sure this exactly matches what we told the server to look for and now we can just write test test and test and these are just the values the iphone's going to send so later on it's actually going to send a date it's going to send a title the user wrote and it's going to send the note itself and now we know the server is running because it gave us the message which told us the server is running and is connected so now that we've got that if we just click the send button it should save the data so we click send and we get a message right here says save data and also our server tells us saved data so now that we want to verify that it actually saved so open your terminal and type in and this will open the client so you can write commands and interact with your database so you can type in the command show dbs and this will give you a bunch of dbs or databases which is what is the one that we're using well we're using new db because that's what we defined when we wrote mongoose.connect so type use new db and it says switch to db to new db now we can write show collections and the only collection we have is datas which means we have a bunch of data objects remember we write define data here well we have a bunch of these data objects which is why it's called datas so we can say db.datas dot find with two round brackets so db database dot datas which is when you wrote show collections it'll tell you data's that's where we get data and dot fine with two round brackets if i enter this command you can actually see that we've saved a test test and test which is exactly what we sent here so we can send another one so we can write we can write another note like for example note this is the first note title new note and date let's say monday july 17 right so we send that it says saved here it says saved here so we know it's saved again now we can use we can type show collections it will say data so we write db.datas dot find two round brackets and again you can see the new notes in the database and it says this is the first note new note and monday july 17th so now that we know we can save data using the create route we have to implement three more routes so we have to implement a delete route which is again a post request an update route and a fetch all notes route so let's get started working on those all right now let's get started working on the fetch row and the fetch row is super easy so underneath the create route we can make the fetch file so let's type app dot get because this time the server is going to be sending the iphone something so it's a get request and the route we want to ping is fetch and obviously every route has a request and a response and use your error notation to create a function and this one's really easy we can write data capital d dot find and we're actually going to give it two curly brackets so this means we want to find everything in the database if we want to find just for example not in this app but if you had a certain app with let's say employees or companies and you only want to find employees well you would tell it that you only want to find employees but since we're using nothing since we're entering nothing in the brackets it knows that has to find everything and then we write dot then and then once dot dot then actually has another function inside of it so use your function notation and we can call this a whole database or we can just say like database db items so then we can write res dot send and db items not as a string but as the actual variable db items and that's all the fetch row is so what it does is when we ping and you should add a slash fetch right there what it does is when we go to the slash fetch route the the server looks to the database finds every object and then returns it using the root response so it gives us a response with every item in the database so if we save this and we restart our server so again to restart your server you click option c and you write node server it'll tell us it worked so if we go to the address which was http dot slash slash one nine and then just look at the address you created which was 192.168.0.117 8081 fetch this should actually show us every item in the database but this time i'm not using the client instead i'm using my web browser because this is basically just a website so this should work when i click enter and there it is now i'm in my web browser but i can still see the items i created i had test test and this is the first note new note monday july 17 which is the exact same thing is what the client told us right here and right here but this time i'm on a website using a web browser so the iphone is going to ping the website like the browser did to get all this data back so now let's create the delete route so i'm right app.post and the route is going to be slash delete and every route always takes in a wreck and a res and then user function notation there so what we're gonna do is we're gonna write data dot find and then if you just scroll down you can see find one and remove you're gonna give it two round brackets and two curly brackets inside that now the way we're going to identify each note is using the id property so mongodb actually gives the note a unique id so we can say that i want to delete this note with this id and i know i'm going to delete exactly this note so there's no overlap between ids so for example notes can have the same title so if i say i want to delete note with this title i'll actually end up deleting multiple notes but if i say i want to delete note with this object id i know i'm only deleting this note so we can say underscore id is equal to rec dot get id all right and now if that fails we want another function to be called so and this function is going to take in an error and then use your arrow notation right there and then you can say console.log failed and then you can tell it the error now once that's done you can write at the end you can write res dot send and delete it and this route should work so we just save it and i control cra node server and news i just restarted my server so it's updated now alright so now let's look at the note i want to delete so if i use my fetch row i can see i have this note right here and has this id so i'll copy this id and i'll go into postman i'll create a new request and i'll call this delete test that's the post request and if you just write http you'll have a history of the last route we use so you can just change that from create to delete and now in the header give it the id and paste that id and now click send it says deleted here so when i refresh this i won't see this anymore and there it is it's gone so we know we've successfully deleted a note so so far we can create notes we can fetch all the notes we have in the database and we can delete notes so the last thing we want to work on now is updating a note all right now that we've got adding fetching and deleting let's work on the last thing which is updating so to update a note we're going to make a post request and the reason we're making a post request is because we're sending something to database and the server where because we're sending the id and we're going to send the new node data so i'm going to write app.post and i'm going to name the route slash update and we're always going to have the rec and the res and then this is going to fire off a different function so let's put arrows and two curly brackets let's just make that big okay so now we've got that just like we had find one and remove when we're deleting something we also have find one and update so we're going to write data dot find one and update right there find by id and update but there's also one called find one and update either one works i'm gonna be using find one and update so i'm right to round brackets and inside that i'm gonna write a curly bracket comma curly bracket and i'm going to have my error function so just write err arrow and the two curly brackets so the first curly bracket is the first object which specifies the object we want to update so in this case we're going to put the id in the first curly bracket in the second curly bracket we're sending our new data so that's going to be the updated note and finally i just have my error function which is going to fire something off if something goes wrong let's just start working on them so in the first bracket in the first curly brackets i'm going to write id it's equal to rec.get id just like how we did for the delete route we have to specify the id and we're going to send the id and now i'm going to write note in the second curly bracket i'll write note rec dot get note just like how i did in the create route so you can just copy paste that and change this to title rec.get title and finally date is rec.getdate and it gives me an error and the reasons give me error is because i don't have commas after every line so make sure you put commas after every line an inner error function raises current console dot log failed to update plus err so say fail to update and it's going to give me the error so i can fix it if it goes wrong and finally i'm going to write res.send so that's where i updated so this is going to send back some data it's going to send the message updated to the iphone so the iphone knows the server has successfully done its thing and this should be enough so let's just save that and now what i'm gonna do is i'm gonna go to my server.js i'm gonna click open integrated terminal and i'm gonna write node server dot js and actually run into an error it says address already in use 192.168.0117 colon881 and what that means is i already have a server running so i try to run this server on the same address or the same url as my previous server so to fix that all i have to do is go on the top right here this little drop down menu go to the one that says node click on that and you can see the server is already running so all i have to do to turn off the server is click option c once i click option c the server closes and i can go back to my original window and i could write node server.js and it'll work so if you run into that problem make sure that all your other servers are closed because you can't run two servers on the same web address so now we've got that running i'll go to my fetch route and see this is my data right here so now let's see using postman let's see if this actually works so i'm going to go to postman i'm going to create a new route and call this update route demo and we're going to change that to a post request the url is going to be the same as all the other ones we're just going to change this from a delete create or fetch to update and now we're going to pass in some headers so we're going to pass an id we're going to pass in a title we're going to pass in a date and we're going to pass in a note so the id is the id of the note we want to update for example i want to update the second note so i'm just going to copy this id and i'll just paste it in here now the title i just want to call this updated how to change everything to update so we know it's updated and i'm going to run my request so i'm going to click send and it says update it down here so if i refresh this page this note should have turned into updated but this note should stay the exact same so i refresh and so if i send that i actually run into an error so i click send and you can see it's not updating over here and if i go back into my file as you can see it's not updating over here because the data is still the same so i go back into my file in the icc it said failed to update no so what does that mean well it means that it doesn't know what i'm trying to update and the reason that's happening is because i told the id is equal to rec.getid but when in fact it's actually called underscore id because if we look here it's called underscore id so the thing is you have to make sure your keys and your values so your keys are id note title and also the values you're getting from your server or your iphone which is going to be id note date title which is the same data right here we have to make sure that these are case sensitive and exactly the same because even if you're just missing like a small semicolon or a small underscore your whole thing won't work so i'm going to save this and i'm going to restart it so again click option c to turn off your server and the click node server and now it should work so i'll go back here i'll look at my fetch row and i see my data is right here so what i'm going to do now is go to postman and try to send the same request again and now it says updated and i refresh it and this time is updated so the problem was it wasn't the exact same i was missing the underscore and if you miss a small detail like that when you're working with your database you can run into some problems but now that we're done the actual server side of things so we have our create read update and destroy routes now we can start working our xcode and making our xcode app interact with this alright so in this video you've set up the web server and database and configured the endpoints that are ready for the ios app to hit in the next video you're going to start implementing the notes ios app so that it's going to start sending and receiving data from these endpoints by the way this is elise first time teaching on youtube so show him some appreciation and support by leaving a comment below and giving him a thumbs up let him know if this video helped you or if you want to see more ios full stack development or just give them some thanks i remember in my early days that feedback from you guys was extra crucial to help me carry on teaching so let's show ali some love all right i'll see you in the next lesson

Channel: CodeWithChris

Views: 17,633

Keywords: full stack ios developer, ios backend tutorial, full stack app development, node.js, nodejs, expressjs, express, express.js, mongodb, mongo database, ios node app, xcode nodejs, node.js swift, ios node js server, ios rest api swift, ios app with node backend, ios api tutorial, mongodb ios swift, mongodb mobile, node js swift tutorial, ios app node.js backend, node js mobile app tutorial, ios notes app

Id: vKCdVAg5h40

Length: 54min 42sec (3282 seconds)

Published: Thu Aug 06 2020

Reddit Comments

[u/coderharsh]

Sir i am a big fan of yours, i am coding in swift ui and i am seriously not able to solve a problem with firebase firestore ..my firebase is connected but while adding pod of cloud firestore and installing it further it is giving me the transport layer security problems or grpc framework not found and many more errors are there , sir kindly help me plzzz i beg u.