Welcome to Connecto, a feature-rich real-time chat application built using the MERN stack. This project enables seamless communication with real-time messaging, media sharing, and group chat capabilities, ensuring a smooth and interactive user experience.
- ⚛️ React + Redux
- 🎨 Material-UI
- ⚡ Socket.io-client
- 🏗️ Node.js + Express
- 🔒 JWT Authentication (jsonwebtoken, bcrypt)
- 🔄 Socket.io (Real-time WebSockets)
- 🛢️ MongoDB + Mongoose
- 📂 GridFS for file storage
✅ User Authentication – Secure signup & login using JWT authentication.
✅ Real-Time Messaging – One-on-one & group chat powered by WebSockets (Socket.io).
✅ Media Sharing – Upload and share images/videos in chat.
✅ Online Status Tracking – Displays "Online" & "Last Seen" status updates.
✅ Typing Indicators – Know when someone is typing in real-time.
✅ Infinite Scrolling in Chat – Seamless message loading via pagination.
✅ Admin Dashboard – Manage users, media, and data visualization with Chart.js.
📽️ Must Watch Video – Check out this video where I explore all features of Connecto in detail! 🎬 Watch Here
👨💼 Receive Real-Time Notifications for messages, media uploads, and critical events.
📊 Data Visualization Dashboard – Analyze user activity with charts.
🗂️ Manage Media Uploads – Review, approve, or delete images/videos.
💬 Send & Receive Messages instantly.
📷 Upload & Share Media with Cloudinary integration.
🟢 See Live User Status – Know who’s online in real time.
⌨️ Typing Indicators – See when someone is typing.
👥 Group Chat Support – Create and manage group conversations.
{
"_id": "ObjectId",
"name": "Shivam Javiya",
"email": "shivam@example.com",
"password": "hashed_password",
"profilePicture": "image_url",
"isOnline": true,
"lastSeen": "2024-02-02T10:30:00Z"
}{
"_id": "ObjectId",
"senderId": "ObjectId",
"receiverId": "ObjectId",
"groupId": "ObjectId | null",
"message": "Hello, how are you?",
"media": "file_url",
"timestamp": "2024-02-02T10:35:00Z"
}{
"_id": "ObjectId",
"groupName": "Developers Chat",
"members": ["ObjectId1", "ObjectId2"],
"createdAt": "2024-02-02T10:30:00Z"
}- 📌 Node.js (v16 or higher)
- 📌 MongoDB installed locally or MongoDB Atlas
# Clone the repository
https://github.com/ShivamJaviya/chatapp.git
cd Connecto
# Install dependencies for backend
cd server
npm install
# Install dependencies for frontend
cd ../client
npm install
# Start backend server
cd ../server
npm run dev
# Start frontend server
cd ../client
npm start| Method | Endpoint | Description |
|---|---|---|
| POST | /api/auth/signup |
Register a new user |
| POST | /api/auth/login |
Login & get JWT token |
| Method | Endpoint | Description |
|---|---|---|
| POST | /api/messages |
Send a new message |
| GET | /api/messages/:id |
Get chat messages for a user |
Made with ❤️ by Shivam Javiya for VMukti Solutions. 🚀