This project was bootstrapped frontend with React, backend with Python and database with SQL.

• TypeScript - Type checker.
• Ant Design - Build layout & components.
• Chess.js - Handle chess game.
• Nextjs - Powerful React framework for seamless development.
• FastAPI - High-performance web framework for building APIs with Python.
• Socket.io - Real-time communication for dynamic and interactive features.
• Alembic - Database migrations for efficient management and version control.

Use the package manager npm to install NextChess.

npm install

Run the app frontend in the development mode. Open http://localhost:3000 to view it in the browser.

npm run next-dev

Run the app backend in the development mode. Listen at port http://localhost:8000.

npm run fastapi-dev

• Every alembic script is located at alembic/versions folder.

• Edit alembic script by SQL

• Run to update database

npm run update-db

• To customize environment variables, override values at src/.env (create this file if it doesn't exist).

Define all api for application (eg: login, getUserById, getGame, findGame, ...).

Contains database migration scripts using Alembic for efficient management and version control.

Indexing and organizing application-specific modules and components.

You can write components for application inside this folder. Each component should be self-contained as a module.

Example:

components
├── Admin
│   └── AdminPage.tsx
│
└── Icon
    ├── BotIcon
    │    ├── Cat.tsx
    │    ├── Elephant.tsx
    │    └── index.tsx
    └── ChessPiece
         ├── BlackKing.tsx
         └── index.tsx

Define all shared constants used in application

Define all shared types used in application

Define all shared context and context provider used in application

Define all shared hook used in application

• chesskid.com for UI inspiration
• lichess.org for being the best

2024 @ UET-VNU