♟️ ChessMate

A full-stack real-time multiplayer chess platform with AI-powered gameplay using Stockfish.

📌 Overview

ChessMate is a full-stack chess application built with the MERN stack, designed to provide an interactive chess experience with AI-powered gameplay and real-time multiplayer functionality.

Users can play against a Stockfish-powered AI opponent, compete with other players in real time, play locally with friends, solve chess puzzles, and track their game history and statistics.

The project demonstrates the implementation of real-time communication, chess game-state management, authentication, database integration, and AI-powered gameplay in a modern web application.

✨ Features

🤖 AI-Powered Gameplay

Play against a Stockfish-powered chess engine.
AI generates moves based on the current board position.
Supports standard chess gameplay and legal move validation.
Multiple gameplay modes for different experiences.

🌐 Real-Time Multiplayer

Play chess with players globally.
Real-time game communication using Socket.IO.
Synchronizes moves and game states between players.
Handles multiplayer game sessions in real time.

👥 Local Multiplayer

Two players can play on the same device.
Maintains complete game state and move history.
Supports piece promotion.
Highlights available moves and captures.

♟️ Chess Gameplay

Legal move validation.
Check and checkmate detection.
Piece promotion.
Move history tracking.
Visual move and capture highlights.
Audio effects for moves, captures, check, and checkmate.

🧩 Chess Puzzles

Interactive chess puzzles using predefined FEN positions.
Multiple puzzle scenarios for practice.
Puzzle descriptions and learning resources.
Helps users improve tactical understanding.

🔐 Authentication & Profiles

User registration and login.
JWT-based authentication.
Secure session management.
User profiles.
Game history and statistics.

🎨 Responsive UI

Modern React-based interface.
Responsive design using Tailwind CSS.
Interactive homepage animations.
Typewriter effect and modern UI components.

🏗️ Architecture

                    ┌─────────────────────┐
                    │    React Frontend   │
                    │ React + Tailwind CSS│
                    └──────────┬──────────┘
                               │
                         REST API / Socket.IO
                               │
                               ▼
                    ┌─────────────────────┐
                    │  Node.js + Express  │
                    └─────────┬───────────┘
                              │
                 ┌────────────┴────────────┐
                 │                         │
                 ▼                         ▼
        ┌─────────────────┐       ┌─────────────────┐
        │     MongoDB     │       │    Socket.IO    │
        │ Users & Games   │       │ Real-Time Games │
        └─────────────────┘       └────────┬────────┘
                                           │
                                           ▼
                                  ┌─────────────────┐
                                  │    Stockfish    │
                                  │    Chess AI     │
                                  └─────────────────┘

Technical Implementation

Frontend

React
- Utilizes components for interactive and dynamic interfaces.
- Responsive design ensuring usability across various devices.

Backend

Express.js
- Handles API requests, user authentication, and game state management.
MongoDB
- Robust data storage for user profiles, game histories, and configurations.

Real-Time Features

WebSockets
- Enables real-time communication in multiplayer mode.
- Ensures an engaging and competitive experience.

🔑 Technical Highlights

Built a full-stack chess platform using the MERN stack.
Integrated Stockfish for AI-powered chess gameplay.
Implemented real-time multiplayer using Socket.IO/WebSockets.
Developed chess game-state and move-history management.
Implemented legal move validation and piece promotion.
Added JWT-based authentication and user profiles.
Implemented game history and player statistics.
Developed interactive chess puzzles using FEN positions.
Built a responsive UI using React and Tailwind CSS.
Added audio feedback for chess moves and game events.

📸 Screenshots

⚙️ Installation & Setup

Prerequisites

Node.js
npm
MongoDB / MongoDB Atlas
Git

1. Clone the Repository

git clone https://github.com/Rimjhimv2/ChessMate.git
cd ChessMate

2. Install Dependencies

npm install

If the project has separate frontend and backend folders:

cd client
npm install

cd ../server
npm install

3. Environment Variables

Create a .env file and add:

PORT=your_port
MONGODB_URL=your_mongodb_connection_string
JWT_SECRET=your_jwt_secret
STOCKFISH_URL=your_stockfish_api_url

Important: Never commit .env files or expose secret credentials publicly.

4. Run the Application

npm start

For development:

npm run dev

Open the application at:

http://localhost:3000

📂 Project Structure

ChessMate/
│
├── client/
│   ├── src/
│   ├── components/
│   ├── pages/
│   └── assets/
│
├── server/
│   ├── controllers/
│   ├── models/
│   ├── routes/
│   ├── middleware/
│   └── config/
│
├── public/
├── package.json
└── README.md

🌐 Live Demo

Live Application:
https://reactchess-2mc2.onrender.com/

💻 GitHub Repository

Source Code:
https://github.com/Rimjhimv2/ChessMate

🚀 Future Improvements

ELO-based player rating system
Player matchmaking
Game replay functionality
Advanced chess puzzles
In-game player chat
Tournament mode
Multiple Stockfish difficulty levels

🤝 Contributing

Contributions, issues, and feature requests are welcome.

Fork the repository.
Create a new branch.

git checkout -b feature/your-feature

Make your changes.
Commit your changes.

git commit -m "Add your feature"

Push the branch.

git push origin feature/your-feature

Open a Pull Request.