# 画面設計書 21-ドキュメントホーム画面

## 概要

本ドキュメントは、Liam ERDドキュメントサイトのルートページ（ホーム画面）の設計仕様を定義する。このページはドキュメントサイトへのエントリーポイントとして機能し、アクセス時に即座にドキュメント詳細画面へリダイレクトする。

### 本画面の処理概要

**業務上の目的・背景**：ドキュメントホーム画面は、Liam ERDのドキュメントサイト（docs app）へのアクセスを適切に誘導するためのリダイレクト専用画面である。ユーザーがドキュメントサイトのルートURL（`/`）にアクセスした場合、ドキュメントコンテンツが存在する `/docs` パスへ自動的に遷移させることで、ユーザーエクスペリエンスを向上させる。また、外部サイトやブックマークからの直接アクセスを適切にハンドリングし、常に有効なコンテンツページへ誘導する役割を担う。

**画面へのアクセス方法**：ブラウザでドキュメントサイトのルートURL（例：`https://liam-hq.com/` または `http://localhost:3002/`）に直接アクセスすることで表示される。

**主要な操作・処理内容**：
1. ユーザーがルートURLにアクセスする
2. サーバーサイドでリダイレクト処理が即座に実行される
3. `/docs` パスへHTTPリダイレクトが発生する
4. ユーザーはドキュメント詳細画面（Welcome to Liam ERDページ）へ遷移する

**画面遷移**：
- **遷移元**: 外部サイト、ブックマーク、直接URL入力
- **遷移先**: `/docs`（ドキュメント詳細画面 - Welcome to Liam ERDページ）

**権限による表示制御**：本画面は認証不要で、すべてのユーザーがアクセス可能である。権限による表示制御は存在しない。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 49 | ドキュメントサイト | 主機能 | `/docs`へのリダイレクト処理 |

## 画面種別

リダイレクト

## URL/ルーティング

| 項目 | 値 |
|------|-----|
| パス | `/` |
| ファイル | `frontend/apps/docs/app/page.tsx` |
| コンポーネントタイプ | サーバーコンポーネント |
| リダイレクト先 | `/docs` |

## 入出力項目

本画面はリダイレクト専用であるため、ユーザー入力項目は存在しない。

| 区分 | 項目名 | 型 | 必須 | 説明 |
|------|--------|-----|------|------|
| - | - | - | - | 入出力項目なし |

## 表示項目

本画面は即座にリダイレクトされるため、表示項目は存在しない。

| 項目名 | 型 | 説明 |
|--------|-----|------|
| - | - | 表示項目なし（リダイレクト画面） |

## イベント仕様

### 1-ページアクセス

ユーザーがルートURLにアクセスした際、Next.jsの`redirect`関数により即座に`/docs`パスへサーバーサイドリダイレクトが実行される。

**処理フロー**:
1. ユーザーがルートURL（`/`）にHTTPリクエストを送信
2. Next.jsがページコンポーネント（`Page`）をレンダリング
3. `redirect('/docs')`が呼び出される
4. HTTPステータス307（Temporary Redirect）が返却される
5. ブラウザが`/docs`へ自動遷移する

## データベース更新仕様

本画面はデータベースへのアクセスを行わない。

### 操作別データベース影響一覧

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| - | - | - | データベース操作なし |

## メッセージ仕様

本画面はリダイレクト専用であるため、メッセージ表示は行わない。

| メッセージID | 種別 | メッセージ内容 | 表示条件 |
|-------------|------|---------------|----------|
| - | - | - | メッセージなし |

## 例外処理

本画面はシンプルなリダイレクト処理のみを行うため、特別な例外処理は存在しない。

| 例外条件 | 処理内容 | ユーザーへの影響 |
|---------|---------|-----------------|
| リダイレクト先が存在しない | Next.jsのデフォルト404処理 | 404エラーページ表示 |

## 備考

- 本画面はサーバーコンポーネントとして実装されており、クライアントサイドJavaScriptは実行されない
- リダイレクト処理はNext.js 15の`next/navigation`モジュールの`redirect`関数を使用
- ドキュメントサイトはFumadocsフレームワークをベースに構築されている
- 本番環境のベースURLは環境変数`NEXT_PUBLIC_BASE_URL`で設定される（デフォルト: `http://localhost:3002`）

---

## コードリーディングガイド

本画面を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: データ構造を理解する

本画面はリダイレクト専用のため、扱うデータ構造は最小限である。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | page.tsx | `frontend/apps/docs/app/page.tsx` | リダイレクト処理の実装（5行のみ） |

**読解のコツ**: Next.js 15のApp Routerにおいて、`redirect`関数はサーバーコンポーネント内で使用でき、呼び出し時に即座にリダイレクトレスポンスを生成する。

#### Step 2: エントリーポイントを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | page.tsx | `frontend/apps/docs/app/page.tsx` | ルートURLのページコンポーネント |

**主要処理フロー**:
1. **1行目**: `next/navigation`から`redirect`関数をインポート
2. **3-5行目**: デフォルトエクスポートされた`Page`関数コンポーネント
3. **4行目**: `redirect('/docs')`の呼び出しによりリダイレクト実行

#### Step 3: レイアウト構造を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | layout.tsx | `frontend/apps/docs/app/layout.tsx` | ルートレイアウト（全ページ共通） |

**主要処理フロー**:
- **6-9行目**: Google Tag Manager、Cookie Consentの設定
- **74-90行目**: `RootProvider`による検索機能の設定
- **82-88行目**: `Banner`コンポーネントの表示設定

### プログラム呼び出し階層図

```
/（ルートURL）
    │
    └─ page.tsx (Page関数)
           │
           └─ redirect('/docs')
                  │
                  └─ /docs へHTTPリダイレクト
                         │
                         └─ docs/[[...slug]]/page.tsx へ遷移
```

### データフロー図

```
[入力]               [処理]                    [出力]

HTTPリクエスト    ───▶ Next.js Server ───▶ HTTP 307 Redirect
   GET /                                      Location: /docs
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| page.tsx | `frontend/apps/docs/app/page.tsx` | ソース | ルートページ（リダイレクト処理） |
| layout.tsx | `frontend/apps/docs/app/layout.tsx` | ソース | ルートレイアウト（共通UI設定） |
| layout.config.tsx | `frontend/apps/docs/app/layout.config.tsx` | 設定 | レイアウト共通設定（ナビゲーション等） |
| global.css | `frontend/apps/docs/app/global.css` | スタイル | グローバルスタイル定義 |
