高度な実践シナリオ · シナリオ1
ゼロから新しいプロジェクトを作成する
要件分析から技術選定、アーキテクチャ設計からプロジェクト初期化まで、プロジェクト立ち上げの完全なプロセスを習得します。AI ツールを活用してプロジェクト立ち上げを加速し、新規プロジェクトを独力で開始できる能力を身につけます。
学習目標
プロジェクト立ち上げの完全なプロセスを習得する
技術選定とアーキテクチャ設計の能力を備えている
AI ツールを使ってプロジェクト初期化を高速化できる
プロジェクト初期化のベストプラクティスを理解する
方法論
プロジェクト開始プロセス
1
要件分析：業務要件、ユーザー要件、技術要件を理解し、プロジェクトの目標と範囲を明確にする
2
技術選定：要件、チームの能力、コスト、エコシステムなどの要素に基づいて適切な技術スタックを選択する
3
アーキテクチャ設計：設計システムアーキテクチャ、モジュール分割、データモデル、インターフェース設計
4
プロジェクトの初期化：プロジェクト構造の作成、ツールチェーンの設定、CI/CD の構築、初期ドキュメントの作成
技術選定の意思決定フレームワーク
選定の観点
性能
応答時間、スループット、同時実行能力
コスト
開発コスト、運用コスト、ライセンス費用
チーム能力
チームのなじみ度、学習曲線、採用難易度
エコシステム
コミュニティの活発さ、サードパーティライブラリ、ツールのサポート
保守性
コード品質、ドキュメントの充実度、長期サポート
スケーラビリティ
水平スケーリング、垂直スケーリング、アーキテクチャの柔軟性
AIツールの活用：Cursor Agent または Spec を使用し、要件の説明に基づいて技術選定の提案と比較分析を自動生成する。
アーキテクチャ設計原則
Clean Architecture
- • 階層型アーキテクチャ：Entities → Use Cases → Interfaces → Frameworks
- • 依存関係ルール：内側は外側に依存せず、依存の方向は内向き
- • AI の強み：各層を疎結合にし、AIによるチャンク生成と保守に適しています
DDD (Domain-Driven Design)
- • 統一言語：AIを使ってビジネス領域の共通言語を抽出する
- • 限界コンテキスト：AIによる業務境界の分割
- • エンティティと値オブジェクト：AIがドメインモデルのコードを生成する
マイクロサービス vs モノリス
- • モノリスの利点：シンプル、高速開発、小規模チームに適している
- • マイクロサービスの利点：独立デプロイ、柔軟な技術スタック、拡張可能
- • 選定の推奨事項：モノリスから始め、必要に応じてマイクロサービスへ進化させる
プロジェクト初期化のベストプラクティス
目次構成
project-name/ ├── src/ │ ├── app/ # アプリケーション層（Next.js App Router） │ ├── components/ # UIコンポーネント │ ├── lib/ # ユーティリティ関数 │ └── types/ # TypeScript型 ├── prisma/ # データベースSchema（Prismaを使用する場合） ├── public/ # 静的アセット ├── tests/ # テストファイル ├── docs/ # プロジェクトドキュメント ├── .github/ # GitHub Actions ├── .env.example # 環境変数の例 ├── README.md # プロジェクト説明 ├── package.json # 依存関係管理 └── tsconfig.json # TypeScript設定
ツールチェーン設定
- • コード整形：Prettier + ESLint
- • 型チェック：TypeScript strict mode
- • テストフレームワーク：Jest + React Testing Library
- • Git Hooks：Husky + lint-staged
CI/CD設定
- • 自動化テスト：コミットごとに自動でテストを実行
- • コードレビュー：ESLint と型チェックを自動実行
- • 自動デプロイ：テスト合格後、自動的にテスト/本番環境へデプロイする
AIツールの活用
Cursor Agent を使ってアーキテクチャ設計を行う
Cursor の Agent モードを使用して、自然言語で要件を記述すると、AI が自動的にアーキテクチャ設計を生成します：
サンプル Prompt：
「ユーザー認証、データストレージ、API サービス、フロントエンドインターフェースを含む SaaS アプリケーションのアーキテクチャを設計してください。マルチテナント対応、拡張性、保守性が高いことが必要です。」
- • AI がシステムアーキテクチャ図、モジュール分割、データモデル設計を生成する
- • 満足できるまでアーキテクチャ設計を反復改善できる
- • アーキテクチャ文書とコード構造を生成する
Spec 駆動で技術選定を行う
技術選定のSpecを作成し、AIがSpecに基づいて選定提案と比較分析を生成する：
- • 要件を明確にする：性能要件、チーム規模、予算制約
- • AI生成：テクノロジースタックの推奨、比較分析、選定理由
- • 意思決定支援：データと技術トレンドに基づく選定提案
Windsurf を使って大規模プロジェクトを初期化する
Windsurf の Fast Context 技術は、大規模プロジェクトの構造をすばやく理解し、プロジェクトの初期設定を加速できます：
- • 高速分析：既存プロジェクトの構造を分析し、ベストプラクティスを理解する
- • テンプレート生成：分析結果に基づいてプロジェクトテンプレートを生成する
- • 構成の同期：ツールチェーンとCI/CDを自動構成
Fabricを使用してプロジェクト文書を生成する
Fabric の Patterns を使用してプロジェクトドキュメントを自動生成する:
- • README生成：プロジェクト構造に基づいてREADMEを自動生成
- • APIドキュメント：コードコメントに基づいてAPIドキュメントを生成する
- • アーキテクチャ文書：アーキテクチャ設計に基づいてアーキテクチャ文書を生成する
実践事例
ケース1：ゼロからSaaSアプリを構築する
技術スタック
Next.jsPrismaVercelTypeScriptTailwind CSS
ステップ1：要件分析（2時間）
- • 明確なビジネス要件：マルチテナント SaaS アプリケーション、ユーザー登録、データ管理、権限制御をサポート
- • 技術要件：迅速な開発、拡張しやすさ、コストを抑えられること
- • AIツールを使用する：Cursor Agent で要件の明確化とドキュメント生成を行う
ステップ2：技術選定（1時間）
- • フロントエンド：Next.js（SSR、API Routes、Vercel デプロイ）
- • データベース：PostgreSQL + Prisma（型安全、マイグレーション管理）
- • デプロイ：Vercel（ゼロ設定、自動CI/CD）
- • AIツールを使用：Spec駆動で選定比較分析を生成
ステップ3：アーキテクチャ設計（2時間）
- • システムアーキテクチャ：Next.js App Router + Prisma + Vercel
- • データモデル：ユーザー、テナント、データテーブルのマルチテナント設計
- • API設計：RESTful API + Next.js API Routes
- • AI ツールを使用する：Cursor Agent がアーキテクチャ図とコード構造を生成する
ステップ4：プロジェクト初期化（2時間）
- • Next.js プロジェクトを作成する：npx create-next-app@latest
- • Prisma を設定する：Prisma を初期化し、Schema を設計し、Client を生成する
- • ツールチェーンを設定する：ESLint、Prettier、TypeScript、Git Hooks
- • CI/CDを設定する：GitHub Actionsで自動テストとデプロイを行う
- • AIツールを使用する：Windsurfで迅速に設定、Fabricでドキュメントを生成
ケース2：ゼロからマイクロサービスアーキテクチャを構築する
技術スタック
DockerKubernetesサービスメッシュgRPCNode.js
ステップ1：要件分析（3時間）
- • ビジネス要件：大規模分散システム、高可用性、拡張性が必要
- • 技術要件：サービスの疎結合化、独立デプロイ、サービスガバナンス
- • AIツールを使用：Cursor Agent によるマイクロサービスアーキテクチャ設計
ステップ2：サービス分割（2時間）
- • ユーザーサービス：ユーザー認証、権限管理
- • 注文サービス：注文作成、支払い処理
- • 商品サービス：商品管理、在庫管理
- • AI ツールを使用する：DDD 手法で境界づけられたコンテキストを分割する
ステップ3：インフラ設計（3時間）
- • コンテナ化：Dockerイメージのビルドとプッシュ
- • オーケストレーション：Kubernetes デプロイ設定
- • サービスメッシュ：Istio または Linkerd の設定
- • 監視：Prometheus + Grafana
- • AIツールを使用：Cursor AgentでK8s構成とデプロイスクリプトを生成
ステップ4：プロジェクト初期化（4時間）
- • Monorepo構造を作成する：pnpm workspacesまたはNxを使用する
- • 各サービスを初期化：サービステンプレートを作成し、ツールチェーンを構成
- • CI/CD を設定する：マルチサービスのビルドとデプロイのプロセス
- • AIツールの使用：Windsurfによる一括初期化、Fabricによるドキュメント生成
学習成果チェックリスト
プロジェクト立ち上げプロセス（要件分析 → 技術選定 → アーキテクチャ設計 → プロジェクト初期化）を独立して完了できる
技術選定の意思決定フレームワークを習得し、要件に応じて合理的な技術選定ができる
Clean Architecture や DDD などのアーキテクチャ設計原則を理解する
Cursor Agent を使用してアーキテクチャ設計とコード生成ができる
Spec駆動で技術選定を行える
Windsurf と Fabric を使用してプロジェクトの初期設定を加速できる
実践ケースを少なくとも 1 つ完成させる（SaaS アプリまたはマイクロサービスアーキテクチャ）