Skip to content

Chess webapp, with stockfish integration

Notifications You must be signed in to change notification settings

ChefYeshpal/webapp-chess

Folders and files

NameName
Last commit message
Last commit date

Latest commit

valkarievalkarie
and
Sep 27, 2025
41a1a04 · · Sep 27, 2025

History

102 Commits
Sep 24, 2025
Sep 27, 2025
Sep 27, 2025
Sep 26, 2025
Sep 24, 2025
Sep 26, 2025
Sep 26, 2025
Sep 24, 2025
Sep 26, 2025
Sep 27, 2025
Sep 24, 2025
Sep 24, 2025
Sep 26, 2025

Repository files navigation

webapp-chess

Chess webapp, with stockfish integration Built for siege week 4 (practice week) on hackclub. All it does is allow you to play chess on a super simple website with either yourself or stockfish. Although, I'm making this so that I can fiddle around with stockfish a bit...

The entire point of this project is to help me in making more interactive websites and give me some experience in how to integrate opensource stuff in them.

Stuff I wanna add:

  • Using keyboard keystrokes to move the pieces/using mouse to move the pieces
    • Will not be done, as the week is nearly over and I have a festival (Dusshera) to attend to

Devlogs:

  • 23 Sept 2025
    • Created the project
    • Added index.html, style.css, and app.js files and updated base code
    • Made a square chess board along with movable pieces
      • Currently they're just letters, but we'll see if I can design some of them...
    • Added square number/alphabets to the board
      • Will alternate in colours, depending on which colour square they are on
    • Added system for legal moves and showcase it
  • 24 Sept 2025
    • Removed all that BS for legal moves, used an external library "chess.js" instead for that cause I aint too good abt it bruh...
      • ;/script>
    • Added an intro screen, and choice picker as to what they'd wanna play as
    • Added promotion screen, so that if the pawn reaches the farthest rank then it can be promoted to either: Queen, Rook, Knight, or Bishop
    • Integrated stockfish functionality
      • Enountered CORS (Cross-Origin Resource Sharing) error when tried to load stockfish as a webworker, apparently browsers block this when running stuff locally...
      • Added a custom chess engine worker stockfish-worker.js
        • it runs in a seperate thread and doesn't block any UI Impliments basic UCI (Universal Chess Interface) commandss
        • Uses chess.js (the external library) to generate ONLY legal moves
      • Main engine interface file: stockfish.js
        • Creates & manages the chessworkerrker
        • Handles the UCI
        • Provides the move requests
      • FEN integration makes it work with any board position
      • Engine also automatically retries to start if "engine not ready" error comes
      • Also added ai toggle, so can only use stockfish for a few moves if wanting to.
  • 25 Sept 2025
    • Added king check find out mechanics
      • updateCheckStatus function: It manages the check visual indicators for the king
      • Called after every move from updateBoard
    • findKingSquare(color)
      • Locates the king piece on specific color on the board
      • parameters are either w (white) or b (black)
    • Added css animations for the king square when the king is in check
    • Added move history dialogue
      • Also added a delete history button, dunno where it would be used tho
      • But, there's a noice singular plural form condition I used :p
    • Added so that a warning message pops up when you access via mobile, was pretty easy tbh...
      • I just dont know when it'll be popping up and all, I'm kinda too laxy to test it from my mobile and all
      • Was trying to add a button where if they click that, then they go to the home page of their browser
      • It doesn't really work that well, but eh at least it's there...
    • Added the gyrating feature thing for whatever the piece that's checking the king is
    • Added a feature where if you move a piece, then the previous square and the current square light up a lil, should help with noticing the moves done by the ai cause it's too fast
      • Maybe I should add some delay to the ai? but that'd break the fluidity at times...
  • 26 Sept 2025
    • Added a export option for moves
    • Updated comments
    • Added end game dialogue
      • Anarchy chess button
      • OK button, just removes the dialogue
    • Anarchy chess
      • Basically every piece get's a randomised movement pattern, after every move, each piece's movement pattern get's reset.
      • I dont know how this'll work properly, cause I wont test this... Seriously, I dont have the brainpower to do so
      • This should be able to add a easter egg or something to the game ig?
  • 27 Sept 2025
    • AI get's disabled when anarchy chess starts, this is because ai isn't really good with "Randomised moves", and I dont wanna code more :')
    • Changed depth in stockfish.js
      • Should make the engine think farther ahead now, make it a little bit more difficult to beat?
      • Although, I didn't find it to become harder in any way...

End notes

I probably wont update this again, at least not until there's something new I want to do in this (which, to be fair, is mostly done anywyas) This project was made for Siege week 4, thanks a lot to those guys cause they're single handedly helping me learn javascript..

About

Chess webapp, with stockfish integration

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published