Socket.io integration with Express - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to import the Socket.io library.

Express

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

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

Asocket.io-client

Bexpress-socket

Csocket.io

Dsocket

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'socket.io-client' instead of 'socket.io'.

Using a wrong package name like 'socket'.

The correct package to import for Socket.io server is socket.io.

2fill in blank

medium

Complete the code to create an HTTP server from the Express app.

Express

const app = express();
const server = http.createServer([1]);

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

AsocketIo

Bhttp

Cexpress

Dapp

Attempts:

3 left

💡 Hint

Common Mistakes

Passing the Socket.io instance instead of the Express app.

Passing the HTTP module itself.

The HTTP server is created from the Express app instance, so app is passed.

3fill in blank

hard

Fix the error in initializing Socket.io with the HTTP server.

Express

const io = socketIo([1]);

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

Aserver

Bapp

Chttp

Dexpress

Attempts:

3 left

💡 Hint

Common Mistakes

Passing the Express app instead of the HTTP server.

Passing the HTTP module or express module.

Socket.io needs the HTTP server instance to bind to, so server is correct.

4fill in blank

hard

Fill both blanks to listen for a new client connection and log a message.

Express

io.on('[1]', (socket) => {
  console.log('A client [2]');
});

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

Aconnection

Bdisconnect

Cconnected

Dconnect

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'connect' or 'connected' as event name instead of 'connection'.

Using 'disconnect' event here.

The event to listen for new clients is 'connection' (A). The log message is A client connected, so {{BLANK_2}} is connected (C).

5fill in blank

hard

Fill all three blanks to emit a message to the client when connected.

Express

io.on('connection', ([1]) => {
  [2].[3]('welcome', 'Hello from server!');
});

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

Asocket

Bemit

Csend

Dconnection

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'send' instead of 'emit' to send events.

Using wrong parameter name instead of 'socket'.

The callback parameter is usually named socket. To send a message, call socket.emit. So the first and third blanks are 'socket', the second blank is 'emit'.