Private Chat • Web application
Real-time chat rooms with presence, typing, and file sharing.
Overview
Private Chat implements a full real-time messaging loop: room creation and join flows, live presence and typing indicators, delivery/read status, and file sharing. A Next.js client manages room and message state while an Express + Socket.IO server handles sessions, room access, and broadcasting.
At a Glance
- Role
- Full-stack · Solo build
- Timeline
- Mar 2025 - Apr 2025
- Status
- Prototype
- Type
- Web application
Highlights
Room creation & join flows
Create/join forms drive a server-side room lifecycle with optional password protection and sanitized payloads.
Message status tracking
The server emits sent/delivered/read transitions while client reducers reconcile per-message state, adding protocol-like delivery semantics over Socket.IO.
Attachment-aware messaging
Files are validated by type and size, uploaded separately, then referenced by URL in the message—decoupling upload transport from message transport.
Presence & typing indicators
Ephemeral status and typing events render live online indicators and typing dots, kept separate from persistent message data.
How It Works
A user sets a username; the session data is passed into the socket handshake.
Socket auth middleware resumes or creates a session, then emits joined rooms and state.
Room middleware blocks protected events when a user is not a member of the target room.
Messages are added optimistically, emitted to the server, persisted, and broadcast.
The server emits status and typing events; client reducers reconcile the UI state.
Key Challenge
Keeping conversation state consistent across reconnects and room switches. A reducer-based client reconciles concurrent socket events and optimistic sends, while socket middleware enforces room-level access on every event.
Tech Stack
Languages
Frameworks
Infrastructure
Tooling
Want to see it in action or read the code?
Back to all projects