Web UI クイックスタート (5 分)
ブラウザだけで初回監査を回すクイックスタート。CLI 版は こちら、フル機能ツアーは Web UI ガイド を参照してください。
0. 前提
- Node.js 20+ / Python 3.12 (
uv) / git が入っていること - インストール が完了していること
事前確認:
node --version
uv --version
1. 認証 (1 度だけ)
3 つの方法のいずれか:
# A. Claude Pro/Max サブスクリプション (推奨)
npm install -g @anthropic-ai/claude-code
claude auth login # ブラウザで claude.ai OAuth
# B. Anthropic API key
export ANTHROPIC_API_KEY=sk-ant-api-...
# C. Web UI から後で入れる (login 画面で paste)
確認:
claude auth status --json
2. Web サーバ起動
uv run speca-web --port 7411 --host 127.0.0.1 --serve-frontend
ブラウザで http://127.0.0.1:7411/ を開く:
未ログインなら paste-code OAuth or API key 入力画面が出ます。
3. 新規 run を Wizard から起動
ダッシュボードの + 新規 run から /runs/new/wizard へ:
- プロジェクト種別 —
smart_contract等 - 対象リポジトリ —
owner/name(例:OpenZeppelin/openzeppelin-contracts) - 対象 ref — 空欄 = デフォルトブランチ
- スコープ — Bug bounty URL があれば貼る
- Spec URLs — オプション (Phase 01a の seed)
- Confirm — Launch
エラー時は 9 ケースのモーダル で対処が表示されます。
4. 進捗を眺める
phase 行をクリックで展開、または focus 中に l でログペインへ scroll、f で当該 phase のみ force re-run。
予算が気になるなら ゲージをクリック → cap-bump モーダルで上限を上げる:
5. Findings を見る
監査が完了すると /runs/<id>/findings に findings 一覧。DSL filter / Markdown export / Prism コードハイライト全部使えます:
6. Chat パネルで個別質問
行詳細の Ask Claude about this finding ボタンで Chat に finding を inject。または右上の Chat ボタン / c キーで開いてフリーフォームで:
(オプション) 別 runtime を試す
/settings の Chat runtime セクション で claude 以外も選べます:
| Runtime | 認証 |
|---|---|
| Claude (既定) | claude auth login or ANTHROPIC_API_KEY |
| Codex | codex login (ChatGPT plan) or OPENAI_API_KEY |
| Gemini | GEMINI_API_KEY or Google ADC (gcloud auth application-default login + GOOGLE_GENAI_USE_GCA=true) |
| Ollama | self-hosted (OLLAMA_HOST=http://localhost:11434) or cloud (+ OLLAMA_API_KEY) |
| Copilot | gh auth login + Copilot 契約 (Chat のみ) |
availability badge ✓ / ! で各 runtime が今すぐ使えるかが一目で分かります。env を export してから Web サーバ再起動が確実。詳細は Multi-runtime バックエンド。
:::info Chat / Audit OAuth ギャップ
Chat パネルは CLI subprocess を経由するので、OAuth (codex login / ChatGPT plan / Google ADC) と API key 両方使えます。
Audit pipeline 側は OpenAI 互換 API を直接叩くので、現状 API key が必須です (OPENAI_API_KEY / GEMINI_API_KEY)。
:::
(オプション) UI のカスタマイズ
ヘッダから:
- L / D / A / S — Light / Dark / Auto / Solarized テーマ切替
- EN / JA — 言語切替
トラブル時は
- 一覧: トラブルシューティング
- ショートカット:
?キーで help モーダル
