ChessBD

A comprehensive chess platform for the Bangladesh chess community, featuring game analysis, player profiles, events, clubs, and learning resources.

Features

🎮 Chess Features

• Game Analysis: Advanced PGN analysis with Stockfish 17 engine
  • Move quality classification (Brilliant, Great, Best, Excellent, Good, Inaccuracy, Mistake, Miss, Blunder)
  • Win percentage calculations
  • Position evaluation graphs
  • Best move suggestions
• Chess Engine: Interactive engine analysis with Stockfish 17
• Bot Games: Play against AI bots with different difficulty levels
• Puzzles: Chess puzzles and tactics training

👥 Community Features

• Player Profiles: View player statistics, ratings, and game history
• Leaderboards: Rankings and statistics
• Events: Tournament and event management
• Clubs: Chess club directory and details
• Forum: Community discussions
• News: Chess news and updates

📚 Learning Resources

• Interactive Lessons: Step-by-step chess tutorials
• Video Tutorials: Educational chess videos
• Recommended Books: Chess literature recommendations
• Practice Games: Training games and exercises

🗺️ Location Features

• District Map: Interactive map of Bangladesh districts
• Club Locations: Find chess clubs by location

🌐 Additional Features

• Multi-language support (English, Bengali)
• Dark/Light theme switching
• Responsive design
• User authentication and profiles
• Search functionality
• Watch live games

Tech Stack

Frontend

• React 19 - UI library
• Vite 7 - Build tool and dev server
• React Router 7 - Routing
• Zustand - State management
• React Query - Data fetching and caching
• Lucide React - Icons

Chess

• chess.js - Chess logic and PGN parsing
• react-chessboard - Chess board component
• Stockfish 17 - Chess engine (WebAssembly)

Backend & Services

• Firebase - Authentication, Firestore, Realtime Database
• Netlify - Hosting and Deployment

Utilities

• date-fns - Date formatting
• react-markdown - Markdown rendering
• leaflet - Interactive maps

Prerequisites

• Node.js 18+ and npm
• Firebase account and project setup
• Git

Installation

1. Clone the repository

   git clone https://github.com/abdussamiakanda/chessBD.git
   cd chessBD

2. Install dependencies

   npm install

3. Set up Firebase

   • Create a Firebase project at Firebase Console
   • Enable Authentication, Firestore, and Realtime Database
   • Copy your Firebase configuration
   • Create a .env.local file in the root directory:

     VITE_FIREBASE_API_KEY=your_api_key
     VITE_FIREBASE_AUTH_DOMAIN=your_auth_domain
     VITE_FIREBASE_PROJECT_ID=your_project_id
     VITE_FIREBASE_STORAGE_BUCKET=your_storage_bucket
     VITE_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id
     VITE_FIREBASE_APP_ID=your_app_id
     VITE_FIREBASE_DATABASE_URL=your_database_url

4. Stockfish Engine Files

   • The Stockfish 17 engine files should be in public/engines/stockfish-17/
   • Ensure both multi-threaded and single-threaded versions are present:
     • stockfish-17.js and stockfish-17-part-*.wasm (multi-threaded)
     • stockfish-17-single.js and stockfish-17-single-part-*.wasm (single-threaded)

Development

1. Start the development server

   npm run dev

2. Open your browser

   • Navigate to http://localhost:5173 (or the port shown in terminal)

3. Lint your code

   npm run lint

Building for Production

1. Build the project

   npm run build

2. Preview the production build

   npm run preview

Deployment to Netlify

Prerequisites

• Netlify account
• Git repository (GitHub, GitLab, or Bitbucket)

Steps

1. Push your code to Git

   git add .
   git commit -m "Prepare for Netlify deployment"
   git push origin main

2. Connect to Netlify

   • Go to Netlify
   • Click "Add new site" → "Import an existing project"
   • Connect your Git repository
   • Netlify will auto-detect the build settings from netlify.toml

3. Configure Environment Variables

   • In Netlify dashboard, go to Site settings → Environment variables
   • Add all required variables from .env.example:
     • VITE_FIREBASE_API_KEY
     • VITE_FIREBASE_AUTH_DOMAIN
     • VITE_FIREBASE_PROJECT_ID
     • VITE_FIREBASE_STORAGE_BUCKET
     • VITE_FIREBASE_MESSAGING_SENDER_ID
     • VITE_FIREBASE_APP_ID
     • VITE_FIREBASE_MEASUREMENT_ID
     • VITE_FIREBASE_DATABASE_URL
     • VITE_GROK_API_KEY (optional)

4. Deploy

   • Netlify will automatically build and deploy on every push to your main branch
   • Or trigger a manual deploy from the Netlify dashboard

Netlify Configuration

The netlify.toml file includes:

• Build command: npm run build
• Publish directory: dist
• SPA redirects (all routes → /index.html)
• Security headers
• Caching headers for static assets

Custom Domain

1. In Netlify dashboard, go to Site settings → Domain management
2. Add your custom domain
3. Follow Netlify's DNS configuration instructions

Project Structure

chessBD/
├── public/
│   ├── engines/
│   │   └── stockfish-17/           # Stockfish engine files
│   ├── bangladesh_geojson_*.json   # Map data
│   └── favicon.svg
├── src/
│   ├── components/                 # Reusable components
│   │   ├── auth/                   # Authentication components
│   │   ├── chess/                  # Chess-related components
│   │   ├── events/                 # Event components
│   │   ├── games/                  # Game components
│   │   ├── maps/                   # Map components
│   │   ├── standings/              # Leaderboard components
│   │   └── ui/                     # UI components
│   ├── contexts/                   # React contexts
│   ├── hooks/                      # Custom React hooks
│   ├── lib/                        # Library code
│   │   ├── api.js                  # API functions
│   │   ├── bots/                   # Bot definitions
│   │   ├── chess/                  # Chess utilities
│   │   ├── engine/                 # Chess engine integration
│   │   ├── firebase.js             # Firebase configuration
│   │   └── utils/                  # Utility functions
│   ├── locales/                    # Translation files
│   ├── pages/                      # Page components
│   │   └── learn/                  # Learning pages
│   ├── store/                      # State management
│   ├── App.jsx                     # Main app component
│   ├── main.jsx                    # Entry point
│   └── index.css                   # Global styles
├── .gitignore
├── netlify.toml                    # Netlify configuration
├── package.json
├── vite.config.js                  # Vite configuration
└── README.md

Key Components

Analysis Page

• PGN upload and parsing
• Move-by-move analysis with Stockfish 17
• Move quality indicators
• Evaluation graphs
• Player information display

Chess Engine

• Interactive engine analysis
• Position evaluation
• Best move calculation
• Multi-threaded support

Player Profiles

• Statistics and ratings
• Game history
• Chess.com and Lichess integration

Configuration

Netlify Configuration

The netlify.toml file contains deployment configuration:

• Build command and publish directory
• SPA routing redirects
• Security headers
• Caching headers for static assets and WASM files

Vite Configuration

The vite.config.js handles:

• React plugin
• Worker configuration
• WASM file handling
• Build output optimization

Browser Support

• Chrome/Edge (latest)
• Firefox (latest)
• Safari (latest)
• Requires WebAssembly support for chess engine

Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

License

This project is private and proprietary.

Contact

For questions or support, please contact the project maintainer.

---

Built with ❤️ for the Bangladesh chess community