All right.
So now that we've covered all of the HTTP requests for the /articles route, I just wanted
to quickly show you something that Express lets us do. So at the moment
if you look at our code, we've got a number of methods are targeting the same route namely
/articles.
We've got a get method, a post method as well as a delete method.
Now if you have a look in the Express documentation and if you go to the guide on routing, you can see
that there's the route method which is what we've been using. But there's also something that makes our
lives a little bit easier so that we don't have to type in the same route every single time.
And that is the app.route method and this allows you to create changeable route handlers by using
app.route and then you use the path as the same location so that you reduce redundancy and typos
which is our aim as always when we're refactoring our code and maintaining our code.
So they give you a really good example on how you would use this.
You start off by calling the app.route method and you specify the particular path that you want
to target and then you simply chain on method like .get, .post, .put et cetera and they all target
the same route.
Now it's a bit confusing where
I showed you this right in the beginning but now that we've gotten used to app.get, app.post etc.
it's a good time to start using a more succinct way of doing this.
So let's go ahead and go into Atom and change our current code to use these changeable route handlers.
So we're going to start off by saying app.route and then in here we specify the route that we want
all of our subsequent method to target.
So we start off with /articles.
Make sure that I don't have any typos.
And then afterwards is where we chain our methods.
So it would look something like this:
.get .post and we've also got a .delete.
So and then this is where the method ends and that's the entire method without obviously any content
in these.
So now we're going to take our callback function the entirety of it and transplant it inside this new
chained get method.
So if you click on the left or on the right of the opening bracket of that callback function it will
highlight to you the closing bracket and we're going to take everything including that closing bracket
and the callback function but excluding that last closing parentheses and semicolon because that belongs
to the get method.
This particular parentheses matches with this one and that semicolon says that that is the end of that
get method.
Now we in this case don't actually want our get method to end because we want it to continue to be chained
by the post and delete methods so that for all requests targeting our articles route we will check to
see if it's a GET or POST or a DELETE request and then call what's inside these parentheses correspondingly.
So now that you've checked that you've selected the right parts
and this is really easy to make a typo here,
so make sure you've gone right down to the bottom last closing brace and you've excluded any parentheses
and semicolons at the end here and we're going to cut that and paste it into our get method. Snd then
we're going to do the same with our post method,
so our app.post.
So we're going to check where this opening brace closes and then we're gonna take all of that and put
it into our chained post method and we're gonna do the same with our delete as well
so all the way from here up to here. Now once we have pasted that in there all that you should see remaining
down here are a closing parentheses and a semicolon.
And now we have removed that callback method entirely.
So now it's time to go and separate out our code because at the moment it's a bit of a mumbo jumbo.
So usually when you use chainable route handlers it tends to be structured like this.
So you would have app.route specifying the route on a single line and then for every subsequent chained
method they go on separate lines so that you can see what's going on easily.
So now we're going to put the get onto another line,
we're going to put the post onto another line and we're gonna put the delete onto another line as well.
So each of these lines start out with a dot to show that they are chained methods
and then at the very end do we actually have a closing parentheses and a semicolon. For all of the
other chain methods say the post or the get, they don't have a semicolon because we don't yet want it
to end.
We want it to be
.get, .post and .delete.
So now we can safely delete all of this and we have successfully refactored our code so that we now
have a single route that targets /articles and we've got a get method, a post method and
a delete method all chained together. Now chaining methods together like this isn't actually new to us
because when we were using JQuery we were writing a lot of change methods. We'll say something like document.
getElementById and then once you've gotten that element then append child Node or do something
else with it.
And very often when we're writing JQuery there's lots and lots of chain together methods that make
your code look like a huge chain.
And so if you wanted to learn a little bit more about this then I'll link to this particular article on
Medium which is quite well-written and it talks you through some of this method chaining so you can
get a bit more background on this.
But back to our code
if you have any errors at all make sure that you've got all these syntax written in exactly the same
way as you see on screen right now.
And it's very very easy to mess up a semicolon or delete a closing bracket.
There's just so many to manage here.
So if you run your server right now you shouldn't be getting any errors and all of the previous requests
that we did through Postman should still work.
So go ahead and test that and if you have any sort of error logs inside the terminal or inside Postman
and just be sure to come back here and just check that your code matches with my code.