/Chessy

Chessy, a chess website featuring multiplayer support via socket.io, integrated WebRTC video conferencing for player interaction, and included Stockfish chess engine for solo play.

Primary LanguageJavaScript

Chessy

Chessy is an online chess platform that provides an immersive gaming experience for chess enthusiasts of all skill levels. With Chessy, you can participate in a real-time chess game against the awesome Stockfish Chess Engine, offering unmatched challenges and the chance to sharpen your tactical skills

But Chessy goes beyond just playing singles. It has an exciting multiplayer experience that allows you to engage in exciting chess battles with fellow players from all over the world. What sets Chessy apart is its seamless video streaming integration, which not only allows you to test your mettle against opponents but also to see their movements and actions in real time via a live video feed.

Whether you want to improve your chess skills through intense battles with stockfish or explore the thrill of competing with other chess enthusiasts while maintaining visual communication, Chessie offers games into a unique experience that satisfies your every craving for chess

Features

  • Chessy offers real-time multiplayer chess through socket.io, offering interactive and dynamic gameplay.

  • Integrates the Chessy Stockfish chess engine, providing users with stronger and more competitive AI opponents to play against.

  • Chasey goes beyond traditional conferencing with integrated video conferencing, increasing social interaction as players can see each other as they play

  • Chessy allows users to choose from different difficulty levels (easy, medium, and hard) when playing against the Stockfish chess engine, ensuring fair difficulty for players of all skill levels

Structure

  • The frontend of the website is built using HTML, CSS, and - JavaScript.
  • HTML is used for structuring the webpage, CSS for styling, and JavaScript for interactivity.
  • All chess moves are handled and executed using JavaScript. This includes moves by the user and the moves generated by the Stockfish chess engine

Structure of the game against Stocfish:

  • Flask, a Python web framework, is used to create a backend server for handling Stockfish integration.
  • The frontend JavaScript code computes the FEN (Forsyth-Edwards Notation) notation based on the current configuration of the chessboard.
  • FEN notation is a standard way to describe a particular board position in chess.
  • When the user makes a move, JavaScript computes the FEN notation reflecting the new board position.
  • After computing the FEN notation, the frontend sends an API request to the Flask server.
  • The request includes two parameters: the FEN notation and the difficulty level selected by the user (easy, medium, or hard)
  • It then uses a Python library for Stockfish to analyze the position.
  • The analysis is tailored according to the user-selected difficulty level (e.g., easy - 500 Elo, medium - 1500 Elo, hard - 2500 Elo).
  • Stockfish's analysis result is sent back as a response from the Flask server to the frontend.
  • The response typically contains the recommended move or the best move according to the chosen difficulty level.
  • The frontend JavaScript processes the move and handles various aspects of chess, such as pawn promotion and castling, based on the rules of the game.
  • The frontend updates the chessboard display with the new move.

Structure of the game in Muliplayer Mode:

  • Socket.io, a JavaScript library, is used to establish real-time bidirectional communication between the users and the server.It allows users to send and receive chess moves instantly.
  • Node.js is employed as the server-side runtime environment for the application.
  • WebRTC (Web Real-Time Communication) technology is incorporated to enable video and audio communication between users.
  • Users can see and hear each other during the game, enhancing the multiplayer experience.
  • Agora.io is utilized as a signaling server to establish WebRTC connections between users. It helps with the initial setup and negotiation required for WebRTC communication.
  • To maintain a synchronized game state between all players, the server broadcasts the game status, including the board configuration, to all connected clients.
  • Users can make chess moves, see each other's video feeds, and hear audio communication simultaneously.
  • The real-time nature of the system allows for interactive and engaging multiplayer chess matches.

Tech Used:

Frontend: HTML, CSS, Javascript
Backend: Node.js, Express, Flask, Python

UI of the game

Chessy Index Page:

Chessy gameplay opponent Stockfish:

Chessy gameplay opponent Friend: