LearnDev
All projects
BackendIntermediate ~16h Premium

Real-Time Chat App

Rooms, presence, typing indicators, and reliable delivery.

Build a chat app that handles the realities: reconnects, message ordering, presence flickers, typing indicators, and delivering messages even if a user briefly disconnects.

Real-timeWebSocketsPresencePub/Sub
Unlock for ₹1000 (lifetime)

What you'll build

  • Direct messages and group rooms
  • Presence (online / away / offline)
  • Typing indicators
  • Message history with pagination
  • Read receipts
  • Reliable delivery on reconnect

What you'll learn

  • Design a WebSocket protocol that survives reconnects
  • Coordinate presence across multiple servers
  • Persist messages without losing real-time feel
  • Scale fan-out with a pub/sub layer

Key flows

The end-to-end paths your data takes through the system.

Message fan-out

How one message reaches every room member.

Client send
Server validate
Persist
Pub/Sub publish
Subscribers receive
Clients render

Reconnect recovery

Catching up after a brief disconnect.

WS drops
Client reconnects
Send last-seen ID
Server replays missed
In sync

Build steps

A step-by-step path. Each milestone leaves you with a working slice.

  1. 1

    WebSocket layer

    Connection lifecycle, auth handshake, ping/pong.

  2. 2

    Rooms & messages

    Schema, send/receive, persistence.

  3. 3

    Presence

    Heartbeats, online list, multi-tab handling.

  4. 4

    Typing indicators

    Throttled events, debounce on client.

  5. 5

    Read receipts

    Per-user last-read pointer, ack flow.

  6. 6

    Reconnect & catch-up

    Last-seen IDs, replay window, idempotent delivery.

Unlock the full build

₹1000 one-time payment unlocks every premium project, course, and architecture deep-dive — for life.

Get lifetime access

Suggested structure

A folder layout that fits this project.

Backend / API Service

Layered backend with clear boundaries between transport, logic, and data.

routes/controllers/services/repositories/middleware/models/+2

Read & study before you build

Related courses and articles that pair well with this project.