Loading
Lesson 26
Courses / Build a Web App like Twitter from Scratch Using HTML, CSS, JavaScript, Express, MySQL
Writing the Query to Create Entry in Express Server Endpoint

Video Transcript

Welcome to another lesson. We are going to implement the route to create a new entry using mySQL. Let's get started. Here in the file server.js we have the push to entries in line 67. This will no longer be a push, this will be a query to insert into the table entries. Let me show you some notes that I have on. We already did the select star from entries this way. How can we create a new entry? One way you could do that is using insert into values like I did before if you had seen. You could do this and you could specify the columns and then the values respectively. If you do it this way you would have to have a question mark like this. And then the second argument to the call to query would be an array of elements that correspond to each question mark that appears in the query. Another way of doing that is if you pass an actual object as a second argument like here. Line 17. If you have an object and you pass an object as a second argument that object will correspond to the question mark here and it will appear. If you try query.sql you can see that this is what you are going to get. That's another way. Let's try this way. Let's see if we can do that. Insert into entries set question mark and pass the object as a second argument. Let's try. Back to server.js. So we have the new entry here using the request body text. Then we do some validation here. It's important that we have this validation here. Of course that we could the database already has some validation. If you see the description of our table entries for text for example cannot be no. And the max is 256 characters. Of course we can leave all the validation to the database. But that's not a really good practice because querying the database might be expensive. Especially if it's being used all the time by millions of people. So what do you want to do is avoid any sort of database operation if you can. If we can do that by simply validating things before even making any kind of database query that's very good. So we still should have this here. Now that's great. Now this part is going to change. So let's do the change here. We are going to call on the connection dot query. What is the query here? Insert into name of the table entries. Right. Set question mark because the question mark will be the place holder for our things we want. And you can pass the actual object new entry here that contains the text field in this case. It could have any more other fields. And then we can have a callback here. And I think the first is the error. Let me see the notes. First is the error results and fields. Let's see what all those mean. Error results fields. I'm going to cost a lot. All of results and fields here as for the error. We're going to handle it in some way if error. So we're going to insert and I'm going to see something if there is an error. Let's think about this. If we messed up this query and it's an insert query. It's our fault. Now the client is going to ask for a new record to be created. Of course we messed up here in the server side. There's no way we can guess the way you can mitigate this. So we have no choice but to tell the user hey we cannot do it. There was a problem on our end. So actually I cannot think of any particular thing to do right now about return 500 in terms of error. So let's just that. REST dot status 500 send. And you can send a message here with the error. Failed to create new entry. Please try again later. How about that? And then that gives us time for the server side people to fix things and the user would be able to know that okay something's going on. I have to wait. I'll try it again later. If everything goes fine. Going to have these and I suspect that I think in the notes we can get the insert ID and everything here. Since we are creating a new record in the restful convention right there's something called rest. And usually when you have a post. Create a new record. You want to send back the new record feels including the ID that was generated by the database. And to do that we're going to have to set the new entry dot ID here. And to do that we do. I think we can use this insert ID. I'm not really sure but let's let's try it out. I'm going to console log this results ID results that ID insert ID sorry. And I'm going to comment this out for the time being and I'm not going to have this push and the sand here will be still be there. Let's try it out. Reload page here. I don't actually don't need to reload. There's something going on. Let's see what the problem is. I messed up. Oh I see. There's a syntax error. I put an error function instead because I already had a function here so I don't need either one we'll find. Okay let's try creating something. Looking at the server side we have service listening apart 3000. We got a console log results is an OK packet. Some information about the query I guess results ID to that's the result insert ID that's correct right because the last record was ID one. And we have. Fields undefined. Okay nothing feels. So I think we're good with. Let's see what we got from the response. XAS whatever that's correct. Let's get this going with the results that insert ID here. And we don't need to console log anymore. Remove lines 75 is the one now we have that object not object an array of object we don't need this anymore remove lines 19 through 32. Goodbye. Let's make sure it doesn't exist anywhere. I'm going to search case sensitive nowhere to be found. We got rid of that in memory kind of database fake simulation. Let's reload the application here we can see it's persistent. And if I look at the MySQL client and I do a select star. Let's do my SQL select. Select star from entries. Oh I have to say the database. Right. Something development dot. I can see that ID to is that as DS DS which confirms actually persisted the data in the database table entries. That's wonderful. Now we have we can kill the server. We restart it and reload the web page and the data is still there. The data is persisted. Let's test this error here. If we mess up the query. Save this. Try to create something. We got a 500 into a server error and we got the message here failed to create new enterprise style again later. Very good. The user knows what's going on and he can try again later after the server side people fix the problem. Let's revert the query to the correct implementation. So this is it. So this lesson we learn to modify our post slash entries endpoint to actually insert a new record into the database. We use the insert into entry set question mark new entry as an object as a second argument send a 500 if there is any problem with the query otherwise set the new ID using results or insert ID and send that new entry. Don't I would just want to close with pointing out that you don't want to be hard coding the new entry fields inside the query itself because of a risk of SQL injection. That is the user the client can type anything they want. They could type SQL statements, SQL queries that could be. That could be something like deleting your database or doing something really bad to your database. And that could be substituted here into the query. And that would be really bad. That's called SQL injection. You don't want that to avoid SQL injection always always use the question mark. And if you need to replace anything into the query do it as a separate thing. In this case, as a second argument, leave the question mark in the query itself, and it will handle that injection for you that problem of injection. With that, I'll see you in the next time. Thank you.
No comments yet (loading...)
No comments yet (loading...)
Did you like the lesson? 😆👍
Consider a donation to support our work: