Node.js WebSockets Skill
Master real-time bidirectional communication for building chat apps, live notifications, collaborative tools, and real-time dashboards.
Quick Start
WebSocket server in 3 steps:
- Setup Server - Socket.io or ws library
- Handle Connections - Manage client lifecycle
- Emit Events - Send/receive messages
Core Concepts
Socket.io Server Setup
const express = require('express');
const { createServer } = require('http');
const { Server } = require('socket.io');
const app = express();
const httpServer = createServer(app);
const io = new Server(httpServer, {
cors: {
origin: 'http://localhost:3000',
methods: ['GET', 'POST']
}
});
io.on('connection', (socket) => {
console.log('User connected:', socket.id);
// Handle events
socket.on('chat:message', (data) => {
// Broadcast to all clients
io.emit('chat:message', {
...data,
timestamp: Date.now()
});
});
// Join rooms
socket.on('room:join', (roomId) => {
socket.join(roomId);
socket.to(roomId).emit('room:user-joined', socket.id);
});
// Handle disconnect
socket.on('disconnect', () => {
console.log('User disconnected:', socket.id);
});
});
httpServer.listen(3000);
Socket.io Client
import { io } from 'socket.io-client';
const socket = io('http://localhost:3000', {
auth: { token: 'jwt-token-here' }
});
socket.on('connect', () => {
console.log('Connected:', socket.id);
});
socket.on('chat:message', (message) => {
console.log('Received:', message);
});
// Send message
socket.emit('chat:message', {
text: 'Hello!',
userId: 'user123'
});
Learning Path
Beginner (1-2 weeks)
- ✅ Socket.io server setup
- ✅ Basic event emission
- ✅ Connect/disconnect handling
- ✅ Simple chat application
Intermediate (3-4 weeks)
- ✅ Rooms and namespaces
- ✅ Authentication middleware
- ✅ Broadcasting patterns
- ✅ Error handling
Advanced (5-6 weeks)
- ✅ Horizontal scaling with Redis
- ✅ Binary data transfer
- ✅ Reconnection strategies
- ✅ Performance optimization
Native ws Library
const WebSocket = require('ws');
const { createServer } = require('http');
const server = createServer();
const wss = new WebSocket.Server({ server });
wss.on('connection', (ws, req) => {
const ip = req.socket.remoteAddress;
console.log('Client connected from', ip);
// Handle messages
ws.on('message', (data) => {
const message = JSON.parse(data);
console.log('Received:', message);
// Echo back
ws.send(JSON.stringify({
type: 'echo',
data: message
}));
});
// Ping/pong heartbeat
ws.isAlive = true;
ws.on('pong', () => {
ws.isAlive = true;
});
ws.on('close', () => {
console.log('Client disconnected');
});
});
// Heartbeat interval
const interval = setInterval(() => {
wss.clients.forEach((ws) => {
if (!ws.isAlive) return ws.terminate();
ws.isAlive = false;
ws.ping();
});
}, 30000);
wss.on('close', () => clearInterval(interval));
server.listen(3000);
Rooms and Namespaces
// Namespaces for feature separation
const chatNamespace = io.of('/chat');
const notificationsNamespace = io.of('/notifications');
chatNamespace.on('connection', (socket) => {
// Chat-specific logic
socket.on('message', (msg) => {
chatNamespace.emit('message', msg);
});
});
notificationsNamespace.on('connection', (socket) => {
// Notification-specific logic
socket.on('subscribe', (topic) => {
socket.join(topic);
});
});
// Rooms within namespace
socket.on('join-channel', (channelId) => {
socket.join(`channel:${channelId}`);
// Send only to room
io.to(`channel:${channelId}`).emit('user-joined', {
userId: socket.userId,
channelId
});
});
// Leave room
socket.on('leave-channel', (channelId) => {
socket.leave(`channel:${channelId}`);
});
Authentication Middleware
const jwt = require('jsonwebtoken');
// Socket.io middleware
io.use((socket, next) => {
const token = socket.handshake.auth.token;
if (!token) {
return next(new Error('Authentication required'));
}
try {
const decoded = jwt.verify(token, process.env.JWT_SECRET);
socket.userId = decoded.id;
socket.userRole = decoded.role;
next();
} catch (err) {
next(new Error('Invalid token'));
}
});
// Namespace-level auth
const adminNamespace = io.of('/admin');
adminNamespace.use((socket, next) => {
if (socket.userRole !== 'admin') {
return next(new Error('Admin access required'));
}
next();
});
Scaling with Redis Adapter
const { createAdapter } = require('@socket.io/redis-adapter');
const { createClient } = require('redis');
const pubClient = createClient({ url: 'redis://localhost:6379' });
const subClient = pubClient.duplicate();
Promise.all([pubClient.connect(), subClient.connect()]).then(() => {
io.adapter(createAdapter(pubClient, subClient));
console.log('Redis adapter connected');
});
// Now events are broadcast across all server instances
io.emit('notification', { message: 'Hello from any server!' });
Real-Time Patterns
Chat Application
// Server
io.on('connection', (socket) => {
socket.on('chat:join', ({ room, username }) => {
socket.join(room);
socket.to(room).emit('chat:user-joined', { username });
});
socket.on('chat:message', ({ room, message }) => {
io.to(room).emit('chat:message', {
user: socket.userId,
message,
timestamp: Date.now()
});
});
socket.on('chat:typing', ({ room }) => {
socket.to(room).emit('chat:typing', { user: socket.userId });
});
});
Live Notifications
// Server
function sendNotification(userId, notification) {
io.to(`user:${userId}`).emit('notification', notification);
}
// Join user's personal room
socket.on('authenticate', () => {
socket.join(`user:${socket.userId}`);
});
// From any service
notificationService.on('new', (userId, data) => {
sendNotification(userId, data);
});
Live Dashboard
// Server: broadcast metrics periodically
setInterval(async () => {
const metrics = await getSystemMetrics();
io.emit('metrics:update', metrics);
}, 1000);
// Or on-demand updates
database.onChange((change) => {
io.to(`dashboard:${change.collection}`).emit('data:update', change);
});
Error Handling
// Client-side reconnection
const socket = io({
reconnection: true,
reconnectionAttempts: 5,
reconnectionDelay: 1000,
reconnectionDelayMax: 5000
});
socket.on('connect_error', (err) => {
console.log('Connection error:', err.message);
});
socket.on('reconnect', (attemptNumber) => {
console.log('Reconnected after', attemptNumber, 'attempts');
});
socket.on('reconnect_failed', () => {
console.log('Failed to reconnect');
// Fallback to polling or show offline UI
});
// Server-side error handling
socket.on('error', (error) => {
console.error('Socket error:', error);
});
Unit Test Template
const { createServer } = require('http');
const { Server } = require('socket.io');
const Client = require('socket.io-client');
describe('WebSocket Server', () => {
let io, serverSocket, clientSocket;
beforeAll((done) => {
const httpServer = createServer();
io = new Server(httpServer);
httpServer.listen(() => {
const port = httpServer.address().port;
clientSocket = Client(`http://localhost:${port}`);
io.on('connection', (socket) => {
serverSocket = socket;
});
clientSocket.on('connect', done);
});
});
afterAll(() => {
io.close();
clientSocket.close();
});
it('should receive message from client', (done) => {
serverSocket.on('hello', (arg) => {
expect(arg).toBe('world');
done();
});
clientSocket.emit('hello', 'world');
});
it('should broadcast to clients', (done) => {
clientSocket.on('broadcast', (arg) => {
expect(arg).toBe('everyone');
done();
});
io.emit('broadcast', 'everyone');
});
});
Troubleshooting
| Problem | Cause | Solution | |---------|-------|----------| | Connection drops | No heartbeat | Enable pingInterval/pingTimeout | | Messages not received | Wrong room | Verify room membership | | Scaling issues | No Redis | Add Redis adapter | | Memory leak | Listeners not removed | Clean up on disconnect |
When to Use
Use WebSockets when:
- Real-time bidirectional communication
- Low-latency updates needed
- Live notifications/chat
- Collaborative applications
- Gaming/trading platforms
Related Skills
- Express REST API (HTTP fallback)
- Microservices (distributed events)
- Redis (pub/sub scaling)