Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/khushboodaryani/Chat-App/llms.txt

Use this file to discover all available pages before exploring further.

Chat App is a full-stack messaging platform that lets users register, find each other, and exchange messages instantly — with no page reload required. It is built on the MERN stack (MongoDB, Express, React, Node.js) and uses Socket.io for persistent bidirectional connections, giving every conversation a live, low-latency feel. Whether you are exploring the codebase as a learning project or using it as a foundation for your own product, the architecture is intentionally straightforward: a single Express server handles both the REST API and serves the compiled React front end in production.

​
What You Can Do with Chat App

Real-Time Messaging

Send and receive messages instantly over a persistent Socket.io connection — no polling, no delays.

JWT Authentication

Secure, stateless login flow backed by JSON Web Tokens stored in HttpOnly cookies to prevent XSS.

Online Presence

See which users are currently online in real time, updated automatically as people connect and disconnect.

Persistent Storage

All messages and user profiles are stored in MongoDB so conversations survive page refreshes and server restarts.

Conversation Search

Filter your contact list to quickly locate any user and jump straight into a conversation.

Notification Sounds

Incoming messages trigger an audio notification so you never miss a reply, even when another tab is in focus.

​
Technology Stack

Chat App is assembled from widely adopted, well-documented open-source libraries. The table below maps each architectural layer to the technology it uses.
LayerTechnology
FrontendReact 18.2, React Router 6.21, Zustand 4.5
BackendNode.js, Express (ESM)
DatabaseMongoDB (via Mongoose)
AuthJSON Web Tokens (jsonwebtoken), cookie-parser
RealtimeSocket.io 4.7 (server + client)
StylingTailwind CSS 3.4, DaisyUI 4.6
BuildVite 5

​
Single-Binary Deployment Model

In production, you run exactly one process. The Express server uses express.static to serve every file from the /frontend/dist directory produced by vite build, and a catch-all GET * handler sends index.html for any path not matched by the API routes — handing control to React Router on the client. This means there is no separate Node process for the front end, no reverse-proxy configuration needed for most deployments, and a single PORT environment variable controls the whole application. 
Client browser
     │
     ▼
Express (PORT 4000)
  ├─ /api/auth      → Auth routes (register, login, logout)
  ├─ /api/messages  → Message routes
  ├─ /api/users     → User search route
  └─ /*             → React SPA (frontend/dist)

​
Next Steps

Quickstart

Clone the repo, configure your environment, and have both servers running in under five minutes.

API Reference

Explore every REST endpoint and Socket.io event exposed by the backend.

Build docs developers (and LLMs) love

Get started for freeTalk to us