learn how to be good with routes
const express = require('express');
const app = express();
app.get("/hello", function(req, res){
res.send("Hello!");
});
app.get("/", function(req, res){
res.send("Welcome to my website!");
});
// app.get("/books/:bookid", function(req, res){ As you can see, Route parameters are specified by the :
// res.send("You are now looking at a book");
// });
app.get("/books/:bookid", function(req, res){
res.send("You are now looking at book " + req.params.bookid); //Keep in mind the part after the "params" is case sensitive, so if your parameter is BigBootyJudy, make sure the capital letters are in there.
});
app.get("*", function(req, res){
res.send("You went to a route that doesn't exist. Shame on you.");
});
app.listen(3000, () => console.log('Example app listening on port 3000!'));
I'm going to show you one more route that will prove useful in your website making career. This is called the 404 route. If you dont know, a 404 error is an error you get when you go to a webpage that doesn't exist. We are going to make something like this. Whenever the user goes to a route that doesnt exist and we havent defined in the code, it will show a message or error.
Do this by making a route with the first parameter being a "*". This is the route you use. Now setup your callback function and add any message you want to send.
Check it out. See if it works. Assuming you used the same code I provided below it does. But now let's analyze a particular situation. What if we move the 404 route code to be in front of all of the other routes? Try it out and see what happens when you go to those routes.
As you can see, it will just show the 404 message no matter what route you go to. That is because, the way routes work, when you go to a route, it will go through each route in order to see which route matches. In this case, * matches with any route, so it doesnt need to go down the list to /hello or something. Likewise if for some reason we had 2 /hello routes, it would only run the /hello route that is before it because it doesnt need to run the one behind it anymore since it found a match. Hopefully that isn't confusing, it's pretty simple, but the point is: have your 404 route at the end of all of your other routes.
And thats that. So now we can look at route parameters.
Route parameters make your application even more dynamic. You can setup routes like /books/[id], so then you could provide a different book id everytime but still get the same webpage, except with the book associated with that id. Here's an example. If we go to onlinereading.org/books/1234214, it will look for book 1234214 and then load it onto that page. Why set up a system like this? Well, it will become apparent when you start using it, but it basically means that you dont have to make a route for every single book(in this example we are of course dealing with books) in your code. That would be INSANE. Especially if you had 1000s of books. Having one route that can deal with all of the books is much more convienient.
Ok, so how do we do this? First, setup a route. Usually you want to setup your route parameter in what I call a "subroute". Meaning, the /books part in our example wont change, but the /[id] can be anything. Looks below to see how you would write that route code.
Now, sometime in the future we can grab that id from the url and then use it to load an actual book from a database. The database will store the thousands of id's. It's all really sexy. But for now, we are going to just send the user the id parameter we got from the url. To even take the parameters, we can access them in the req object. As I said before, the req object stores all of the route data. Included in that is all of the route parameters. Look below to see how I accessed the route object and printed out the id when the user loaded the route. Awesome. Your webpage is now dynamic because the code is the same, but the webpage changes what it shows you everytime just depending on the parameters in the url.
If you have any questions or edits I can add to this, leave a comment here or on my video.
Video: