Skip to content

ComputerVirusWannabe/chessts

Repository files navigation

♟️ Chess Engine & Web App

A fully playable chess application built from scratch by using React and TypeScript, featuring:

  • a custom chess engine,
  • legal move validation,
  • AI opponent support,
  • interactive UI,
  • and full implementation of official chess rules.

Live Demo

Play online here:


Features

♟️ Complete Chess Rules

The engine fully supports:

  • Legal move generation
  • Check and checkmate detection
  • Castling
  • En passant
  • Pawn promotion
  • Turn validation
  • Piece capture logic
  • FEN board state generation for engine interoperability

AI Opponent

Includes a custom-built chess AI using:

  • Minimax search
  • Alpha-beta pruning
  • Board evaluation heuristics

The engine is capable of playing complete games and provides a solid challenge for casual and intermediate players.

Interactive UI

Designed for usability and readability:

  • Highlighted legal moves
  • Last-move highlighting
  • Visual check indicators
  • Responsive board interactions
  • Human vs Human mode
  • Human vs AI mode
  • PGN export/import controls
  • Undo/redo controls

Performance-Focused Architecture

The project separates:

  • board state management,
  • move generation,
  • rule validation,
  • AI search,
  • and UI rendering

to keep the codebase modular and maintainable.

The application is divided into several core systems:

  • Move Generation — Generates pseudo-legal and legal moves
  • Rule Validation — Handles check, checkmate, castling, and en passant
  • Search Engine — Implements minimax with alpha-beta pruning
  • Evaluation Engine — Scores board states heuristically
  • UI Layer — Handles rendering and player interaction
  • State Management — Synchronizes board updates and turn logic

How to Play

Playing Against the AI

  • Your pieces always appear at the bottom of the board.
  • Click a piece to display all legal moves.
  • Legal move squares are highlighted in yellow.

Game Indicators

  • The opponent’s last move is highlighted for clarity.
  • When a king is in check:
    • the king’s square turns green,
    • and flashes red as a warning.

Game Modes

Choose between:

  • Human vs Human
  • Human vs AI

AI Overview

The chess engine currently uses:

  • Minimax search
  • Alpha-beta pruning

Recent upgrades include:

  • Zobrist hashing
  • Transposition tables
  • Quiescence Search
  • Heuristic evaluation

The AI is functional and competitive for many players.


Tech Stack

  • React
  • TypeScript
  • JavaScript
  • CSS
  • Vercel Deployment

Project Goals

This project was created to explore:

  • game engine architecture,
  • adversarial search algorithms,
  • recursive problem solving,
  • state management,
  • and frontend/UI engineering.

The long-term goal is to continue improving the engine strength and overall polish.


Known Issues

  • Checkmate notification may occasionally trigger too early when the AI wins.
  • AI on hard difficulty may take noticeable time in sharp tactical positions due to deeper search depth.

Future Improvements

Planned features include:

  • Engine statistics and analysis tools
  • Multiplayer support
  • Mobile UI improvements
  • Stronger evaluation tuning
  • Web Worker-based AI threading (non-blocking search)

Running Locally

git clone https://github.com/ComputerVirusWannabe/test.git
npm install
npm run dev

Then open the local development URL shown in the terminal.


Why This Project Matters

Chess engines are deceptively complex systems involving:

  • recursive search,
  • optimization,
  • rule validation,
  • state synchronization,
  • and performance engineering.

This project was built entirely from scratch as both a technical challenge and a way to deepen understanding of software engineering and AI fundamentals.


About

Chess UI in Typescript + React

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages