Categories
Express JavaScript Answers

How to Get Express to Output Nicely Formatted HTML?

Spread the love

To get Express to output nicely formatted HTML, we can set the app.locals.pretty property to true .

For instance, we can write:

const express = require('express')
const app = express()
const port = 3000

if (app.get('env') === 'development') {
  app.locals.pretty = true;
}

app.set('view engine', 'pug')

app.get('/', (req, res) => {
  res.render('index', { title: 'Hey', message: 'Hello there!' })
});

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})

to prettify the HTML code returned by the Pug template engine in the dev environment with:

if (app.get('env') === 'development') {
  app.locals.pretty = true;
}

We render the response with:

res.render('index', { title: 'Hey', message: 'Hello there!' })

title and message are variables that are interpolated into the template.

In views/index.pug , we have the following template code:

html
  head
    title= title
  body
    h1= message

Now when we view the raw response, we should get:

<html>
  <head>
    <title>Hey</title>
  </head>
  <body>
    <h1>Hello there!</h1>
  </body>
</html>

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published.