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 MERN application where both the React frontend and the Socket.io-powered Express backend run from a single repository. The steps below walk you from a fresh clone to two browser tabs exchanging real-time messages with no external services beyond a MongoDB instance.

​
Prerequisites

Before you begin, make sure you have the following installed and available:

​
Setup Steps

1

Clone the repository

Download the source code and move into the project root.
git clone https://github.com/khushboodaryani/Chat-App.git && cd Chat-App
2

Install backend dependencies

From the repository root, install the Node.js dependencies for the Express server.
npm install
3

Install frontend dependencies

Move into the frontend directory and install the React/Vite dependencies separately.
cd frontend && npm install
Return to the repository root when done:
cd ..
4

Create the environment file

Create a .env file at the repository root (the same level as the /backend and /frontend folders). Populate it with the four required variables:
MONGO_DB_URI=mongodb://localhost:27017/chat-app
JWT_SECRET=replace_this_with_a_long_random_secret
PORT=4000
NODE_ENV=development
  • Replace MONGO_DB_URI with your Atlas connection string if you are not running MongoDB locally.
  • Replace JWT_SECRET with a random string of at least 32 characters. You can generate one with openssl rand -hex 32.
See Configuration for the full reference on every variable.
5

Start the backend server

From the repository root, start the Express server with the server npm script.
npm run server
You should see:
Server Running on port 4000
Connected to MongoDB
The server listens on http://localhost:4000 by default. API routes are available under /api/auth, /api/messages, and /api/users.
6

Start the frontend dev server

Open a second terminal, navigate to the frontend directory, and start Vite.
cd frontend && npm run dev
Vite will print a local URL — by default:
VITE v5.x.x  ready in Xms
➜  Local:   http://localhost:5173/
The frontend dev server proxies API and Socket.io requests to the Express backend automatically.
7

Open the app and start chatting

Navigate to http://localhost:5173 in your browser. Click Sign Up to create a new account, log in, select a user from the sidebar, and send your first real-time message.

​
Production Deployment

For production, you only need to run the Express server — no separate frontend process required. Build the React app first, then start the backend:
# Build the frontend (from the frontend/ directory)
cd frontend && npm run build

# Return to the root and start the server
cd .. && npm run server
Express will serve the compiled assets from /frontend/dist and handle client-side routing via its catch-all GET * handler. Set NODE_ENV=production in your environment to enable secure cookies.
For a complete description of all environment variables and their effects, see the Configuration reference.

Build docs developers (and LLMs) love

Get started for freeTalk to us