So we learned quite a bit about nextjs
and I'm already nearing the end of this module since it is again not a full nextjs course
but there still are some things I want to touch on.
Let's go back to the github page of nextjs and if we scroll to the summary here, to the content we can
go through, there
we can also have a look at custom error handling because right now, we already have routes in our nextjs
application
but if I enter an invalid route here, we get this default 404 error, better than nothing but we can customize
this. As described here in the github repository of nextjs, you can create your own error handler
by creating an _error.js
file in the pages folder.
So let's do that, in pages let's create error.js with the underscore at the beginning
and that is a normal javascript react component.
So let me copy the content from index.js
and I'll name this error page but the name of course doesn't really matter
and then I can say, whoops something went wrong
and maybe here, we say try and then on the link, we say going back. So we still import the link, don't need
the button though so
let's also get rid of router import and on the link, I want to go to just slash.
If we now restart npm run dev, we need to do that because we exchanged that error page and therefore
we overwrote the default,
now if we enter a route we don't know, we get our custom error page and now we can go back to our main
page and it automatically continues working thereafter.
So this is how we can handle errors in nextjs and how we can render our own custom error page which of
course is quite important
if we really want to build a real application with that.