HexaChess
A hexagonal chess variant with online multiplayer, built to get comfortable with WebSockets.
1 Aug 2023
Abstract
HexaChess is chess played on a hexagonal board. Same rules, one big twist: a piece can move along six axes, not four. I built it with React and Node, and it’s a full multiplayer game with server-side rule validation.
Features
- Fully implemented hexagonal chess rules
- Multiplayer online game with a lobby system
- Shows possible moves for each piece
- Tracks move history
- Score and captured pieces tracking
- Server-side validation of moves and game state
Inspiration
This project was inspired by CGP Grey’s video Can Chess, with Hexagons? and a general fascination with hexagonal grids. I also wanted to learn more about WebSockets and how you can use them to implement a multiplayer game.
Technologies
Client
- React with TypeScript
- Tailwind CSS
- Valtio (state management)
- Vite (bundler)
- immer (immutable state)
Server
- Node.js with TypeScript
- WebSockets
Limitations
Due to the nature of the hexagonal grid, the game is not fully responsive. It is playable on mobile devices, but the UI is not optimized for smaller screens. The server is hosted on the free tier of Render.com and may take a few seconds to wake up, as well as being limited to 15 minutes of activity until it goes to sleep again.
Screenshots
Pre-game lobby:
Initial board:
Mid-game board with side panel open:
