Checkers Board Game

I wanted to build a web based checkers board game from scratch that is the same as the original that we all know and love. Allowing two players to play against each other and win by removing all of the other players pieces. It should allow players to jump opponent pieces and king the correct pieces if they reach the far end of the board.

A game like this would require keeping track of the game state internally and calculate many different move possibilities for each player with a focus on DOM manipulation and conditionals allowing me to practice critical javaScript and front-end features while gaining the type safety to catch errors provided by typeScript.

I recently began to learn typeScript and wanted my own project to begin working with static typing and hence decided to go with checkers as a game I remember playing often at school. While it is not a project that would be heavy on complex types I thought it would be a good intro to learn the basics in a real project and recognize the benefits of reducing the possibility of introducing bugs into the code.

As a project with few moving pieces, a framework or library was not required in this case so I went with plain html and css and used webpack to bundle and optimize the typeScript modules.

Finally testing was carried out using a combination of jest and testing-library as my optimal choice for this requirement. I like the use of the testing-library even outside of using react for its focus on leaving out the testing of implementation details meaning changes to these details won't end up breaking tests.

The overall outcome is a fully-functioning and performant version of a checkers board game built for the web. It is also responsive for a wide range of screen sizes allowing users to play the game on their phones or desktop.

It allowed me to explore the basics of typeScript such as using many of the new types introduced, type guards, optional chaining and more. After using typeScript in a full project I believe it was important in helping me avoid unnecessary errors and look forward to learning its more advanced features.

As far as improvements go, I could add a feature to allow the players to decide who plays first and also add support for dragging and dropping the pieces as opposed to only clicking using the drag and drop api.