⭐️【AI共同開発】anotoki会員制掲示板サービス 体系的なプロンプト 以下の指示に従って、ジョブ1〜3を順番に実行し、 完全なシステムを構築してください。 各ジョブは前のジョブの成果物を基に進めてください。 🎯 プロジェクト概要 サービス名: anotoki（あの時） コンセプト: 「あの時こうしておけばよかった」という人生の教訓を、カテゴリごとに整理・共有する会員制掲示板サービス 技術スタック: Next.js 15、NextAuth、MongoDB、MUI 必須機能: Google認証によるログイン必須の完全会員制 環境: 本プロジェクトはレンタルサーバーに置かれている。 Apache 設定にリバースプロキシ設定を入れており、本番サイトは https://ztmy365.com/anotoki で配信する。 もしリバースプロキシ設定が入っていなければ追加をして反映する。 設定箇所は以下。 　/etc/apache2/ conf-proxy/ anotoki.conf sites-available/ 000-default.conf 000-default-le-ssl.conf 📋 ジョブ1：初期開発フェーズ 1.1 仕様書作成 /docs/specs/フォルダを作成し、以下の仕様書をMarkdown形式で作成： • system-architecture.md: システム全体のアーキテクチャ設計 • database-schema.md: MongoDBのスキーマ設計（ユーザー、投稿、カテゴリ等） • api-specification.md: APIエンドポイントの仕様 • ui-specification.md: 画面遷移図とUI仕様 • authentication-flow.md: Google認証フローの詳細 1.2 タスクリスト作成 /docs/tasks/フォルダを作成し、実装タスクを詳細に定義： • phase1-authentication.md: 認証機能の実装タスク • phase2-database.md: データベース設定とモデル作成 • phase3-api.md: APIエンドポイントの実装 • phase4-ui-components.md: UIコンポーネントの実装 • phase5-integration.md: 統合とページ実装 1.3 実装 タスクリストに基づいて以下を実装（すべて完了するまで継続）： • Next.js 15プロジェクトのセットアップ • NextAuthによるGoogle認証実装 • 必要なすべてのページとAPI実装 　NextAuthでエンドポイント実装開始する前に、まずはレンタルサーバーのApacheのエンドポイント設定を確認すること。 　実装するすべてのエンドポイントは、レンタルサーバー環境で動作するように調整する。 　サインインページやリダイレクトなど認証関連のURLも/anotoki プレフィックスを含めて統一する。 　ログイン完了後は常に /anotoki トップへ戻す。 リバースプロキシ越しでも Auth.js が UntrustedHost を返さない構成を前提とすること。 　.env.production設定（本番環境に必要なすべての環境変数を設定） 　必須項目： 　• NEXTAUTH_URL / NEXT_PUBLIC_NEXTAUTH_URL: https://ztmy365.com/anotoki（必ず`/anotoki`を含める） 　• NEXTAUTH_SECRET: セキュアなランダム文字列 　• AUTH_TRUST_HOST: true（リバースプロキシ対応） 　• NEXTAUTH_COOKIE_DOMAIN: 適切なCookieドメイン設定 　• MONGODB_URI: MongoDB接続文字列 　• MONGODB_DB_NAME: データベース名 　• GOOGLE_CLIENT_ID / GOOGLE_CLIENT_SECRET: Google OAuth認証情報 　• NODE_ENV: production 　• PORT: アプリケーションポート番号 　その他、アプリケーション固有の設定があれば追加 　【Google Cloud Console OAuth 2.0 設定】 　クライアント名: anotoki 　承認済みのJavaScript生成元: 　• https://ztmy365.com 　• http://localhost:3100 　承認済みのリダイレクトURI: 　• https://ztmy365.com/anotoki/api/auth/callback/google（本番環境） 　• http://localhost:3100/anotoki/api/auth/callback/google（開発環境） 　※NextAuthのコールバックURLが上記のリダイレクトURIと一致していることを必ず確認する • MongoDBの接続設定とモデル定義 • MUIテーマ設定とコンポーネント作成 1.3.5 認証機能の自動テスト（実装完了後すぐに実施） 認証機能実装後、Playwrightを使用して以下のE2Eテストを実行する： 【テスト用Google認証情報】 • メールアドレス: g2109014@gmail.com • パスワード: Lciel-1964 【自動テストシナリオ】 Playwrightで以下のフローを自動実行し、全て成功することを確認： 1. https://ztmy365.com/anotoki にアクセス 2. ログインページが表示されることを確認 3. 「Googleでログイン」ボタンをクリック 4. Google認証画面でメールアドレスを入力 5. パスワードを入力 6. 認証完了後、/anotoki トップにリダイレクトされることを確認 7. ログイン後のユーザー情報表示を確認 8. ログアウトボタンをクリック 9. ログアウト成功を確認 10. コンソールエラーがないことを確認 【テストスクリプト作成場所】 /scripts/test-google-auth.js または .ts ファイルを作成 【重要】上記の自動テストが全て成功するまで次のステップ（1.4テスト作成）に進まない テストが失敗した場合は、ログとスクリーンショットを取得して原因を特定し、修正を繰り返す 1.4 テスト作成 /docs/test/フォルダを作成し、テスト設計書とテストコードを実装： • test-design.md: 境界値分析、正常系・異常系を含む完全なテスト設計 • Jestによる単体テストの実装 • Playwrightによる統合テストの実装 • すべてのテストが成功するまでデバッグ継続 1.5 ドキュメント更新 /docs/specs/の内容を実装結果に基づいて最新化 🔍 ジョブ2：レビュー＆改善フェーズ 2.1 コードレビュー /docs/reviews/フォルダを作成し、以下のレビューを実施： • security-review.md: セキュリティ観点のレビュー（認証、データ保護等） • performance-review.md: パフォーマンス最適化の提案 • code-quality-review.md: コード品質とベストプラクティス • accessibility-review.md: アクセシビリティの確認 2.2 修正実装 レビュー結果に基づいて以下を改善： • セキュリティ脆弱性の修正 • パフォーマンスボトルネックの解消 • コード品質の向上（リファクタリング） • アクセシビリティの改善 2.3 解説ガイド作成 /docs/guides/フォルダを作成し、運用ガイドを作成： • deployment-guide.md: デプロイメント手順 • maintenance-guide.md: メンテナンス方法 • troubleshooting-guide.md: トラブルシューティング • user-manual.md: エンドユーザー向け使用方法 2.4 最終ドキュメント更新 すべてのドキュメントを最新の実装状態に合わせて更新 ✅ ジョブ3：最終確認フェーズ 3.1 最終動作確認チェックリスト作成 /docs/checklist/final-check.mdを作成し、以下の項目を含める： 認証機能チェック • [ ] Google認証でログインできる • [ ] ログアウトが正常に機能する • [ ] 未認証ユーザーはコンテンツを閲覧できない • [ ] セッション管理が適切に動作する 投稿機能チェック • [ ] 新規投稿が作成できる • [ ] カテゴリ選択が機能する • [ ] 投稿の編集・削除ができる（本人のみ） • [ ] 他ユーザーの投稿が閲覧できる UI/UXチェック • [ ] レスポンシブデザインが機能する • [ ] MUIテーマが適用されている • [ ] エラーメッセージが適切に表示される • [ ] ローディング状態が表示される データベースチェック • [ ] MongoDBへの接続が安定している • [ ] データの永続化が正常に動作する • [ ] インデックスが適切に設定されている 3.2 人間による動作確認指示 「上記チェックリストに従って動作確認を実施してください。問題があれば報告してください。」 📌 実行時の注意事項 各ジョブは完全に終了してから次へ進む エラーが発生した場合は解決するまで継続 すべてのファイルは適切なフォルダ構造で整理 コードは本番環境を想定した品質で実装 セキュリティとプライバシーを最優先に考慮 🔄 段階的検証の原則 • 【重要】認証機能実装後、必ずPlaywrightで自動テストを実行してGoogle認証が成功することを確認する • 【重要】自動テストでログイン成功を確認してから次のステップに進む（テスト作成、レビュー等） • インフラ設定（Apache、環境変数等）は実装開始前に確認・調整する • 各機能実装後、即座にブラウザまたは自動テストで動作確認する • 問題発見時は根本原因を特定してから次の実装に進む • 認証機能は特に慎重に、エンドツーエンドで動作確認する • 静的ファイル、API、ページが正しく配信されることを確認する • コンソールエラー、ネットワークエラーがないことを確認する このプロンプトに従って、順番にジョブを実行し、完全なanotokiサービスを構築してください。各ステップで生成したファイルと実装内容を明確に示しながら進めてください。