ghost-chess/README.md
2025-05-31 22:08:46 +09:00

4.8 KiB

Ghost Chess

A Next.js chess application that implements both classic chess and a special variant called "Ghost Chess". Features a complete chess interface with piece movement, game state management, and different game modes.

🎮 Game Features

  • Classic Chess: Standard chess rules with check, checkmate, and stalemate
  • Ghost Chess: Special variant with forced captures and elimination-based win conditions
  • Full chess piece movement and validation
  • Castling and pawn promotion (auto-promotes to queen)
  • Visual move highlighting for valid moves
  • Move history tracking with algebraic notation
  • Captured pieces tracking
  • Game state management

🚀 Development

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

Available Scripts

  • npm run dev - Start development server with Turbo mode
  • npm run build - Build production application
  • npm run lint - Run ESLint checks
  • npm start - Start production server

🐳 Docker Deployment

Prerequisites

  • Docker and Docker Compose installed
  • Oracle A1 instance or any Linux server
  • Open ports: 80 (HTTP), 443 (HTTPS), 3000 (direct app access)

1. Server Setup (Oracle A1 Instance)

# Update system
sudo apt update && sudo apt upgrade -y

# Install Docker
sudo apt install -y docker.io docker-compose

# Start and enable Docker
sudo systemctl start docker
sudo systemctl enable docker

# Add user to docker group
sudo usermod -aG docker $USER

# Log out and back in for group changes to take effect

2. Deploy the Application

Clone the repository and navigate to the project directory:

git clone <your-repository-url> ghost-chess
cd ghost-chess

Option A: Simple Deployment (App Only)

# Deploy only the Next.js application on port 3000
./deploy.sh --no-nginx
# Deploy with Nginx reverse proxy on port 80
./deploy.sh

Option C: SSL/HTTPS Deployment

# First, add your SSL certificates to ./ssl/ directory
mkdir ssl
# Copy your cert.pem and key.pem to ./ssl/

# Deploy with HTTPS support
./deploy.sh --with-ssl

3. Deployment Script Options

The deploy.sh script supports several options:

  • --build-only: Only build the Docker images without deploying
  • --no-nginx: Deploy without Nginx reverse proxy (port 3000)
  • --with-ssl: Deploy with SSL support (requires certificates in ./ssl/)
  • --help: Show help message

4. Managing the Deployment

# Check container status
docker-compose ps

# View application logs
docker-compose logs -f ghost-chess

# View all logs
docker-compose logs -f

# Stop the application
docker-compose down

# Restart the application
docker-compose restart

# Update deployment (after code changes)
git pull
./deploy.sh

5. Access Your Application

After successful deployment:

  • App only: http://your-server-ip:3000
  • With Nginx: http://your-server-ip
  • With SSL: https://your-server-ip

6. Firewall Configuration (Oracle Cloud)

Make sure to configure your Oracle Cloud security groups to allow:

  • Port 80 (HTTP) - if using Nginx
  • Port 443 (HTTPS) - if using SSL
  • Port 3000 - if deploying app only

7. SSL Certificate Setup (Optional)

For HTTPS deployment, place your SSL certificates in the ssl directory:

mkdir ssl
# Add your certificates:
# ssl/cert.pem - SSL certificate
# ssl/key.pem - Private key

You can obtain free SSL certificates from Let's Encrypt or use your existing certificates.

Troubleshooting

Common Issues:

  1. Permission denied: Make sure deploy script is executable

    chmod +x deploy.sh
    
  2. Port already in use: Stop existing services or change ports in docker-compose.yml

  3. SSL certificate errors: Verify certificate paths and permissions in ssl/ directory

  4. Container build failures: Check Docker logs

    docker-compose logs ghost-chess
    

🛠 Technology Stack

  • Next.js 15 with App Router
  • React 19 with TypeScript
  • Tailwind CSS for styling
  • Radix UI components (tabs, slots)
  • Lucide React for icons
  • Docker for containerization

📚 Learn More

To learn more about the technologies used: