debug-time-machine-cli/README.md

🚀 Debug Time Machine CLI - 완전 자동화된 React 디버깅 도구

# debug-time-machine-cli

🚀 **Debug Time Machine CLI** - 완전 자동화된 React 디버깅 도구

## 설치

```bash
npm install -g debug-time-machine-cli
# 또는
npx debug-time-machine-cli
```

## 사용법

### 자동 시작 (권장)

```bash
# React 앱과 함께 Debug Time Machine을 자동으로 시작
debug-time-machine start-with-app "npm start"
debug-time-machine start-with-app "yarn dev"
debug-time-machine start-with-app "pnpm dev"
```

자동으로 실행되는 것들:
- ✅ 백엔드 서버 (포트 4000)
- ✅ Debug UI (포트 8080)
- ✅ 브라우저에서 Debug UI 열기
- ✅ 사용자 React 앱

### 개별 명령어

```bash
# Debug Time Machine 서버만 시작
debug-time-machine start --port 4000

# 프로젝트 초기화
debug-time-machine init --name my-app --template react

# 상태 기록
debug-time-machine record --output session.json --duration 300

# 기록 재생
debug-time-machine replay --input session.json --speed 2
```

### 단축 명령어

```bash
# dtm 별칭 사용 가능
dtm start-with-app "npm start"
dtm start
dtm init
```

## 명령어 옵션

### start-with-app
```bash
debug-time-machine start-with-app <command> [options]

Options:
  --no-browser    Debug UI를 브라우저에서 자동으로 열지 않음
```

### start
```bash
debug-time-machine start [options]

Options:
  -p, --port <port>    포트 번호 (기본값: 4000)
  -h, --host <host>    호스트 주소 (기본값: localhost)
```

### init
```bash
debug-time-machine init [options]

Options:
  -n, --name <name>         프로젝트 이름
  -t, --template <template> 템플릿 (react, node, express)
```

## 예제

### Create React App
```bash
debug-time-machine start-with-app "react-scripts start"
```

### Vite
```bash
debug-time-machine start-with-app "vite --port 3000"
```

### Next.js
```bash
debug-time-machine start-with-app "next dev"
```

## package.json 스크립트

```json
{
  "scripts": {
    "start": "react-scripts start",
    "debug": "debug-time-machine start-with-app 'react-scripts start'"
  }
}
```

그러면 다음과 같이 사용할 수 있습니다:

```bash
npm run debug
```