res.render for templates in Express - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to render the 'home' template using Express.

Express

app.get('/', (req, res) => {
  res.[1]('home');
});

Drag options to blanks, or click blank then click option'

Awrite

Bsend

Crender

Djson

Attempts:

3 left

💡 Hint

Common Mistakes

Using res.send instead of res.render

Trying to use res.json to render templates

The res.render method tells Express to render a template file named 'home'.

2fill in blank

medium

Complete the code to pass a variable 'title' with value 'Welcome' to the template.

Express

app.get('/', (req, res) => {
  res.render('home', { [1]: 'Welcome' });
});

Drag options to blanks, or click blank then click option'

Atitle

Bmessage

Cname

Dheader

Attempts:

3 left

💡 Hint

Common Mistakes

Using a variable name not expected by the template

Passing the variable outside the object

The object passed as the second argument to res.render contains variables for the template. Here, title is the variable name.

3fill in blank

hard

Fix the error in the code to correctly render the 'profile' template with user data.

Express

app.get('/profile', (req, res) => {
  const user = { name: 'Alice' };
  res.[1]('profile', { user });
});

Drag options to blanks, or click blank then click option'

Asend

Brender

Cjson

Dwrite

Attempts:

3 left

💡 Hint

Common Mistakes

Using res.send instead of res.render

Passing data incorrectly

To render a template with data, use res.render and pass the data as an object.

4fill in blank

hard

Fill both blanks to render 'dashboard' template with a user name and age.

Express

app.get('/dashboard', (req, res) => {
  res.render('dashboard', { [1]: 'Bob', [2]: 30 });
});

Drag options to blanks, or click blank then click option'

Ausername

Bage

Cname

DuserAge

Attempts:

3 left

💡 Hint

Common Mistakes

Using inconsistent variable names

Passing values outside the object

The template expects variables named name and age to display user info.

5fill in blank

hard

Fill all three blanks to render 'product' template with id, name, and price variables.

Express

app.get('/product', (req, res) => {
  res.render('product', { [1]: 101, [2]: 'Book', [3]: 9.99 });
});

Drag options to blanks, or click blank then click option'

AproductId

Bname

Cprice

Did

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong variable names like productId instead of id

Mixing up variable names and values

The template uses id, name, and price to show product details.