Transcript from the "Exercise 2" Lesson
>> Scott Moss: Now you notice there's a couple other folders in here, we have this client folder, you will not be working in a client folder. This is just like a static website that is like doing some crud, it's doing some crud on the resource. But you will be working in the server folder, mainly in server.js.
[00:00:22] There's a lot of stuff going on here.
>> Scott Moss: The first thing it says is, make this work. [LAUGH] But, as you can see, you're gonna get a whole bunch of errors, and you gotta figure that stuff out. But I'm also doing some new things in here, and I'm telling you what I'm doing.
[00:00:36] So before, when we had the serve.image.html, we had to manually read the file already, the rest.sendfile. Express is smart enough to know that you already wanna do that. So it ships with this built in middleware called express.static. Which takes in a path or directory, and any request that comes to that directory it will automatically serve it as a static asset and it knows what mime type to set it to based on the extension in the file name.
[00:01:05] Not only will it do that. But it will also assume that, on the root of the directory that you give it. There exists an index.html. And if it does exist, it will automatically serve that on a git request of the root. So we don't have to set up a root route anymore to send back an index.html file.
[00:01:21] It should automatically do it. Yes.
>> Speaker 2: So you're saying when we set that up since we passed in client it then maps all of the client HTML files to the same path that they are set up in that folder?
>> Scott Moss: Not all the HTML files. It specifically looks for a file with a name called index.html.
[00:01:45] If it sees the request for that, it will automatically serve that on a [INAUDIBLE].
>> Speaker 2: So it just sets up that one round.
>> Scott Moss: Yeah. In HTML. Yeah. Just that one. Not all of them. So if you have like multiple templates in there.
>> Speaker 2: It's only going to do the first one.
>> Scott Moss: Yeah.
>> Speaker 2: And the index, right.
>> Scott Moss: Yeah, yeah. It'll only do the index route. You still have to set up the other ones.
>> Scott Moss: So this is a quick introduction into setting up global middleware. So if you use this method called app.use, it allows you pass into middleware function.
[00:02:14] And then our function will just be executed in the order that it was registered. So lets say this server gets a request, lets say we do a request for the loop. What's gonna happen is that request gonna run through these three functions first. And then to whatever functions you define underneath it.
[00:02:32] Cuz this is middleware, so this function was registered first. Express.static. So our request gets run through this first and once that is done, it will run through this middleware next. Once that's done, it'll run through this middleware next. And then it's gonna run through the functions that you're gonna make down here.
[00:02:50] So express.static is gonna serve our stuff for us. BodyParser, I left some comments there. It's just gonna make it possible for us to serve, or to post JSON to its server. By default express doesn't know how to handle JSON. So we need to figure it out ourselves or we can use this middleware called bodyParser which will make it easy for us.
[00:03:09] And it's going to attach what ever we post to the server is gonna be available on request.body. So inside of those callback functions on the routes if you just canceled the log request.body, you'll get the object that you posted or put to the server with this malware. And then down below you'll see what you have to do so you need to make rest routes to from crud on the lines.
[00:03:36] So you need to make all those routes in the blueprint that we just defined here, so if you count, there's five of them there. There's a route to get all the lions, there's a route to get one lion, there's a route to create a lion, update a lion and delete a lion.
[00:03:50] So you really have five routes. The servers already there, it's already listening, it's already good to go.
>> Scott Moss: So let's go ahead and start it so we can see what it looks like. Oops, I didn't set that up.
>> Scott Moss: So if you just run it and you open it up, you'll get this page right here.
[00:04:19] It just is a little form that says Lions. You could type in a name of lion, a pride of a lion.
>> Scott Moss: The homie. Can't type. And then the age of a lion and then the gender of a lion. And if you hit submit, let's look at the console so you can see this I want you to see what happens.
[00:04:41] If I hit submit it's gonna error out because you didn't define those routes yet. Like tried to post this but got a 404. It's also getting an error right here token C. That's like a JSON error because it's trying to parse in JSON that doesn't exist so that's why it's freaking out.
[00:04:57] Because when this page loads up it doesn't git request for all the lions, and that doesn't exist either. So it's still breaking. So we need you to find those routes. Once you found all those routes working, when you come in here, this is what you should see now.
[00:05:11] So I wanna checkout to the solution.
>> Speaker 2: I think you had a distraction.
>> Scott Moss: Thank you. Yeah I didn't see that.
>> Scott Moss: Cool so, the solution should look something like this. So if I start typing in some names here, classman, hey hey.
>> Scott Moss: Age, female, submit. It submits it.
[00:05:58] And if I refresh the page it should still be there because it's saved on the server, all right.
>> Speaker 2: And you could also test that by going to the routes, right? [CROSSTALK]
>> Scott Moss: Yep, so if I went to /lines I should see you've got one line in there.
[00:06:16] Right there.
>> Speaker 2: Wow.
>> Speaker 2: Where's the data being stored?
>> Scott Moss: So there's an array called Lions, right there. That's our database right there.
>> Speaker 2: Gotcha.
>> Scott Moss: Yeah, if I restart the server it's gone.