- [Instructor] When creating endpoints,
it is really important
to make sure that you take into account handling errors
that might arise.
It's not only important for someone
who is using your application
but also when it comes to tracing the source
of the error.
Let's start in our editor around line 39
where we chained our routes together.
Since we don't have an existing error,
we can actually manually throw one.
Being able to do so is really helpful
when you're trying to make sure
you have thoroughly tested your endpoints.
In the get method,
go ahead and comment out the response.send.
Right below that, we're going to manually throw an error
by typing throw new
and then invoking the Error function.
Make sure you save that.
And by adding this throw new Error,
Express will catch the error
and provide additional information in the browser.
So let's go ahead and see what that looks like
in the browser.
If we head to localhost:3000/class
because we're using that chained route,
and we threw the error in the get,
so I have localhost:300/class.
I hit Enter and we now have an error
that is pointing to index.js at line 43.
So this is exactly where we threw that error.
Now, while this is helpful,
there are some other things that we can do
in order to give us some more detailed
and more custom error handling.
So let's take things up a notch
and let's utilize some built-in middleware to handle errors.
Back here in our editor,
we're going to create an error handling middleware function.
In terms of organization,
we want our custom error handling function
to be at the end of our routing file.
So it should be after the last function
and/or before the app.listen.
So let's go ahead and scroll down to the bottom
of our file here
and we're going to add it right above the app.listen.
The first thing that we'll need to do
is use app.use.
So app.use.
And the app.use method
is going to take some different arguments
or additional arguments I should say
than ones that we've used previously.
So we're going to add the parentheses
where we'll pass those arguments
and then I'm going to set up my arrow function first
before adding those in.
So this custom error handler takes four arguments.
Error, request, response and next.
And remember, these arguments
can be written in full or abbreviated.
So the new one for us is error.
For this example, I'm actually going
to abbreviate versus writing them out
in their full form as I've done in other routes
just to give you an example of both.
So here, the arguments are going to be err for error,
req for request,
res for response
and then we're actually going to fully type out next.
All right, and go ahead and save that.
Within our route handler function,
we're first going to console.log the error
using console.error.
So console.error.
And we're going to pass in error or err.stack.
Stack represents the stack trace of the error,
and this is what we saw in the browser previously.
The next thing that we're going to do
is add a response status.
So the response status is going to be a 500
and we're going to send a message to the client
that says something like something is broken.
So we'll say response.status.
And this takes an argument of the status code,
which is going to be 500.
And then we can chain the method send
and pass a message.
So we're going to say, as I mentioned,
something is broken.
All right, and we're going to add an exclamation point
because we really want to drive home that something is broken.
So for the purposes of this course,
we're just keeping the error message simple
but you should try to make your error messages
as informative as possible
for the user based on your application.
All right, now before we transition to the browser,
make sure you've saved.
I'm going to double check.
You see nodemon is restarting looking for those changes.
And let's go ahead and transition back to the browser.
If we refresh this page,
we should now see the message something is broken
in the browser.
All right, so that did exactly what we expected.
Now let's transition back to our terminal
in our editor and let's see what's there for us.
So back here in our editor,
I'm actually going to make the terminal a little bit bigger
and you can see that in our terminal here,
right below where we have our server
is running on port 3000.
We now have the stack trace error
that was previously being printed in the browser.
So I hope you can see why it is better
for the user, for the user experience
to set up that custom error handler
and have a clean, clear message
that's being passed to the client
and then on the server side,
you're actually getting that stack trace error,
so as the engineer or developer,
you can actually trace down where you're having the errors
and amend them accordingly.
So congratulations, you've successfully created
a custom error handler function.