Review Docs Toshi Hm

---
name: review-docs
description: 設計書に記載された要件を理解し、実装に必要な情報を抽出します。機能名やコンポーネント名を指定すると、関連する設計書を横断的に参照してMVP版の仕様、実装方針、チェックリストを提供します。
---

# Review Docs Skill

設計書を参照し、実装に必要な情報を抽出するスキル。

## 使い方

```
/review-docs <機能名またはコンポーネント名>
```

## 例

```
/review-docs Dial
/review-docs 日記作成機能
/review-docs 自動保存
/review-docs DateRange値オブジェクト
```

## このスキルが行うこと

1. **該当する設計書の特定**: 機能名から関連する設計書を自動的に特定
2. **関連箇所の抽出**: 設計書から実装に必要な情報を抽出
3. **MVP版の確認**: MVP版とPhase 2の区別を明確化
4. **実装ガイドの提供**: 具体的な実装方針を提示

## 対象設計書

- `docs/00_INDEX.md`: プロジェクト概要
- `docs/01_REQUIREMENTS.md`: 要件定義
- `docs/02_ARCHITECTURE.md`: システムアーキテクチャ
- `docs/03_DATA_MODEL.md`: データモデル設計
- `docs/04_UI_UX_DESIGN.md`: UI/UX設計
- `docs/05_FEATURES.md`: 機能仕様
- `docs/06_SECURITY.md`: セキュリティ設計
- `docs/07_PERFORMANCE.md`: パフォーマンス設計

## 作業手順

### 1. 機能名の特定

ユーザーから指定された機能名を確認し、関連する設計書を特定する。

**機能名の例**:
- Dial（日付選択Dial）
- 日記作成機能
- 自動保存
- DiaryEntryエンティティ
- DateValue値オブジェクト
- PastEntriesList

### 2. 関連設計書の読み込み

特定した設計書を読み込む。必要に応じて複数の設計書を並列で読み込む。

**例**:
```
機能名: Dial
→ 関連設計書:
  - 01_REQUIREMENTS.md (FR-01: 日付選択機能)
  - 04_UI_UX_DESIGN.md (セクション3.1: Dial)
  - 05_FEATURES.md (セクション1: Dial操作による日付選択)
```

### 3. MVP版の仕様を抽出

**重要**: MVP版とPhase 2を必ず区別する。

MVP版の特徴:
- LocalStorageのみ
- Client Componentsのみ（'use client'）
- 認証なし
- 自動保存のみ（保存ボタンなし）
- カレンダーUIによる日付選択（Dialは補助）

### 4. 実装方針を提示

以下の観点から実装方針を提示する:

#### アーキテクチャ
- データ保存方法（LocalStorage / Prisma）
- コンポーネントタイプ（Client / Server）
- 状態管理（useState / Context）

#### データモデル
- 使用するエンティティ・値オブジェクト
- バリデーションルール（Zodスキーマ）
- リポジトリインターフェース

#### UI設計
- Atomic Design階層（atoms / molecules / organisms）
- レスポンシブ対応（モバイル / タブレット / デスクトップ）
- アクセシビリティ（ARIA属性、キーボード操作）

#### テスト
- テストファースト（TDD）
- テストケース（正常系 / 異常系）

### 5. チェックリストの提供

実装時に確認すべきチェックリストを提供する。

### 6. コード例の抽出

設計書から関連するコード例を抽出する。

## 出力フォーマット

```markdown
# 設計書レビュー: <機能名>

## 📚 関連設計書

- **01_REQUIREMENTS.md**: FR-XX セクション名
- **05_FEATURES.md**: セクションY「機能名」
- **04_UI_UX_DESIGN.md**: セクションZ「コンポーネント名」

## 🎯 MVP版の仕様

### 必須要件（Must）
1. 要件1の詳細
2. 要件2の詳細

### 任意要件（Should）
1. 任意要件1
2. 任意要件2

### 制約（Constraint）
1. 制約1
2. 制約2

### Phase 2での実装（将来）
- 将来実装する機能

## 🏗️ 実装方針

### アーキテクチャ
- **データ保存**: LocalStorageDiaryRepository
- **コンポーネント**: Client Component（'use client'）
- **状態管理**: useState, useEffect

### データモデル
- **エンティティ**: DiaryEntry
- **値オブジェクト**: DateValue（使用する場合）
- **バリデーション**: DiaryEntrySchema (Zod)

### UI設計
- **Atomic Design階層**: organisms / molecules / atoms
- **主要コンポーネント**: コンポーネント名
- **依存コンポーネント**: 下位コンポーネントのリスト

### レスポンシブ対応
- **モバイル（〜767px）**: 仕様
- **タブレット（768px〜1023px）**: 仕様
- **デスクトップ（1024px〜）**: 仕様

### アクセシビリティ
- **ARIA属性**: aria-label, aria-describedby など
- **キーボード操作**: Tab, Enter, Escape など
- **フォーカス管理**: focus-visible など

## 📝 実装チェックリスト

### 開始前
- [ ] 関連する設計書を全て確認した
- [ ] MVP版とPhase 2の区別を理解した
- [ ] Atomic Designの階層を確認した

### 実装時
- [ ] テストを先に書いた（TDD）
- [ ] エンティティ・値オブジェクトを使用した
- [ ] バリデーションを実装した
- [ ] Clean Architectureの依存関係を守った

### 完了時
- [ ] テストが全て通る
- [ ] アクセシビリティを確認した
- [ ] レスポンシブデザインを確認した
- [ ] 設計書との整合性を再確認した

## 💡 実装のポイント

- ポイント1
- ポイント2

## ⚠️ 注意事項

- 注意事項1
- 注意事項2

## 🔗 関連コード例

（設計書から抽出したコード例）
```

## 重要な注意事項

1. **MVP版とPhase 2を混同しない**
   - MVP版: LocalStorage + Client Components
   - Phase 2: Prisma + Server Components

2. **設計書の内容を正確に抽出する**
   - 推測や追加の提案はしない
   - 設計書に記載されている内容のみを抽出

3. **最新の設計書を参照する**
   - FINAL_REVIEW_RESULT.md を確認済み
   - すべての修正が反映されている

4. **複数の設計書を横断的に参照する**
   - 機能仕様（05）だけでなく、要件（01）、UI設計（04）も確認
   - アーキテクチャ（02）、データモデル（03）との整合性も確認

5. **実装可能な具体的な情報を提供する**
   - 抽象的な説明ではなく、具体的なコード例を提示
   - チェックリストは実際にチェックできる項目にする