# BC-Game Up/Down - 빠른 시작 가이드

## 🎯 현재 상태

✅ 데이터베이스 생성 완료
✅ PHP 백엔드 완료
✅ WebSocket 서버 완료
✅ React 프론트엔드 복사 완료
✅ Nginx 설정 완료
✅ 백엔드 API/WebSocket 서비스 생성 완료

## 🚀 실행 방법

### 1단계: 의존성 설치 (최초 1회만)

```bash
더블클릭: install.bat
```

### 2단계: 3개 서버 시작

**방법 A: 자동으로 모두 시작 (권장)**
```bash
더블클릭: start-all.bat
```

**방법 B: 수동으로 각각 시작**
1. `start-websocket.bat` - WebSocket 서버
2. `start-game-manager.bat` - 게임 매니저
3. `start-frontend.bat` - React 개발 서버

### 3단계: Nginx 재시작

Laragon에서 Nginx 재시작 또는:
```bash
더블클릭: restart-nginx.bat
```

### 4단계: 브라우저에서 확인

#### 옵션 A: 개발 모드 (추천 - 빠른 개발)
- **URL**: http://localhost:4200
- **장점**: 핫 리로드, 빠른 개발
- **단점**: 도메인 사용 안됨

#### 옵션 B: 도메인으로 개발 서버 프록시
1. Nginx 설정 수정:
   ```
   파일: C:\laragon\etc\nginx\sites-enabled\gr.ezywallets.com.conf
   ```

2. 60번째 줄 근처 주석 해제:
   ```nginx
   location / {
       # 아래 4줄 주석 해제
       proxy_pass http://127.0.0.1:4200;
       proxy_http_version 1.1;
       proxy_set_header Upgrade $http_upgrade;
       proxy_set_header Connection "upgrade";
       proxy_set_header Host $host;
   }
   ```

3. Nginx 재시작 후:
   - **URL**: https://gr.ezywallets.com/

#### 옵션 C: 프로덕션 빌드 (최종)
```bash
cd C:\laragon\www\bc-game-updown\frontend
pnpm build

# 빌드 결과를 public으로 복사
xcopy /E /I /Y "dist\apps\up-down" "..\public\assets"
```

그 다음:
- **URL**: https://gr.ezywallets.com/

## 📊 시스템 확인

### 서버 상태 확인

**WebSocket Server** (CMD 창 1):
```
[WebSocket] Server initialized
[Server] Listening on ws://0.0.0.0:8080
```

**Game Manager** (CMD 창 2):
```
[Manager] Starting game manager...
[Manager] Round started! ID: 1, Price: 98765.43
```

**Frontend** (CMD 창 3):
```
VITE v5.x.x  ready in xxx ms
➜  Local:   http://localhost:4200/
```

### API 테스트

```bash
# 게임 상태 확인
curl http://localhost/api/game.php

# 또는 브라우저에서
http://localhost/api/game.php
```

응답 예시:
```json
{
  "success": true,
  "round_id": 1,
  "status": "BETTING",
  "countdown": 25,
  "start_price": 98765.43
}
```

### WebSocket 테스트

브라우저 콘솔에서:
```javascript
const ws = new WebSocket('ws://localhost:8080');
ws.onopen = () => console.log('Connected!');
ws.onmessage = (e) => console.log('Message:', e.data);
```

## 🔧 현재 구조

```
https://gr.ezywallets.com/
├── /                  → React 앱 (public/index.html 또는 빌드된 앱)
├── /api/game.php      → 게임 상태 API
├── /api/bet.php       → 베팅 API
├── /api/round.php     → 라운드 정보
├── /api/history.php   → 히스토리
└── /ws                → WebSocket (ws://localhost:8080 프록시)
```

## 📝 다음 단계

### React 앱 통합 (선택사항)

원본 React 앱을 수정해서 백엔드와 통합하려면:

1. **서비스 사용**:
   ```typescript
   import { BackendAPI, BackendWebSocket } from './services';

   // API 호출
   const gameState = await BackendAPI.getGameState();

   // WebSocket 연결
   const ws = new BackendWebSocket(BackendAPI.getSessionId());
   await ws.connect();

   ws.on('game_state', (data) => {
     console.log('Game state:', data);
   });
   ```

2. **베팅 버튼 연결**:
   ```typescript
   const handleBet = async (direction: 'UP' | 'DOWN', amount: number) => {
     const result = await BackendAPI.placeBet(direction, amount);
     console.log('Bet placed:', result);
   };
   ```

### 문제 해결

**WebSocket 연결 실패**:
- `start-websocket.bat`이 실행 중인지 확인
- 방화벽에서 포트 8080 허용

**게임이 시작되지 않음**:
- `start-game-manager.bat`이 실행 중인지 확인
- Binance API 접근 확인 (중국에서는 VPN 필요)

**API 호출 실패**:
- Nginx가 실행 중인지 확인
- PHP-FPM이 실행 중인지 확인 (Laragon에서 확인)

## 🎮 게임 작동 방식

1. **Game Manager**가 60초마다:
   - Binance에서 BTC 가격 가져오기
   - 새 라운드 시작
   - 라운드 종료 및 결과 계산

2. **WebSocket Server**가 매초:
   - 게임 상태 브로드캐스트
   - 베팅 알림 전송
   - 라운드 결과 전송

3. **React 앱**에서:
   - 실시간 BTC 차트 (Binance WebSocket)
   - 게임 상태 표시 (백엔드 WebSocket)
   - Up/Down 베팅 (백엔드 API)

## 📚 추가 정보

- **전체 문서**: README.md
- **Nginx 설정**: nginx.conf.example
- **데이터베이스**: sql/schema.sql

---

**준비 완료!** 이제 `start-all.bat`을 실행하고 http://localhost:4200 을 열어보세요! 🎉