はじめに

経営者・起業家向けの統合管理プラットフォーム Founders Direct Cockpit (FDC) の開発進捗状況をまとめます。本記事では、アーキテクチャ、実装済み機能、技術スタック、そして今後の展望について詳しく解説します。

📊 プロジェクト概要

項目	内容
プロジェクト名	Founders Direct Cockpit (FDC)
バージョン	2.10.3
本番URL	https://app.foundersdirect.jp/
ワークショップURL	https://workshop.foundersdirect.jp/
総コード行数	135,611行
Gitコミット数	1,019コミット
テスト数	244テスト（E2E: 97 / Unit: 147）

🏗️ アーキテクチャ：3層構造

FDCの最大の特徴は、戦略→戦術→実行の3層構造でビジネス目標を管理できることです。

┌─────────────────────────────────────────────────┐
│ 【戦略層】OKR（Objectives & Key Results）         │
│ ・Objective（定性目標）                           │
│ ・KeyResult（定量指標）                           │
└─────────────────────────────────────────────────┘
                      ↓ 紐付け
┌─────────────────────────────────────────────────┐
│ 【戦術層】アクションマップ                          │
│ ・ActionMap（マネージャーが作成する計画）            │
│ ・ActionItem（チームメンバーのタスク、ツリー構造）    │
└─────────────────────────────────────────────────┘
                      ↓ 紐付け
┌─────────────────────────────────────────────────┐
│ 【実行層】タスク管理                               │
│ ・4象限タスク（♠♥♦♣）                             │
│ ・サブタスク & 習慣化機能                          │
│ ・タスクログ & 日次/月次サマリー                    │
└─────────────────────────────────────────────────┘

進捗の自動ロールアップ

タスク完了 → ActionItem → ActionMap → KeyResult → Objective

下位層の進捗が自動的に上位層に反映されるため、「今日のタスクが会社の目標にどう貢献しているか」が可視化されます。

🛠️ 技術スタック

フロントエンド

カテゴリ	技術	バージョン
フレームワーク	Next.js	16.0.7
UIライブラリ	React	19.2.1
言語	TypeScript	5.9.3（strict mode）
アイコン	Lucide React	0.556.0
スタイリング	CSS Modules	11モジュール

バックエンド

カテゴリ	技術	詳細
データベース	Supabase PostgreSQL	17.6
認証	Supabase Auth	Google OAuth 2.0
セッション管理	Cookie-based	HttpOnly, Secure
暗号化	AES-256-GCM	2層暗号化
AI/LLM	Vercel AI SDK + OpenAI	GPT-4o-mini
バリデーション	Zod	4.1.13
メール	Resend	6.5.2

インフラ・DevOps

カテゴリ	技術
ホスティング	Vercel
CI/CD	GitHub Actions
E2Eテスト	Playwright 1.57.0
ユニットテスト	Vitest 4.0.15
ログ	Pino 10.1.0
キャッシュ	Vercel KV

📁 ディレクトリ構造

foundersdirect/
├── app/                          # Next.js App Router
│   ├── (app)/                   # 認証必須ルート
│   │   ├── admin/               # 管理者ダッシュボード
│   │   ├── brand/               # ブランド戦略管理
│   │   ├── clients/             # 顧客CRM管理
│   │   ├── dashboard/           # メインダッシュボード
│   │   ├── leads/               # 営業ファネル管理
│   │   ├── mvv/                 # ミッション/ビジョン/バリュー
│   │   ├── reports/             # 分析・レポート
│   │   └── settings/            # 設定
│   ├── api/                     # APIルート（53エンドポイント）
│   ├── workshop/                # 教育プラットフォーム
│   └── [公開ページ]/            # ランディング、規約など
├── lib/                         # 共通ユーティリティ
│   ├── server/                  # サーバーサイド（41ファイル）
│   ├── core/                    # ビジネスロジック（14ファイル）
│   ├── types/                   # 型定義（26ファイル、7,300行以上）
│   ├── hooks/                   # カスタムフック（98ファイル）
│   └── utils/                   # 汎用ユーティリティ
├── migrations/                  # DBマイグレーション（31ファイル）
├── tests/                       # テストスイート
│   ├── e2e/                     # E2Eテスト（Playwright）
│   └── unit/                    # ユニットテスト（Vitest）
└── docs/                        # ドキュメント

✅ 実装済み機能

1. OKR管理（戦略層）

✅ Objective（目標）の作成・編集・削除
✅ Key Result（成果指標）の定義と進捗管理
✅ 会社/チーム/個人レベルでのOKR設定
✅ 振り返り機能（達成スコア、学び）
✅ ステータス表示（on_track / at_risk / off_track）

2. アクションマップ（戦術層）

✅ マネージャーによる計画（ActionMap）作成
✅ チームメンバーのタスク（ActionItem）管理
✅ ツリー構造での階層化
✅ 優先度設定（low / medium / high）
✅ タスクとの紐付けによる進捗自動計算

3. タスク管理（実行層）

✅ 4象限システム
- ♠ 緊急かつ重要
- ♥ 重要（緊急ではない）
- ♦ 緊急（重要ではない）
- ♣ 将来の20%（戦略的）
✅ 習慣化機能（松竹梅）
- 松：高難度
- 竹：中難度
- 梅：5分でできる習慣
✅ タスクログと完了履歴
✅ 繰り返しタスク対応
✅ 日次/月次サマリー
✅ アーカイブ機能

4. CRM・リード管理

✅ 営業ファネル
- 未コンタクト → 反応あり → 商談中 → 成約 → 顧客化
✅ 見込み客管理（連絡先、履歴、メモ、タグ）
✅ 顧客管理（契約日、更新追跡）
✅ 失注分析（理由追跡、フィードバック）
✅ アプローチ記録
✅ テンプレートシステム（メッセンジャー/メール/提案書/クロージング）

5. 組織管理

✅ 組織図（部署構造、メンバー配置）
✅ レポートライン（上司-部下関係）
✅ 可視性ルール設定
✅ 複数ロールの割り当て
✅ 部署の階層構造

6. Google連携

✅ Googleカレンダー双方向同期
✅ Googleタスク完全CRUD対応
✅ OAuthトークンの暗号化保存
✅ 2分間隔の自動同期（Cronジョブ）

7. ワークショップ（教育プラットフォーム）

✅ 30フェーズの学習コンテンツ
✅ 閲覧モード（読み取り専用アクセス）
✅ 進捗追跡
✅ マイルストーン達成時のUI演出

8. 管理・マルチテナント

✅ システム管理者ダッシュボード
✅ テナントごとのカスタマイズ（AI設定、テーマ、ブランディング）
✅ 監査ログ
✅ セキュリティイベント追跡
✅ サブスクリプション管理

9. AI機能（MVP）

✅ AIコンテキストビルダー
✅ チャットインターフェース（ストリーミング対応）
✅ トークン使用量追跡
✅ プロンプトテンプレート

🔐 セキュリティ

認証・認可

【認証フロー】
1. Google OAuth 2.0 + PKCE
2. セッションCookie（HttpOnly, Secure, SameSite=Lax）
3. サーバーサイドでのセッション検証
4. セッションキャッシュ（Vercel KV）

【認可レベル】
- SA: システム管理者（全権限）
- OWNER: ワークスペースオーナー
- ADMIN: 管理者
- MEMBER: メンバー
- VIEWER: 閲覧専用

セキュリティ機能

✅ CSRF保護（カスタムミドルウェア）
✅ セッションフィンガープリント（ブラウザ/IP追跡）
✅ レートリミット
✅ リアルタイム脅威検知
✅ AES-256-GCM暗号化（Googleトークン等）
✅ CSPヘッダー（Nonce-based）
✅ RLS（Row-Level Security）全テーブル適用

🗄️ データベース設計

主要テーブル（31マイグレーション適用済み）

-- ユーザー・認証
users                    -- Google OAuthユーザー
sessions                 -- セッション管理
workspace_members        -- ワークスペース別ロール

-- コアデータ
workspace_data           -- AppData（JSONB、全アプリ状態）
workspaces              -- マルチテナントワークスペース
tenants                 -- テナント設定

-- CRM
prospects               -- 見込み客
clients                 -- 顧客
lost_deals              -- 失注案件
approach_records        -- コンタクト履歴

-- 組織
org_chart_members       -- 従業員データ
member_department_assignments -- ロール割り当て
report_lines            -- 上司-部下関係

-- Google連携
google_api_tokens       -- OAuthトークン（暗号化）
google_api_token_keys   -- 暗号化キーバージョン

-- セキュリティ
audit_logs              -- 監査ログ
security_events         -- セキュリティイベント

🧪 テスト

E2Eテスト（Playwright）

97テスト - すべてパス ✅
認証フロー、OKR管理、タスク操作、CRMワークフロー等をカバー

ユニットテスト（Vitest）

147テスト - すべてパス ✅
暗号化、OKR計算、セッションキャッシュ、データ検証等をカバー

Visual Regressionテスト

スナップショットベースのUI検証
マルチブラウザ対応

📈 品質指標

指標	値
TypeScript	Strict mode有効
型カバレッジ	約98%
技術的負債（クリティカル）	0件
セキュリティスコア	100/100
Lighthouse（デスクトップ）	90+
DBクエリ時間（95パーセンタイル）	<100ms
APIレスポンス時間（95パーセンタイル）	<200ms

📋 開発フェーズ

フェーズ	内容	状態
Phase 7	認証 & RBAC	✅ 完了
Phase 8	ワークスペース管理 & 暗号化	✅ 完了
Phase 9	DB移行（Neon → Supabase）	✅ 完了
Phase 10	タスク管理（4象限）	✅ 完了
Phase 11	アクションマップ	✅ 完了
Phase 12	OKR	✅ 完了
Phase 13	組織図	✅ 完了
Phase 13.5	組織構造	✅ 完了
Phase 14	AI基盤 & パフォーマンス	✅ 完了
Phase 14.6	セキュリティ & 監視	✅ 完了
Phase 15	品質保証 & 監視	✅ 完了
Phase 15.5	大規模ファイル分割	✅ 完了
Phase 19	AIチャット実装	🚧 進行中
Phase 31	GitHub Organization移行	✅ 完了

🔮 今後の展望

Phase 19（AIチャット機能）- 進行中

AIチャットパネル（ストリーミングレスポンス）
ワークスペースデータからのコンテキスト生成
トークン使用量追跡 & コスト監視
マルチターン会話対応
ワークスペースごとのカスタムプロンプト

Phase 16以降（バックログ）

ワークフロー自動化
高度な分析ダッシュボード
APIレートリミット改善
GraphQLサポート（オプション）
モバイルアプリ（ネイティブまたはPWA）
リアルタイムコラボレーション（WebSocket）

📊 コードベース統計

項目	数値
TypeScript/TSXファイル数	839
総コード行数	135,611行
型定義（export）	228
カスタムフック	98
APIエンドポイント	53
マイグレーションファイル	31
テストファイル	37

🚀 開発コマンド

npm run dev              # 開発サーバー起動
npm run build            # 本番ビルド
npm run lint             # ESLintチェック
npm run type-check       # TypeScript型チェック
npm test                 # E2Eテスト実行
npm run test:unit        # ユニットテスト実行
npm run test:visual      # Visual Regressionテスト
npm run report:tech-debt # 技術的負債レポート生成

まとめ

Founders Direct Cockpitは、以下の特徴を持つプロダクション対応のSaaSアプリケーションです：

✅ 完全な3層ビジネス管理システム（OKR → ActionMap → Task）
✅ エンタープライズグレードのセキュリティ
✅ マルチテナントアーキテクチャ
✅ 包括的なCRM機能
✅ Google連携
✅ 教育プラットフォーム（30フェーズ）
✅ AI機能基盤
✅ 244のテストで品質保証
✅ 0件のクリティカルな技術的負債

最終更新日: 2025年12月9日
作成者: Claude Code による自動生成