💬 Realtime Chat App

A modern real-time messaging platform built with MERN stack & WebSockets

Features • Quick Start • Tech Stack • Key Highlights

---

✨ Features

Category	Highlights
🔐 Auth	JWT authentication, bcrypt hashing, protected routes
💬 Messaging	Real-time delivery, online status, image sharing
🎨 UI/UX	32+ themes, responsive design, skeleton loading
⚡ Performance	Zustand (2KB), Vite builds, WebSocket efficiency

---

🚀 Quick Start

# Clone & install
git clone https://github.com/omkarhole/Realtime-Chatapp.git
cd Realtime-Chatapp
cd backend && npm install
cd ../frontend && npm install

# Configure backend/.local.env
PORT=5001
MONGODB_URI=your_mongodb_uri
JWT_SECRET=your_secret
CLOUDINARY_CLOUD_NAME=your_cloud_name
CLOUDINARY_API_KEY=your_key
CLOUDINARY_API_SECRET=your_secret

# Run
cd backend && npm run dev    # Terminal 1
cd frontend && npm run dev   # Terminal 2

---

🛠️ Tech Stack

Frontend: React 19 • Vite • TailwindCSS • DaisyUI • Zustand • Socket.io-client

Backend: Node.js • Express 5 • Socket.io • MongoDB • Mongoose • JWT • Cloudinary

---

🎯 Key Highlights

• Real-time Architecture — WebSocket-based bidirectional communication for instant messaging
• Scalable Design — Modular MVC pattern with separation of concerns
• Modern Auth Flow — JWT tokens with HTTP-only cookies for security
• Cloud Integration — Cloudinary CDN for optimized image delivery
• State Management — Zustand for minimal bundle size (2KB vs Redux 42KB)
• Production Ready — Serves static frontend from Express in production mode

---

📁 Structure

├── backend/src/
│   ├── controllers/    # Auth & message logic
│   ├── models/         # User & message schemas
│   ├── routes/         # API endpoints
│   ├── lib/            # Socket.io, DB, utils
│   └── middleware/     # JWT protection
│
├── frontend/src/
│   ├── components/     # Chat UI components
│   ├── pages/          # Route pages
│   ├── store/          # Zustand stores
│   └── lib/            # Axios, utilities

---

🔮 Roadmap

• Group chat & typing indicators
• Voice messages & video calls
• End-to-end encryption
• Push notifications

---

🤝 Contributing

1. Fork → 2. Branch → 3. Commit → 4. PR

---

⭐ Star this repo if helpful!
Made with ❤️ by Omkar Hole