はじめに
経営者・起業家向けの統合管理プラットフォーム Founders Direct Cockpit (FDC) の開発進捗状況をまとめます。本記事では、アーキテクチャ、実装済み機能、技術スタック、そして今後の展望について詳しく解説します。
📊 プロジェクト概要
🏗️ アーキテクチャ：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%（戦略的）
- ✅ 習慣化機能（松竹梅）
- ✅ タスクログと完了履歴
- ✅ 繰り返しタスク対応
- ✅ 日次/月次サマリー
- ✅ アーカイブ機能
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チャット機能）- 進行中
Phase 16以降（バックログ）
📊 コードベース統計
| 項目 |
数値 |
| 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 による自動生成
