All right.
And up next, let's talk about the 404 errors.
So technically, we can use this approach where essentially we just copy and paste this status and Json
and all that.
But we need to keep in mind again that we are repeating ourselves.
So a better approach is to actually set up a custom class which is going to extend from the error class
where we right away provide the status code and then we just import the custom error class and we provide
the message and essentially we send the error response from our error handler.
And this is one of those things where, yes, technically it's going to be a little bit tedious to set
this entire thing up.
But keep in mind that you can and most likely you will take this from project to project.
So yes, it's going to be a little bit painful right now, but once we have it in place, we can not
only use it in this project but also in all of the upcoming projects.
So what am I talking about?
Well, instead of copying this one every time we need 404, remember that if we throw an error.
So if I'm going to go here with throw new error, the result is going to be following.
I will send back the response from my error middleware.
So let me try this out.
So I have over here this get job.
Let me navigate over here to get single job and again let me mess with the ID notice now I get back
this 500.
So something went wrong.
But if I actually take a look at the console, I see this error and something.
So essentially the error was triggered.
Everything is correct.
We're just not passing this message correctly down to our error middleware.
And in order to fix it, we want to set up a custom error class which is going to extend the built in
error class in JavaScript.
We'll add our own code.
In this case, it's going to be 404 and also we'll set up the functionality where in our own middleware
in the error one, we'll check whether it's our own error, basically the one that we are throwing or
it's just some generic one.
So just bear with me one by one first.
Let's navigate back to our route and we want to create a new folder.
And here I'm going to call this errors.
And inside of this folder, I want to create a file.
And in my case, I'm going to call this custom errors.
Now, in the previous course iteration, we created pretty much a separate file for each error.
In this case, we're going to do a little bit differently where basically there's going to be only one
file and we'll export all of the errors from this file, and that way we'll use named imports.
Again, not a big deal, but just letting you know that there's also other approaches we can take.
First, we'll need status codes.
Why?
Because we are creating our own error class and it kind of makes sense for me to hard code that status
code.
Let's say if it's going to be a not found error.
I mean, I know that always status code is going to be 404.
Why I need to copy and paste.
I know that it's going to be the case and therefore I'll grab the status codes.
Then we want to right away export.
Like I said, we'll create a class.
And as a side note, if you're iffy on any of the syntax we're about to set up.
There's a nice breakdown of the code in the Readme.
And if you're still confused, just keep in mind that this is the only time we'll use the class syntax.
So just bear with me.
We need to come up with a name.
In my case, I'm going to go with not found error.
We need to go with extends and we're extending the error class again built into the JavaScript.
Then we want to go with constructor and essentially we want to pass in the message.
Remember, we were able to log the message right when we set up the code to throw the message in, get
a single job.
So this is what we're passing here and then we'll set up the curlies.
We're going to go with super over here.
We'll still pass the message and then we'll go with this dot.
And technically the name one is optional.
You don't have to set this up, but I do want to showcase that it's always an option, for example.
I'm going to go with the same name.
But again, please keep in mind we're not going to use this in this project.
This is just to showcase that, yes, you can set more properties.
Now, the one that we will use is this and we need to come up with the name for the property.
And in my case, that is going to be the status code.
Status code.
And in here we're looking for status codes and the 404 is not found.
So essentially, this just gets me 404.
And since we're exporting this one over here now, let's navigate to our job controller.
And essentially we want to import then we're looking for not found error notice.
We nicely get the suggestion, then let's keep on moving.
And again, let's try it over here where we have a job now, we still don't have any functionality in
our own middleware.
Don't worry about it.
I just want to go here with the following logic.
I want to remove everything that we have right now and basically we're going to go with throw new and
now we're looking for not found error.
So eventually the status code is going to be 404.
And essentially in here we just want to pass in that message and since the message is going to be exactly
the same, I'm just going to copy it.
So this is going to be faster.
So notice we don't need to provide the status code and we right away know what's happening.
So this is going to be a not found error.
So now let's navigate again to get single job.
Let's send it over here.
We have 500, but now check it out.
We have not found error and we have the message.
So where is this coming from?
Well, this is coming from our own middleware.
So again, let's go back to server.
Let's scroll down and essentially we have this log.
So this is where it's coming from.
So the last step right now is to set up a separate file for this middleware.
And yes, of course you can set it up over here in a server, but again, it's going to be more lines
of code and it just makes sense to set it up separately.
And then we'll check if there is a status code property on our custom error.
We'll use that one instead of this 500.
And the same goes for message.
So for starters, let's create a folder and I'm going to call this middleware.
Since you can probably imagine.
We'll have a few of them.
We'll go with middleware here.
Then let's create a new file and I'm going to call this error.
And lower.
And then middleware.
JS And let's just for now grab everything that we have in a server.
So essentially I'm looking for this function over here, so we'll still invoke it in the server, but
of course.
We'll just export from Errorhandler.
For starters, let's grab the status code.
Or status codes.
Let's be more precise.
Then I want to come up with my function.
And in my case, I'm going to call this error.
And lower and then middleware.
And for now, let me set it equal to my controller.
And as a side note, in order to check for these type of spelling errors, I use this extension, the
code spell checker, and I cannot stop raving about this awesome extension.
So essentially, if it's going to see that the name does not make any sense, it's going to give you
this blue squiggly line.
Now, I still manage to get the spelling errors even with this extension, but it has reduced tremendously
the amount of spelling errors I have.
So in here, let's go with export.
We want to.
Set it up as default.
And then we're looking for error handler middleware.
Then let's right away actually import it.
So let's go back to the server.
Let's scroll up.
So we have over here our routers.
Let's leave that.
And right after the routers, let's set up the middleware.
And we're looking for import then error handler middleware.
Make sure you have that JS.
And of course, we want to invoke it over here.
So we're going to go here with Errorhandler middleware.
And then as far as the logic inside of this middleware.
Like I said, we want to check for the status code.
If the error has one, if it's present, then we want to use that one.
And if not, then we'll just use the generic one.
So let's try this one out.
Effectively we'll set up two properties, one for status code and one for message.
And if the value is missing, essentially if there is no status code or a message, then we'll just
go with something generic.
Let's start with the status code.
So I'm going to go here with const status code.
And remember when we were setting up the custom error, the property name is status code and judging
by the course Q&A, this is somewhat confusing since quite often I see students having a bug where they
go with status codes.
So status codes is the main library.
As far as our property, it's actually a status code, so go here with error.
So that's the error that we're accessing and we want to go with status code again, not status codes
but code.
And if it's not there, then we want to go with the library, the status code.
And like I said, we're just going to go with something generic, basically 500.
And for that we're looking for internal server.
So that's the status code.
And of course now we just want to change it in here.
We're going to go with status code property.
Okay, awesome.
And then when it comes to Json, when it comes to this message, let's do the same thing.
Let's create the variable.
So I'm going to go here with message.
And by default, when it comes to JavaScript error class, whatever will pass here as an error.
Essentially is going to be available in the message property.
So since I'm passing here, this node job with ID, blah, blah, blah, blah, blah, blah.
Well, it's going to be available here in the error message now if it's not present.
Of course, again, we'll go with something generic.
So let's try over here.
We'll say error.
Then again, this is happening by default.
We just grab this message and if it's not present, then I said, Let's go with something generic.
Something went wrong.
Try again later.
Like so.
Now we just want to remove this logic over here.
So now let's navigate to get single job again.
Let's send it.
And what we should see is the 404 with the message that we're passing in our controller.
So let's send it and check it out.
Now, everything is correct.
So the last thing we want to do, go back to the error controller and then one by one, remove this
hardcoded option and set it equal to not found error.
And again, this is one of those things which you can and you should reuse it in your other projects.
So yes, it was a little bit painful to set it up, but once you have everything in place.
You can use it in all your projects.
Now, of course, it's not going to be looking for job, so we're still checking for correct property,
but we don't want to hardcode anymore those responses.
And with this in place now, we can move on to the next topic.