VibeLink – Real-Time Chat Application

VibeLink is a real-time chat application inspired by platforms like Discord, built with Spring Boot 3, WebSockets, and MongoDB.
Users can join rooms, chat instantly, and leave rooms via a simple HTML/CSS/JavaScript frontend. Communication uses WebSocket (persistent full-duplex) rather than traditional HTTP request/response.

---

Table of Contents

• Features
• Tech Stack
• Architecture
• Project Structure
• Setup & Installation
  • Prerequisites
  • Steps (Clone & Run)
  • Configuration
  • Build and Run
• How It Works
• Data Model (MongoDB)
• WebSocket Message Formats
• Troubleshooting
• License
• Author

---

🚀 Features

• 🔗 Real-Time Communication – Uses WebSockets (not HTTP polling).
• 🏠 Chat Rooms – Create, join, and leave rooms dynamically.
• 👥 Multi-User Support – Many users chatting across multiple rooms.
• 💬 Instant Messaging – Broadcasts messages to all users in a room.
• 📂 Persistence – Room/user/message data stored in MongoDB.
• 🌐 Simple Frontend – Plain HTML, CSS, JavaScript UI for speed & clarity.

---

🛠️ Tech Stack

• Backend: Spring Boot 3, WebSockets
• Database: MongoDB (NoSQL)
• Persistence Layer: Spring Data MongoDB (Hibernate may be present for future RDBMS modules)
• Frontend: HTML, CSS, JavaScript
• Build Tool: Maven
• Java: 17+

---

🧭 Architecture

• Client (HTML/CSS/JS) opens a WebSocket to the backend.
• Server maintains session → room mappings and broadcasts messages per room.
• MongoDB stores users, rooms, and messages for persistence and history.
• Typical default ports: Backend :8080, MongoDB :27017.

Client (Browser)
   │  WebSocket
   ▼
Spring Boot 3 (WebSocket endpoints, room/session registry)
   │  CRUD
   ▼
MongoDB (rooms, users, messages)

---

📂 Project Structure

vibelink-realtime-chat/
├── src/main/java/...       # Spring Boot backend (controllers, services, models)
├── src/main/resources/     # application.properties, static assets, templates
├── frontend/               # HTML, CSS, JavaScript for UI
├── pom.xml                 # Maven build file
└── README.md               # This documentation

---

⚙️ Setup & Installation

Prerequisites

• Java 17+
• Maven
• MongoDB (running locally or via cloud like Atlas)

Steps (Clone & Run)

1. Clone the repository

git clone https://github.com/bansalharshit/vibelink-realtime-chat.git
cd vibelink-realtime-chat

Configuration

Configure MongoDB connection in src/main/resources/application.properties:

spring.data.mongodb.uri=mongodb://localhost:27017/vibelink
# Optional: change server port
# server.port=8080

Tip: For production, you can use an environment variable:

export SPRING_DATA_MONGODB_URI="your-atlas-or-remote-uri"

Build and Run

Run the application with Maven:

mvn spring-boot:run

Open the frontend in your browser:

frontend/index.html

---

📡 How It Works

• WebSockets create a persistent, full-duplex channel between client and server.
• Users join rooms; the server maps their session to those rooms.
• Messages to a room are broadcast to all connected members of that room instantly.
• When a user leaves a room (or disconnects), the session is cleaned up.

---

📘 Data Model (MongoDB)

rooms

{
  "_id": "66a1f9...roomId",
  "name": "general",
  "createdAt": "2025-08-01T10:00:00Z"
}

users

{
  "_id": "66a1fa...userId",
  "username": "alice",
  "joinedRooms": ["general", "java"],
  "createdAt": "2025-08-01T10:05:00Z"
}

messages

{
  "_id": "66a1fb...messageId",
  "room": "general",
  "sender": "alice",
  "content": "Hello, world!",
  "timestamp": "2025-08-01T10:06:00Z"
}

Collection names and fields can be adapted to your codebase; this is a standard, minimal schema for chat.

---

📨 WebSocket Message Formats

Endpoint (example): /server1
Room topic pattern (example): /room/{roomId}

Client → Server: join room

{
  "type": "join",
  "room": "general",
  "username": "alice"
}

Client → Server: leave room

{
  "type": "leave",
  "room": "general",
  "username": "alice"
}

Client → Server: send message

{
  "type": "message",
  "room": "general",
  "username": "alice",
  "content": "Hello everyone!"
}

Server → Clients (broadcast within room)

{
  "type": "message",
  "room": "general",
  "sender": "alice",
  "content": "Hello everyone!",
  "timestamp": "2025-08-01T10:06:00Z"
}

---

🧰 Troubleshooting

• Cannot connect to MongoDB
  • Ensure MongoDB is running: mongod
  • Verify spring.data.mongodb.uri in application.properties.
• Port already in use
  • Change server.port in application.properties, e.g. server.port=8081.
• WebSocket not connecting
  • Confirm the browser JS uses the correct WS URL (e.g. ws://localhost:8080/ws for local).
  • Check browser console & server logs for handshake errors.
• CORS / Mixed Content
  • If serving frontend from file:// or a different origin, configure CORS / allowed origins on the WS endpoint.

---

License

This project is made for educational purpose, use it according to your needs.

---

👨‍💻 Author

Your Name
📧 harshitbansal394@gmail.com
🔗 https://www.linkedin.com/in/harshitbansal01/