Chess Stamps

Chess stamps is a tool for pulling statistics on your chess games played on Lichess and comparing your opening your repertoire to the population. It uses a "stamp collecting" theme.

Live URL: https://www.chessstamps.app

Getting Started

Chess Stamps uses a Flask backend and a React frontend. API calls to the Lichess API are made from the backend.

These instructions will get you a copy of the project up and running on your local machine.

Prerequisites

You need to have Node.js, npm, and Python installed on your machine. You can install Node.js and npm from the official Node.js website and Python from the official Python website.

Setting Up a Virtual Environment

This project uses a virtual environment to manage Python dependencies. To set up the virtual environment:

1. Navigate to the project directory in your terminal.
2. Create a new virtual environment by running the following command:

python3 -m venv venv

Activate the virtual environment:

On Windows, run:

venv\Scripts\activate

On Unix or MacOS, run:

source venv/bin/activate

Installing

1. Clone the repository:

git clone <repository_url>

2. Navigate to the project directory:

cd <project_directory>

3. Install the backend dependencies:

pip install -r requirements.txt

4. Navigate to the client directory:

cd client

5. Install the frontend dependencies:

npm install

6. Create a .env file in the project directory and add your environment variables:

lichessToken = '<your_lichess_token>'
FLASK_ENV = 'development'
LICHESS_CLIENT_ID="lichess-oauth-flask"
SECRET_KEY="<secret_key>"
AUTH_METHOD="oauth"

Replace <your_lichess_token> with a personal access token described here. This is to provide another auth method for dev purposes without having to go through OAuth every time. To stop using OAuth, you can change the AUTH_METHOD described in .env.

<SECRET_KEY> is a static secret key for the Flask app. You can generate a secret key using the following Python code:

import secrets
print(secrets.token_hex(16))

Running the Application

To run the backend, navigate to the project directory and execute the following command:

flask run

To run the frontend, navigate to the client directory and execute the following command:

npm start

The backend will start and be available at http://localhost:5000, and the frontend will be available at http://localhost:3000.

Built With

• React
• Flask
• Chessboard component from react-chessboard
• Some styles and components from Material-UI. Styling is a mix of CSS and MUI.
• Lichess API for game data and Lichess tables for opening names

Authors

• Kyle Giddon

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

Contributing

To contribute to this project, please open an issue or a pull request.

There are some obvious rooms for improvement, such as:

• The database is very storage-inefficient right now.
• The UI for the "All Stamps" section can have improvements such as filtering by popularity, ply, etc.