注意: このプロジェクトは開発中（Work In Progress）です。予告なく仕様が変更される可能性があります。
ClaudeWork は、Claude Code セッションをブラウザから管理するための Web ベースツールです。複数のセッションを並列で実行し、Git worktree を使用して各セッションを独立した環境で管理します。
- OS: macOS, Linux
- Windows は現在サポートされていません
- Node.js: 18.x 以上
- Claude Code CLI: インストール済みであること
- セッション管理: 複数の Claude Code セッションを並列実行
- Git worktree 統合: セッションごとに独立した Git 環境
- リアルタイム通信: WebSocket によるリアルタイム出力表示
- Diff 表示: Git diff をビジュアルに表示
- Git 操作: rebase、squash merge などの Git 操作をブラウザから実行
- 実行スクリプト: テスト実行、ビルドなどの定型作業を簡単に実行
- ターミナル統合: ブラウザ内でターミナル操作
- ライト/ダークモード: テーマ切り替え対応
- モバイル対応: レスポンシブデザイン
詳細は SETUP.md を参照してください。
npx claude-work start # バックグラウンドで起動
npx claude-work stop # 停止または、フォアグラウンドで起動:
npx claude-work # Ctrl+C で停止初回実行時は以下が自動的にセットアップされます:
| ステップ | 処理内容 |
|---|---|
| 1. 環境設定 | .env がなければ .env.example からコピー |
| 2. Prisma | クライアントがなければ自動生成 |
| 3. データベース | DBがなければ自動作成 |
| 4. ビルド | .next がなければ自動ビルド |
| 5. 起動 | サーバー起動 (http://localhost:3000) |
npx claude-work # フォアグラウンドで起動
npx claude-work start # バックグラウンドで起動（pm2経由）
npx claude-work stop # 停止
npx claude-work restart # 再起動
npx claude-work status # 状態確認
npx claude-work logs # ログ表示
npx claude-work help # ヘルプデフォルト設定で動作しますが、必要に応じて .env ファイルを編集できます:
# データベースURL（変更不要）
DATABASE_URL=file:../data/claudework.db
# サーバーポート（オプション）
PORT=3000ブラウザで http://localhost:3000 を開きます。
詳細は ENV_VARS.md を参照してください。
| 変数名 | 説明 | デフォルト |
|---|---|---|
DATABASE_URL |
SQLite データベースパス | なし（必須） |
PORT |
サーバーポート | 3000 |
NODE_ENV |
実行環境 | development |
LOG_LEVEL |
ログレベル | info |
ALLOWED_ORIGINS |
CORS許可オリジン | なし |
ALLOWED_PROJECT_DIRS |
許可するプロジェクトディレクトリ | なし（すべてのディレクトリを許可） |
詳細は API.md を参照してください。
開発時には、pm2を使った起動を推奨します。pm2を使うことで、バックグラウンドプロセスの管理が容易になります。
# pm2で開発サーバーを起動（推奨）
npm run dev:pm2
# プロセスの状態を確認
npm run pm2:status
# ログを確認
npm run pm2:logs
# サーバーを停止
npm run pm2:stop
# pm2からプロセスを削除
npm run pm2:delete従来の方法でも起動できます:
# 直接起動（Ctrl+Cで停止）
npm run dev- プロセスの安全な停止（killコマンド不要）
- プロセス状態の確認が容易
- ログ管理の統一
- 自動再起動機能
- リソース使用状況のモニタリング
# 開発サーバーのみ起動
npm run dev:pm2
# テスト実行（pm2経由）
npm run test:pm2
# テスト監視モード（pm2経由）
npm run test:watch:pm2
# すべてのプロセスを起動
npm run pm2:start
# すべてのプロセスを再起動
npm run pm2:restart
# プロセス状態を確認
npm run pm2:status
# ログをリアルタイム表示
npm run pm2:logs
# リソース使用状況をモニタリング
npm run pm2:monit
# すべてのプロセスを停止
npm run pm2:stop
# すべてのプロセスを削除
npm run pm2:delete# すべてのテストを実行
npm test
# テストをウォッチモードで実行
npm run test:watch
# pm2でテスト監視モードを実行（バックグラウンド）
npm run test:watch:pm2# E2Eテストを実行
npm run e2e
# UIモードでE2Eテストを実行
npm run e2e:ui
# ブラウザを表示してE2Eテストを実行
npm run e2e:headed統合テストスクリプトは、実際のClaude Codeプロセスを起動して手動テストを支援します。
# 統合テストスクリプトを実行
npm run integration-testこのスクリプトは以下を行います:
- 開発サーバーを起動（環境変数を自動設定）
- テストチェックリストを表示
- インタラクティブメニューを提供
テスト結果は docs/integration-test-report.md に記録してください。
統合テストには以下の環境変数を使用できます:
# カスタム環境変数で実行
PORT=3001 npm run integration-test環境変数を指定しない場合、以下のデフォルト値が使用されます:
PORT: 3000
Apache License 2.0 - 詳細は LICENSE を参照してください。
- フロントエンド: Next.js 15.1, React 19, TypeScript, Tailwind CSS, Zustand
- バックエンド: Next.js API Routes, Prisma, SQLite, WebSocket (ws)
- その他: XTerm.js, react-diff-viewer-continued, Headless UI, next-themes
Issue や Pull Request は歓迎します。
問題が発生した場合は、GitHub Issues でお知らせください。