Integrating Node.js and Express.js with Socket.IO

Introduction

Integrating Node.js, Express.js, and Socket.IO is required when creating real-time online applications. These technologies provide server-side web development projects with quick, scalable, and user-friendly solutions.

You will discover how to combine these technologies in this tutorial to create a real-time chat application.

Prerequisites

• Basic knowledge of Node.js, Express.js, and JavaScript.
• Node.js and npm are installed on your machine.

Step 1: Install dependencies

Before starting, install the essential dependencies, including Node.js, Express.js, and Socket.IO. Use npm to accomplish this:

npm install express socket.io

Step 2: Set up a basic Express.js server

In this step, you’ll set up a basic Express.js server:

const express = require('express');
const app = express();
const server = require('http').Server(app);
const port = process.env.PORT || 3000;

server.listen(port, () => {
  console.log(`Server started on port ${port}`);
});

Step 3: Integrate Socket.IO

You must incorporate Socket.IO if you want to provide your chat application with real-time capabilities. Add the following code to your Express.js server to accomplish this:

const io = require('socket.io')(server);

io.on('connection', socket => {
  console.log('User connected');

  socket.on('disconnect', () => {
    console.log('User disconnected');
  });
});

By supplying the server to require(“socket.io”) in this case, io is constructed. When a client connects to the server, the code then waits for a “connection” event to be produced. The code logs a message to the console to show that a connection has been formed when one is made. A “disconnect” event is released when a user disconnects, and the code writes a message to the console to let the user know that they have disconnected.

Step 4: Add chat functionality

You can now give your chat application conversation features after integrating Socket.IO. You can achieve this by issuing a chat message event to all connected clients after listening for a chat message event from the client.

io.on('connection', socket => {
  console.log('User connected');

  socket.on('chat message', message => {
    io.emit('chat message', message);
  });

  socket.on('disconnect', () => {
    console.log('User disconnected');
  });
});

Here, the code uses socket.on(‘chat message’, message => … ) to monitor the client for a “chat message” event. The code utilizes the io.emit() function to send out a “chat message” event to all connected clients whenever a “chat message” event is received. In this manner, the message will be delivered to all connected clients, who will then be able to see it in the conversation.

Conclusion

Now that Node.js, Express.js, and Socket.IO have been integrated, you have the ideal basis for a real-time online application. On top of this foundation, you can keep expanding and investigating the fascinating possibilities of real-time web development.

Looking for a freelance technical writer? Look no further! If you enjoyed this article, don’t forget to give it some claps and leave a comment below. Let’s connect and work together on your next project. If you’re interested in working with me, feel free to reach out via email at blissfelix18@gmail.com.

Originally published at https://dev.to on February 8, 2023.