My return to chess

Chess is a war over the board. The object is to crush the opponent's mind.

Bobby Fischer, chess grandmaster

The pawns are pushed, the bishops set,
The horses out the stall;
A castled king, a centered queen,
The rooks ready for war.

Back in college, I played lots of chess. I would play with my fellow college mates for fun when there were power outages during the day (which happened a lot back in my home country, Nigeria).

Ever since I've left college, I've played chess on and off. I would go to meetups (through meetup.com) to play with random people and get floored every time. I tried playing online for a while, but I prefer over-the-board games. I like to hold the pieces, see the board fully, and look my opponents in the eye. Without all that, are you really playing chess?

A friend of mine recently asked me to join chess.com. I was reluctant at first because I don't like to play online. Plus, if I was going to play online, I would rather play on matches on lichess instead, since it's open-source. However, after we spoke on the phone, I was convinced to try it out.

But first, I had to fix the over-the-board issue.

Electronic chess

I don't like playing chess on a flat board (on a flat screen) so I had to find a solution online.

After a little googling, I stumbled upon Chess Up 2 and Chessnut Evo. Both are electronic chessboards for playing chess online and offline. What's special about these chessboards is that they have built-in screens and chess squares that light up. They both looked pretty good in the YouTube videos I watched.

After little contemplation, I purchased the Chess Up 2 board. I was skeptical at first, because I didn't know how much I'd like it. I was even more skeptical when I received the first board because it didn't work properly. None of the squares lit up, but the built-in screen seemed to work.

I had to contact Bryght Labs (i.e. the makers of Chess Up 2) via email. After a little back and forth, they sent me a brand new board and voila! Everything worked!

I've used the device for a couple days now, and I can say that it's money well spent. I like all the features of the board and the fact that I could play online games with it. I can play AI and even get AI to assist me against AI opponents. I never knew I would love chess again this much.¹

Using the chessboard element

The next step was to blog about my new (or should I say resurrected) hobby. I want to share the games I play so I (and everyone that visits this blog) could watch them again and again.

I learned about the <chess-board> web component and I was blown away! It's an open-source, custom HTML element that displays a chessboard on a web page. I coupled that with the chess.js module and created a way to display my games.

So after I played my first online game with my friend, I downloaded the Portable Game Notation (PGN) file from the chess.com Android app and sent it to my computer. I parsed all the moves and loaded them into a JS array, then I created a class called ChessGame that handles everything for me. ChessGame combines the display of <chessboard-element> and the logic of chess.js to bring my games to life.

The JS file for this page looks something like this:

import { ChessGame } from "../common/chess-game.js";

const moves = [...]; // An array of moves

const board = document.querySelector("#board");
const game = new ChessGame(board, moves);

const backButton = document.querySelector("#back-button");
const nextButton = document.querySelector("#next-button");
const resetButton = document.querySelector("#reset-button");
const flipButton = document.querySelector("#flip-button");

backButton.onclick = e => game.undoMove();
nextButton.onclick = e => game.makeMove();
resetButton.onclick = e => game.reset();
flipButton.onclick = e => game.flipBoard();

With this, I can display games that I've played and allow users to see every move played by me and my opponent.

My first online game

Here's my first online game against my friend that convinced me to join chess.com. I played as black in this game.

I commented on some of the moves. Feel free to playback the game till the end.