💬 Full-Stack Chat Application

A modern, real-time chat application built with Spring Boot, WebSockets, and Thymeleaf. This application enables users to communicate in real-time with a responsive web interface and persistent message storage.

📋 Table of Contents

Overview
Features
Architecture
Project Structure
Prerequisites
Installation & Setup
Configuration
Usage
API Endpoints
WebSocket Events
Technologies Used
Database Schema
Contributing
License
Troubleshooting

🎯 Overview

This Chat Application is a full-stack solution for real-time messaging. It combines the robustness of Spring Boot backend with the interactivity of WebSocket communication and a dynamic Thymeleaf templated frontend. Users can:

Create accounts and login securely
Join chat rooms or start direct conversations
Receive real-time message notifications
View chat history
See online/offline status of users

The application is designed with scalability, security, and user experience in mind.

✨ Features

✅ Real-Time Messaging: Instant message delivery via WebSockets
✅ User Authentication: Secure login and registration system
✅ Multiple Chat Rooms: Create and join different conversation groups
✅ Direct Messaging: One-on-one private conversations
✅ Online Status: See who's currently active
✅ Message History: Persistent message storage in database
✅ User Profiles: Customizable user information
✅ Responsive Design: Works on desktop and mobile devices
✅ Message Notifications: Real-time notifications for new messages
✅ Typing Indicators: See when others are typing
✅ User Search: Find and connect with other users
✅ Session Management: Automatic session handling

🏗️ Architecture

System Architecture

┌────────────────────────────────────────────────────────────────┐
│                     Client (Browser)                           │
│                                                                │
│  ┌───────────────────────────────────────────────────────────┐│
│  │         Thymeleaf Template Views (HTML/CSS/JS)           ││
│  │  - Chat Interface                                         ││
│  │  - User Authentication                                   ││
│  │  - Room Management                                       ││
│  └──────────────────────────┬────────────────────────────────┘│
│                             │ HTTP/WebSocket                  │
└─────────────────────────────┼────────────────────────────────┘
                              │
                    ┌─────────▼────────────┐
                    │   Network Layer      │
                    │  (HTTP, WebSocket)   │
                    └─────────┬────────────┘
                              │
┌─────────────────────────────▼────────────────────────────────────┐
│              Spring Boot Backend Application                     │
│                                                                  │
│  ┌──────────────────────────────────────────────────────────┐  │
│  │              Web Layer (Controllers)                     │  │
│  │  - AuthController                                       │  │
│  │  - ChatController                                       │  │
│  │  - UserController                                       │  │
│  └──────────────────────┬───────────────────────────────────┘  │
│                         │                                       │
│  ┌──────────────────────▼───────────────────────────────────┐  │
│  │           WebSocket Handler Layer                        │  │
│  │  - WebSocketHandler                                     │  │
│  │  - Message Listener                                     │  │
│  │  - Connection Manager                                   │  │
│  └──────────────────────┬───────────────────────────────────┘  │
│                         │                                       │
│  ┌──────────────────────▼───────────────────────────────────┐  │
│  │            Business Logic (Services)                     │  │
│  │  - ChatService                                          │  │
│  │  - UserService                                          │  │
│  │  - MessageService                                       │  │
│  │  - RoomService                                          │  │
│  └──────────────────────┬───────────────────────────────────┘  │
│                         │                                       │
│  ┌──────────────────────▼───────────────────────────────────┐  │
│  │            Data Access Layer (Repositories)              │  │
│  │  - UserRepository                                       │  │
│  │  - MessageRepository                                    │  │
│  │  - ChatRoomRepository                                   │  │
│  └──────────────────────┬───────────────────────────────────┘  │
│                         │                                       │
└─────────────────────────┼───────────────────────────────────────┘
                          │
                ┌─────────▼────────────┐
                │   Database (MySQL)   │
                │  - Users Table       │
                │  - Messages Table    │
                │  - Chat Rooms Table  │
                │  - Sessions Table    │
                └──────────────────────┘

📁 Project Structure

Chat_App/
├── src/
│   ├── main/
│   │   ├── java/
│   │   │   └── com/
│   │   │       └── chatapp/
│   │   │           ├── controller/          # Request handlers
│   │   │           │   ├── AuthController.java
│   │   │           │   ├── ChatController.java
│   │   │           │   └── UserController.java
│   │   │           │
│   │   │           ├── service/            # Business logic
│   │   │           │   ├── ChatService.java
│   │   │           │   ├── UserService.java
│   │   │           │   ├── MessageService.java
│   │   │           │   └── RoomService.java
│   │   │           │
│   │   │           ├── model/              # Entity classes
│   │   │           │   ├── User.java
│   │   │           │   ├── Message.java
│   │   │           │   ├── ChatRoom.java
│   │   │           │   └── UserSession.java
│   │   │           │
│   │   │           ├── repository/         # Data access
│   │   │           │   ├── UserRepository.java
│   │   │           │   ├── MessageRepository.java
│   │   │           │   └── ChatRoomRepository.java
│   │   │           │
│   │   │           ├── websocket/          # WebSocket handling
│   │   │           │   ├── WebSocketHandler.java
│   │   │           │   ├── WebSocketConfig.java
│   │   │           │   └── MessageListener.java
│   │   │           │
│   │   │           ├── config/             # Configuration classes
│   │   │           │   ├── SecurityConfig.java
│   │   │           │   ├── WebConfig.java
│   │   │           │   └── DatabaseConfig.java
│   │   │           │
│   │   │           ├── util/               # Utility classes
│   │   │           │   ├── JwtUtil.java
│   │   │           │   └── ValidationUtil.java
│   │   │           │
│   │   │           └── ChatApplication.java # Main application
│   │   │
│   │   ├── resources/
│   │   │   ├── application.properties     # Application configuration
│   │   │   ├── application-dev.properties
│   │   │   ├── templates/                 # Thymeleaf templates
│   │   │   │   ├── index.html
│   │   │   │   ├── login.html
│   │   │   │   ├── register.html
│   │   │   │   ├── chat.html
│   │   │   │   ├── rooms.html
│   │   │   │   └── profile.html
│   │   │   └── static/                    # Static files
│   │   │       ├── css/
│   │   │       │   └── style.css
│   │   │       └── js/
│   │   │           ├── chat.js
│   │   │           ├── websocket.js
│   │   │           └── app.js
│   │   │
│   │   └── test/                         # Test classes
│   │       └── java/
│   │           └── com/chatapp/
│   │               ├── ChatServiceTest.java
│   │               ├── UserServiceTest.java
│   │               └── WebSocketTest.java
│   │
│   └── pom.xml                           # Maven dependencies
│
├── .gitignore
├── .gitattributes
├── mvnw & mvnw.cmd                       # Maven wrapper scripts
└── README.md                             # This file

📦 Prerequisites

Before you begin, ensure you have the following installed:

Java 8+ (Java 11 or 17 recommended)
Maven 3.6+ or Gradle 6.0+
MySQL 5.7+ or PostgreSQL 10+
Git
Node.js (optional, for frontend development)

Optional

Docker (for containerized deployment)
Redis (for session caching)
Nginx (for reverse proxy)

🚀 Installation & Setup

Step 1: Clone the Repository

git clone https://github.com/anushkax2311/Chat_App.git
cd Chat_App

Step 2: Database Setup

Option A: MySQL

# Create database
mysql -u root -p -e "CREATE DATABASE chat_app_db CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;"

# Create user (optional)
mysql -u root -p -e "CREATE USER 'chat_user'@'localhost' IDENTIFIED BY 'password123';"
mysql -u root -p -e "GRANT ALL PRIVILEGES ON chat_app_db.* TO 'chat_user'@'localhost';"
mysql -u root -p -e "FLUSH PRIVILEGES;"

Option B: PostgreSQL

# Create database
createdb chat_app_db

# Create user (optional)
createuser chat_user
psql -U postgres -d chat_app_db -c "ALTER USER chat_user WITH PASSWORD 'password123';"

Option C: Docker Compose (Recommended)

Create a docker-compose.yml:

version: '3.8'

services:
  mysql:
    image: mysql:8.0
    container_name: chat_app_db
    ports:
      - "3306:3306"
    environment:
      MYSQL_ROOT_PASSWORD: root123
      MYSQL_DATABASE: chat_app_db
      MYSQL_USER: chat_user
      MYSQL_PASSWORD: password123
    volumes:
      - mysql_data:/var/lib/mysql

volumes:
  mysql_data:

Start the database:

docker-compose up -d

Step 3: Configure Application

Edit src/main/resources/application.properties:

# Server Configuration
server.port=8080
server.servlet.context-path=/

# Spring Application
spring.application.name=chat-app

# Database Configuration
spring.datasource.url=jdbc:mysql://localhost:3306/chat_app_db
spring.datasource.username=chat_user
spring.datasource.password=password123
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver

# JPA/Hibernate Configuration
spring.jpa.hibernate.ddl-auto=update
spring.jpa.show-sql=false
spring.jpa.properties.hibernate.dialect=org.hibernate.dialect.MySQL8Dialect
spring.jpa.properties.hibernate.format_sql=true

# WebSocket Configuration
spring.websocket.enabled=true
spring.websocket.path=/ws

# Thymeleaf Configuration
spring.thymeleaf.mode=HTML
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.cache=false

# Logging Configuration
logging.level.root=INFO
logging.level.com.chatapp=DEBUG

# Session Configuration
server.servlet.session.timeout=1h
spring.session.store-type=jdbc

# File Upload Configuration
spring.servlet.multipart.max-file-size=5MB
spring.servlet.multipart.max-request-size=10MB

# Security
app.jwt.secret=your-secret-key-here-change-in-production
app.jwt.expiration=86400000

Step 4: Build the Application

# Using Maven wrapper (no Maven installation needed)
./mvnw clean install

# Or using installed Maven
mvn clean install

Step 5: Run the Application

# Using Maven wrapper
./mvnw spring-boot:run

# Or using installed Maven
mvn spring-boot:run

# Or running the JAR file
java -jar target/chat-app.jar

The application should now be running at http://localhost:8080

⚙️ Configuration

Application Properties Examples

Development Configuration

spring.jpa.hibernate.ddl-auto=create-drop
spring.jpa.show-sql=true
logging.level.com.chatapp=DEBUG
spring.devtools.restart.enabled=true

Production Configuration

spring.jpa.hibernate.ddl-auto=validate
spring.jpa.show-sql=false
logging.level.com.chatapp=WARN
server.compression.enabled=true
spring.thymeleaf.cache=true

WebSocket Configuration

The application uses STOMP protocol over WebSocket for real-time messaging.

// JavaScript WebSocket Example
const socket = new SockJS('/ws');
const stompClient = Stomp.over(socket);

stompClient.connect({}, function(frame) {
    console.log('Connected: ' + frame.headers['server']);
    
    // Subscribe to room messages
    stompClient.subscribe('/topic/room/123', function(message) {
        console.log('New message: ' + message.body);
    });
});

📊 Usage

User Registration

curl -X POST http://localhost:8080/api/auth/register \
  -H "Content-Type: application/json" \
  -d '{
    "username": "john_doe",
    "email": "john@example.com",
    "password": "secure_password123"
  }'

User Login

curl -X POST http://localhost:8080/api/auth/login \
  -H "Content-Type: application/json" \
  -d '{
    "email": "john@example.com",
    "password": "secure_password123"
  }'

Create Chat Room

curl -X POST http://localhost:8080/api/rooms \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer {token}" \
  -d '{
    "name": "General Discussion",
    "description": "General chat for all users",
    "isPrivate": false
  }'

Send Message via WebSocket

stompClient.send("/app/chat", {}, JSON.stringify({
    sender: "john_doe",
    content: "Hello everyone!",
    roomId: 123,
    timestamp: new Date()
}));

Access Chat Interface

Simply navigate to http://localhost:8080 in your browser after logging in.

🔌 API Endpoints

Authentication Endpoints

Method	Endpoint	Description
POST	`/api/auth/register`	Register a new user
POST	`/api/auth/login`	User login
POST	`/api/auth/logout`	User logout
POST	`/api/auth/refresh`	Refresh authentication token
GET	`/api/auth/verify`	Verify token validity

User Endpoints

Method	Endpoint	Description
GET	`/api/users/{id}`	Get user profile
PUT	`/api/users/{id}`	Update user profile
DELETE	`/api/users/{id}`	Delete user account
GET	`/api/users/search`	Search users
GET	`/api/users/online`	Get online users

Chat Room Endpoints

Method	Endpoint	Description
GET	`/api/rooms`	Get all chat rooms
POST	`/api/rooms`	Create new chat room
GET	`/api/rooms/{id}`	Get room details
PUT	`/api/rooms/{id}`	Update room
DELETE	`/api/rooms/{id}`	Delete room
POST	`/api/rooms/{id}/join`	Join a room
POST	`/api/rooms/{id}/leave`	Leave a room

Message Endpoints

Method	Endpoint	Description
GET	`/api/messages/{roomId}`	Get room messages
GET	`/api/messages/dm/{userId}`	Get direct messages
POST	`/api/messages`	Send message (REST)
DELETE	`/api/messages/{id}`	Delete message

📡 WebSocket Events

STOMP Endpoints

# Send message to room
/app/chat/send

# Subscribe to room messages
/topic/room/{roomId}

# Subscribe to direct messages
/topic/dm/{userId}

# Subscribe to user status
/topic/status/{userId}

# Subscribe to typing indicators
/topic/typing/{roomId}

Message Format

{
  "id": "msg-123",
  "sender": "john_doe",
  "senderId": 1,
  "content": "Hello world!",
  "roomId": 5,
  "messageType": "TEXT",
  "timestamp": "2024-03-27T10:30:00Z",
  "isEdited": false,
  "reactions": ["👍", "❤️"]
}

🛠️ Technologies Used

Backend

Spring Boot 2.x/3.x - Application framework
Spring Security - Authentication & authorization
Spring Data JPA - Data access
Spring WebSocket - Real-time communication
Spring Thymeleaf - Server-side templating

Frontend

Thymeleaf - Template engine
HTML5 - Markup language
CSS3 - Styling
JavaScript (Vanilla/jQuery) - Client-side scripting
SockJS - WebSocket emulation
STOMP - Messaging protocol

Database

MySQL 8.0 / PostgreSQL
JPA/Hibernate - ORM

Build & Tools

Maven - Build automation
Git - Version control
JUnit - Unit testing
Mockito - Mocking framework

💾 Database Schema

Users Table

CREATE TABLE users (
  id BIGINT PRIMARY KEY AUTO_INCREMENT,
  username VARCHAR(50) UNIQUE NOT NULL,
  email VARCHAR(100) UNIQUE NOT NULL,
  password_hash VARCHAR(255) NOT NULL,
  full_name VARCHAR(100),
  avatar_url VARCHAR(255),
  status ENUM('ONLINE', 'OFFLINE', 'AWAY') DEFAULT 'OFFLINE',
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
);

Messages Table

CREATE TABLE messages (
  id BIGINT PRIMARY KEY AUTO_INCREMENT,
  sender_id BIGINT NOT NULL,
  room_id BIGINT,
  receiver_id BIGINT,
  content LONGTEXT NOT NULL,
  message_type ENUM('TEXT', 'IMAGE', 'FILE') DEFAULT 'TEXT',
  is_edited BOOLEAN DEFAULT FALSE,
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  FOREIGN KEY (sender_id) REFERENCES users(id),
  FOREIGN KEY (room_id) REFERENCES chat_rooms(id),
  FOREIGN KEY (receiver_id) REFERENCES users(id)
);

Chat Rooms Table

CREATE TABLE chat_rooms (
  id BIGINT PRIMARY KEY AUTO_INCREMENT,
  name VARCHAR(100) NOT NULL,
  description TEXT,
  created_by BIGINT NOT NULL,
  is_private BOOLEAN DEFAULT FALSE,
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  FOREIGN KEY (created_by) REFERENCES users(id)
);

Room Members Table

CREATE TABLE room_members (
  id BIGINT PRIMARY KEY AUTO_INCREMENT,
  room_id BIGINT NOT NULL,
  user_id BIGINT NOT NULL,
  joined_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  UNIQUE KEY unique_member (room_id, user_id),
  FOREIGN KEY (room_id) REFERENCES chat_rooms(id),
  FOREIGN KEY (user_id) REFERENCES users(id)
);

🤝 Contributing

Contributions are welcome! To contribute:

Fork the repository
Create a feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

Development Guidelines

Follow Java naming conventions
Write unit tests for new features
Keep commits atomic and well-described
Update documentation when needed
Run tests before submitting PR: mvn test

📝 License

This project is open source and available under the MIT License.

🆘 Troubleshooting

Issue: Connection Refused Error

Cause: Database connection failed Solution:

# Check if MySQL is running
mysql -u root -p -e "SELECT 1;"

# Verify database exists
mysql -u root -p -e "SHOW DATABASES;"

# Check application.properties credentials
cat src/main/resources/application.properties | grep datasource

Issue: WebSocket Connection Failed

Cause: WebSocket endpoint not configured properly Solution:

# Ensure WebSocket is enabled in application.properties
spring.websocket.enabled=true
spring.websocket.path=/ws

Issue: Port Already in Use

Solution: Change port in application.properties

server.port=8081

Issue: Template Not Found

Cause: Thymeleaf templates in wrong location Solution: Ensure templates are in src/main/resources/templates/

Issue: Authentication Token Expired

Solution: Login again or refresh token

curl -X POST http://localhost:8080/api/auth/refresh \
  -H "Authorization: Bearer {expired_token}"

🔒 Security Considerations

Always use HTTPS in production
Change JWT secret in production
Implement rate limiting for API endpoints
Use prepared statements for SQL queries (JPA does this automatically)
Validate all user inputs
Keep dependencies updated: mvn dependency:check

📚 Additional Resources

📞 Support

For questions or issues:

Open an issue on GitHub Issues
Check existing issues and discussions
Review the documentation

🎉 Acknowledgments

Thanks to all contributors and the open-source community for making this project possible.

Made with ❤️ by anushkax2311

⭐ If this project helped you, please consider giving it a star!

Name		Name	Last commit message	Last commit date
Latest commit History 2 Commits
.mvn/wrapper		.mvn/wrapper
src		src
.gitattributes		.gitattributes
.gitignore		.gitignore
README.md		README.md
mvnw		mvnw
mvnw.cmd		mvnw.cmd
pom.xml		pom.xml

Folders and files

Latest commit

History

Repository files navigation

💬 Full-Stack Chat Application

📋 Table of Contents

🎯 Overview

✨ Features

🏗️ Architecture

System Architecture

📁 Project Structure

📦 Prerequisites

Optional

🚀 Installation & Setup

Step 1: Clone the Repository

Step 2: Database Setup

Option A: MySQL

Option B: PostgreSQL

Option C: Docker Compose (Recommended)

Step 3: Configure Application

Step 4: Build the Application

Step 5: Run the Application

⚙️ Configuration

Application Properties Examples

Development Configuration

Production Configuration

WebSocket Configuration

📊 Usage

User Registration

User Login

Create Chat Room

Send Message via WebSocket

Access Chat Interface

🔌 API Endpoints

Authentication Endpoints

User Endpoints

Chat Room Endpoints

Message Endpoints

📡 WebSocket Events

STOMP Endpoints

Message Format

🛠️ Technologies Used

Backend

Frontend

Database

Build & Tools

💾 Database Schema

Users Table

Messages Table

Chat Rooms Table

Room Members Table

🤝 Contributing

Development Guidelines

📝 License

🆘 Troubleshooting

Issue: Connection Refused Error

Issue: WebSocket Connection Failed

Issue: Port Already in Use

Issue: Template Not Found

Issue: Authentication Token Expired

🔒 Security Considerations

📚 Additional Resources

📞 Support

🎉 Acknowledgments

About

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Uh oh!

Contributors

Uh oh!

Languages

Packages