res.json for JSON responses in Express - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to send a JSON response with Express.

Express

app.get('/data', (req, res) => {
  res.[1]({ message: 'Hello World' });
});

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

Ajson

Bwrite

Crender

Dsend

Attempts:

3 left

💡 Hint

Common Mistakes

Using res.send() which can send JSON but does not explicitly set the content type.

Using res.render() which is for templates, not JSON.

Using res.write() which is a lower-level method.

Use res.json() to send a JSON response in Express.

2fill in blank

medium

Complete the code to send a JSON object with a status code 200.

Express

app.get('/status', (req, res) => {
  res.status(200).[1]({ success: true });
});

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

Asend

Bwrite

Cend

Djson

Attempts:

3 left

💡 Hint

Common Mistakes

Using res.send() which may not set the content type explicitly.

Using res.end() which ends the response without sending JSON.

Using res.write() which is not typical for JSON responses.

res.json() sends the JSON response after setting the status code.

3fill in blank

hard

Fix the error in sending a JSON response with an object.

Express

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

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

A'25'

B"25"

C25

Dage

Attempts:

3 left

💡 Hint

Common Mistakes

Putting numbers inside quotes, making them strings.

Using a variable name instead of a value.

Using single or double quotes around numbers.

Age should be a number, not a string, for proper JSON data types.

4fill in blank

hard

Fill both blanks to send a JSON response with a custom status and message.

Express

app.get('/error', (req, res) => {
  res.[1]([2]).json({ error: 'Not found' });
});

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

Astatus

BsendStatus

C404

D200

Attempts:

3 left

💡 Hint

Common Mistakes

Using sendStatus which ends the response immediately.

Using wrong status code like 200 for errors.

Not chaining status before json.

Use res.status(404) to set status before sending JSON error message.

5fill in blank

hard

Fill all three blanks to send a JSON response with a nested object and status code.

Express

app.get('/profile', (req, res) => {
  res.[1]([2]).json({ user: { name: 'Bob', age: [3] } });
});

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

Astatus

B200

C30

Dsend

Attempts:

3 left

💡 Hint

Common Mistakes

Using res.send instead of res.status for status code.

Putting age in quotes making it a string.

Not chaining status before json.

Use res.status(200) to set status and send JSON with age as number.

Practice

1. What does res.json() do in an Express app?

easy

A. Parses JSON data from a file

B. Reads JSON data from the client request

C. Sends a JSON response to the client with proper headers

D. Logs JSON data to the server console

Solution

1. Step 1: Understand the purpose of res.json()

   This method is used to send JSON data back to the client in an HTTP response.

2. Step 2: Recognize header setting and formatting

   It automatically sets the Content-Type header to 'application/json' and converts the JavaScript object to JSON format.

3. Final Answer:

   Sends a JSON response to the client with proper headers -> Option C

4. Quick Check:

   res.json() sends JSON response [OK]

Hint: Remember: res.json sends data, not reads it [OK]

Common Mistakes:

• Confusing res.json with reading client data
• Thinking it logs data instead of sending
• Assuming it parses files automatically

2. Which of the following is the correct syntax to send a JSON response with Express?

easy

A. res.json({ message: 'Hello' })

B. res.sendJson({ message: 'Hello' })

C. res.jsonify({ message: 'Hello' })

D. res.send({ json: 'Hello' })

Solution

1. Step 1: Identify the correct method name

   The Express method to send JSON is res.json(), not res.sendJson() or res.jsonify().

2. Step 2: Check the argument format

   The argument should be a JavaScript object, like { message: 'Hello' }.

3. Final Answer:

   res.json({ message: 'Hello' }) -> Option A

4. Quick Check:

   Correct method is res.json() [OK]

Hint: Use res.json() exactly, no extra letters [OK]

Common Mistakes:

• Using res.sendJson or res.jsonify which don't exist
• Passing string instead of object
• Mixing res.send with JSON method

3. What will the client receive when this Express route runs?

app.get('/data', (req, res) => {
  res.json({ success: true, count: 5 });
});

medium

A. success: true, count: 5

B. ["success", true, "count", 5]

C. An error because res.json needs a string

D. {"success":true,"count":5}

Solution

1. Step 1: Understand what res.json sends

   It converts the JavaScript object into a JSON string with keys and values properly quoted.

2. Step 2: Check the exact JSON format

   The object { success: true, count: 5 } becomes the JSON string '{"success":true,"count":5}'.

3. Final Answer:

   {"success":true,"count":5} -> Option D

4. Quick Check:

   res.json sends JSON string [OK]

Hint: res.json sends JSON string with quotes around keys [OK]

Common Mistakes:

• Thinking it sends array format
• Assuming it sends plain text without quotes
• Believing res.json requires string input

4. Identify the error in this Express code snippet:

app.get('/info', (req, res) => {
  res.json = { name: 'Alice' };
});

medium

A. Missing parentheses after res.json()

B. res.json is assigned an object instead of called as a function

C. res.json cannot send objects, only strings

D. Route path should be '/info/' with trailing slash

Solution

1. Step 1: Check how res.json is used

   The code assigns an object to res.json instead of calling it as a function.

2. Step 2: Understand correct usage

   res.json is a method and should be called like res.json({ name: 'Alice' });

3. Final Answer:

   res.json is assigned an object instead of called as a function -> Option B

4. Quick Check:

   res.json must be called, not assigned [OK]

Hint: res.json is a function, always call it with () [OK]

Common Mistakes:

• Assigning to res.json instead of calling it
• Forgetting parentheses after res.json
• Thinking res.json only accepts strings

5. You want to send a JSON response with a list of users but only include users with active status true. Which code correctly uses res.json to do this?

const users = [
  { id: 1, active: true },
  { id: 2, active: false },
  { id: 3, active: true }
];

app.get('/active-users', (req, res) => {
  // Fill in here
});

hard

A. res.json(users.filter(user => user.active));

B. res.json(users.map(user => user.active));

C. res.json(users);

D. res.json(users.filter(user => user.id));

Solution

1. Step 1: Filter users by active status

   Use users.filter(user => user.active) to get only users where active is true.

2. Step 2: Send filtered list as JSON response

   Pass the filtered array to res.json() to send it properly formatted.

3. Final Answer:

   res.json(users.filter(user => user.active)); -> Option A

4. Quick Check:

   Filter active users, then send JSON [OK]

Hint: Filter first, then send with res.json() [OK]

Common Mistakes:

• Using map instead of filter, sending booleans only
• Sending full users list without filtering
• Filtering by id instead of active status