Passing data to templates in Express - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ component_behavior

intermediate

What is the rendered output of this Express route with EJS template?

Given the Express route below and an EJS template that displays <%= message %>, what will the user see in the browser?

Express

app.get('/greet', (req, res) => {
  res.render('greet', { message: 'Hello, friend!' });
});

A The page shows: <%= message %>

B The page shows: message

C The page is blank with no text

D The page shows: Hello, friend!

💡 Hint

Remember that res.render passes data to the template, and EJS replaces <%= %> with the value.

The message variable is passed to the EJS template. The template uses <%= message %> which outputs the string 'Hello, friend!'. So the user sees that text.

📝 Syntax

intermediate

Which option correctly passes multiple variables to a Pug template?

Choose the correct way to pass title and user variables to a Pug template in Express.

Express

app.get('/profile', (req, res) => {
  // pass variables here
});

A res.render('profile', title = 'User Profile', user = req.user);

B res.render('profile', { title: 'User Profile', user: req.user });

C res.render('profile', ['title', 'User Profile', 'user', req.user]);

D res.render('profile', { 'title': 'User Profile' }, { 'user': req.user });

💡 Hint

Remember that res.render takes the template name and a single object with all variables.

Option B correctly passes an object with both title and user properties. Other options use invalid syntax or multiple objects which is not allowed.

🔧 Debug

advanced

Why does this Express route fail to pass data to the Handlebars template?

Examine the code below. The template does not receive the name variable. What is the cause?

Express

app.get('/hello', (req, res) => {
  const name = 'Alice';
  res.render('hello');
});

A The <code>name</code> variable is not passed in the <code>res.render</code> call.

B The variable <code>name</code> must be declared with <code>var</code> to be passed.

C The route should use <code>res.send</code> instead of <code>res.render</code>.

D The template engine does not support variables named <code>name</code>.

💡 Hint

Check how variables are passed to templates in Express.

The variable name is declared but never sent to the template. You must include it in the object passed to res.render.

❓ state_output

advanced

What is the output when passing nested data to a template?

Given this Express route and a Pug template that uses user.name and user.age, what will be rendered?

Express

app.get('/user', (req, res) => {
  res.render('user', { user: { name: 'Bob', age: 30 } });
});

A The page shows: Name: Bob, Age: 30

B The page shows: Name: undefined, Age: undefined

C The page shows: Name: [object Object], Age: [object Object]

D The page is blank with no user info

💡 Hint

Remember how nested objects are accessed in templates.

The user object with name and age is passed correctly. The template accesses these properties and displays their values.

🧠 Conceptual

expert

Which option best explains why data passed to templates must be plain objects?

Why should the data passed to Express templates be plain JavaScript objects rather than complex types like functions or class instances?

A Templates require data to be JSON strings, so objects must be serialized first.

B Express automatically converts all data to strings, so complex types are ignored.

C Templates can only safely render simple data structures; complex types may cause errors or unexpected output.

D Passing functions or classes improves performance but is discouraged for security reasons.

💡 Hint

Think about how templates access and display data.

Templates expect plain objects with properties they can read and display. Complex types like functions or class instances may not serialize or render properly, causing errors or confusing output.