Creating Custom Error Pages in NodeJS

Intro

You can easily create custom 404 (Not Found) and 500 (Internal Server Error) error pages for your NodeJS application and style them as you need.

Custom Error Pages

Creating custom error pages is as easy as creating a page called 404 or 500 in Wappler and adding content to it. These pages will be used as default error pages.

404 Not Found

Open Pages and add a new page:

Add 404 as a name for this page:

The page has been created:

Add whatever content you want to show on this page. We simply add a heading, paragraph and a link that allows the users to go back to home page:

And you are done. Let’s preview the results, by entering a non-existing URL:

500 Internal Server Error

It’s quite similar for the custom error 500 page.
Open Pages and add a new page:

Add 500 as a name for this page:

The page has been created:

Add your content on this page:

And we are done.

3 Likes

I appreciate the efforts to make it as easy as possible (by just naming them as 404 or 500) but I really wish this wouldn’t be set up like this.

These kind of design decisions add to the learning curve of Wappler.
I’d rather see it on the routes section, as that’s the place where you can set up routes. And not have another ‘hidden’ middleware which is an exception to what’s set up in the routes panel (just like /webhooks/ is).

More transparency in these things makes it much easier to work with and especially learn Wappler

You will see your 404 and 500 pages also on the routes list. So they are not hidden, just have a special meaning.

2 Likes