We'll start with making the maintenance.hbs file by duplicating home.hbs. Inside maintenance.hbs, all we'll do is wipe the body and add a few tags:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Some Website</title>
</head>
<body>
</body>
</html>
As shown in the following code, we'll add an h1 tag to print a little message to the user:
<body>
<h1></h1>
</body>
We're going to use something like We'll be right back:
<body>
<h1>We'll be right back</h1>
</body>
Next, I can add a paragraph tag:
<body>
<h1>We'll be right back</h1>
<p>
</p>
</body>
Inside the paragraph, I'll leave a little message: The site is currently being updated:
<p>
The site is currently being updated.
</p>
Now that we have our template file in place, we can define our maintenance middleware. This is going to bypass all of our other handlers, where we render other files and print JSON, and instead it'll just render this template to the screen. We'll save the file, move into server.js, and define that middleware.
Right next to the previously-defined middleware, we can call app.use passing in our function. The function will take those three arguments: request (req), response (res), and next:
app.use((req, res, next) => {
})
Inside the middleware, all we'll need to do is call res.render. We'll add res.render passing in the name of the file we want to render; in this case, it's maintenance.hbs:
app.use((req, res, next) => {
res.render('maintenance.hbs');
});
That is all you needed to do to set up our main middleware. This middleware will stop everything after it from executing. We don't call next, so the actual handlers in the app.get function, they will never get executed and we can test this.