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

Option B: Production Deployment with Nginx (Recommended)

# 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:

• Next.js Documentation - learn about Next.js features and API
• React Documentation - learn React
• Tailwind CSS - utility-first CSS framework
• Docker Documentation - containerization platform