HTML資料を「テーマ指定だけ」で自動量産する仕組みの設計検討メモ。
現状はプロトタイプv1まで実装済み。本格運用には認証フロー等の課題を解決する必要がある。
📌 ゴール：誰でもブラウザでフォームを開き、最小限の情報（タイトル・目的）を入力するだけで、AIが構造・コンテンツ・デザインを補完し、GitHub Pagesに公開済みのHTML資料が手元に届く仕組み。
イメージ：「人間Input → AI自動化 → 成果物リンク」が一気通貫で完結。コンサル・営業・教育担当が、技術知識ゼロで資料を量産できる。
📌 現状は「半自動」レベル：人間がClaude Codeを起動し、指示を投げる手順が残っています。
完全自動化を実現するには、追加の仕組み（GitHub Actions / Anthropic API直接呼出）が必要です。
| レベル | 内容 | 人間の操作 | 状態 |
|---|---|---|---|
| 手動 | HTML編集・push全て手作業 | すべて自分で | ❌ |
| 半自動（現状） | Claude Codeに指示 | config.json + Claude Code起動 + コマンド入力 | ✅ 今ココ |
| 準自動 | スクリプト1本で起動 | config.json + .\generate.ps1 | △ 検討 |
| 完全自動 | フォーム入力のみ | 送信ボタン1クリック | 🚧 構想 |
| 選択肢 | 仕組み | 必要なもの | 難易度 | 判断 |
|---|---|---|---|---|
| A. ローカルスクリプト | PowerShellがClaude Code CLIを起動 | Claude Code headlessモード | 中 | ローカル完結・APIキー不要 |
| B. Anthropic API直接 | ブラウザJSがClaude API呼出 | APIキー + GitHub PAT | 高 | セキュリティ要件複雑 |
| C. GitHub Actions（推奨） | config.json push→Actions自動実行 | Actions Secret登録 | 中 | 現実的・push1回で完結 |
| カテゴリ | 論点 | 現在の方針 |
|---|---|---|
| 認証フロー | GitHubトークンをブラウザのどこに保管するか | GitHub OAuth App で短命トークン取得・セッション保管が安全 |
| API呼出 | Anthropic APIキーをユーザー側で持つか、サーバー経由か | 初期段階：各自のAPIキーをlocalStorage（自己責任モデル） |
| セキュリティ | キー漏洩・XSS攻撃対策 | CSP / SubResource Integrity / 入力サニタイズ徹底 |
| 運用 | サーバーレスで完結可能か / バックエンド必要か | 第一段階はサーバーレス（GitHub Pages＋ブラウザJS）で実現可能 |
| UX | 未認証ユーザーへのデモ提供 | 「プロンプト生成までは無料」「pushは認証必要」の段階設計 |
📌 プロトタイプ v1 完成：localStorageベースのアカウント設定 + プロンプト自動生成までは動作可能。Claude Codeに投入することで生成・publishまで実行可能。
次のステップ：GitHub OAuth連携の調査、Anthropic API直接呼出のセキュリティ検証、UX/UIの磨き込み。
| アクション | 目的 | 状態 |
|---|---|---|
| GitHub OAuth App 調査 | ブラウザからの安全なpush実現 | 未着手 |
| Anthropic API ブラウザ呼出検証 | CORS等の挙動確認 | 未着手 |
| セキュリティ要件定義書作成 | 運用前のリスク洗い出し | 未着手 |
| UI再デザイン | シンプル化と分かりやすさ両立 | v1段階 |
| テンプレート切替機能 | 用途別の雛形対応 | 構想のみ |