Creating a basic Express server - Interactive Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to import the Express library.

Express

const express = require('[1]');

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

Aexpress

Bhttp

Cfs

Dpath

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'http' instead of 'express' to import Express.

Forgetting to put the library name in quotes.

The Express library is imported using require('express'). This allows us to use Express functions in our code.

2fill in blank

medium

Complete the code to create an Express application instance.

Express

const app = [1]();

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

Aapp

Bexpress

Cserver

Dhttp

Attempts:

3 left

💡 Hint

Common Mistakes

Calling a variable named 'http' instead of 'express'.

Trying to call 'app()' before defining it.

Calling express() creates an Express application instance, which we store in app.

3fill in blank

hard

Fix the error in the code to make the server listen on port 3000.

Express

app.[1](3000, () => {
  console.log('Server is running on port 3000');
});

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

Alisten

Bstart

Crun

Dopen

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'start' or 'run' which are not Express methods.

Forgetting to call the method as a function.

The correct method to start the server listening on a port is listen.

4fill in blank

hard

Fill both blanks to define a GET route for the root URL that sends 'Hello World!'.

Express

app.[1]('[2]', (req, res) => {
  res.send('Hello World!');
});

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

Aget

Bpost

C/

D/home

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'post' instead of 'get' for the route method.

Using '/home' instead of '/' for the root URL.

The get method defines a route for GET requests. The root URL is '/'.

5fill in blank

hard

Fill all three blanks to import Express, create an app, and start the server on port 4000.

Express

const [1] = require('[2]');
const app = [3]();
app.listen(4000, () => {
  console.log('Server running on port 4000');
});

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

Aexpress

Dhttp

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'http' instead of 'express' in require.

Using different variable names inconsistently.

We import Express with require('express'), assign it to express, then call express() to create the app.

Practice

1. What is the main purpose of app.listen() in an Express server?

easy

A. To define a route for GET requests

B. To start the server and listen for incoming requests

C. To import the Express library

D. To send a response to the client

Solution

1. Step 1: Understand the role of app.listen()

   This function starts the Express server and makes it listen on a specified port for incoming requests.

2. Step 2: Compare with other functions

   Functions like app.get() define routes, but do not start the server. Importing Express or sending responses are done elsewhere.

3. Final Answer:

   To start the server and listen for incoming requests -> Option B

4. Quick Check:

   app.listen() starts server [OK]

Hint: Remember: listen means server waits for requests [OK]

Common Mistakes:

• Confusing route definition with server start
• Thinking app.listen() sends responses
• Mixing import statements with server functions

2. Which of the following is the correct way to import Express in a modern Node.js project?

easy

A. const express = require('express');

B. load express from 'express';

C. var express = import('express');

D. import express from 'express';

Solution

1. Step 1: Identify modern import syntax

   In modern Node.js with ES modules, the correct syntax is import express from 'express';.

2. Step 2: Check other options

   require() is CommonJS style, not modern ES modules. var express = import('express'); is invalid syntax. load is not a valid keyword.

3. Final Answer:

   import express from 'express'; -> Option D

4. Quick Check:

   Modern Node.js uses import [OK]

Hint: Use 'import' for modern Node.js, not 'require' [OK]

Common Mistakes:

• Using require() in ES module projects
• Trying to use 'load' keyword
• Incorrect use of dynamic import syntax

3. What will be the output when you visit http://localhost:3000/hello given this Express code?

import express from 'express';
const app = express();
app.get('/hello', (req, res) => {
  res.send('Hello World!');
});
app.listen(3000);

medium

A. Hello World!

B. Cannot GET /hello

C. 404 Not Found error

D. Server error

Solution

1. Step 1: Analyze the route definition

   The code defines a GET route at '/hello' that sends 'Hello World!' as a response.

2. Step 2: Understand server behavior on request

   When visiting /hello, the server matches the route and sends the defined response.

3. Final Answer:

   Hello World! -> Option A

4. Quick Check:

   Defined route sends 'Hello World!' [OK]

Hint: Check if route matches URL path exactly [OK]

Common Mistakes:

• Visiting a route not defined causes 404
• Confusing response text with error messages
• Forgetting to start server with listen()

4. Identify the error in this Express server code:

import express from 'express';
const app = express();
app.get('/', (req, res) => {
  res.send('Welcome!');
});
app.listen();

medium

A. Missing port number in app.listen()

B. Incorrect route path in app.get()

C. res.send() should be res.sendResponse()

D. Express not imported correctly

Solution

1. Step 1: Check app.listen() usage

   The app.listen() method requires a port number to start the server. Here, no port is given.

2. Step 2: Verify other parts

   The route path '/' is valid, res.send() is correct, and Express is imported properly.

3. Final Answer:

   Missing port number in app.listen() -> Option A

4. Quick Check:

   app.listen() needs port [OK]

Hint: Always specify a port in app.listen(port) [OK]

Common Mistakes:

• Omitting port number in app.listen()
• Using wrong method names for response
• Incorrect route paths syntax

5. You want to create an Express server that responds with JSON at /data and listens on port 8080. Which code snippet correctly does this?

hard

A. import express from 'express';
const app = express();
app.get('/data', (req, res) => {
res.send('Hello JSON');
});
app.listen(3000);

B. import express from 'express';
const app = express();
app.post('/data', (req, res) => {
res.send({ message: 'Hello JSON' });
});
app.listen(8080);

C. import express from 'express';
const app = express();
app.get('/data', (req, res) => {
res.json({ message: 'Hello JSON' });
});
app.listen(8080);

D. import express from 'express';
const app = express();
app.get('/data', (req, res) => {
res.json('Hello JSON');
});
app.listen(8080);

Solution

1. Step 1: Check route method and path

   The question asks for a GET route at '/data', so app.get('/data', ...) is correct.

2. Step 2: Verify response and port

   Response should be JSON, so res.json({ message: 'Hello JSON' }) is correct. The server must listen on port 8080.

3. Step 3: Eliminate alternatives with errors

   Alternatives fail due to using POST instead of GET, wrong port like 3000, res.send('string') instead of res.json(object), or res.json('string') instead of object.

4. Final Answer:

   The snippet with app.get('/data'), res.json({ message: 'Hello JSON' }), app.listen(8080) -> Option C

5. Quick Check:

   GET /data + res.json + port 8080 [OK]

Hint: Use app.get + res.json + correct port [OK]

Common Mistakes:

• Using POST instead of GET for route
• Sending string instead of JSON object
• Listening on wrong port number