# 画面設計書 1-Railsウェルカム画面

## 概要

本ドキュメントは、Ruby on Rails フレームワークにおけるRailsウェルカム画面の画面設計を定義するものである。

### 本画面の処理概要

本画面は、新規にRailsアプリケーションを作成した直後に、開発サーバーを起動してアクセスした際に表示されるデフォルトのランディングページである。Railsフレームワークのロゴを中心に据えた視覚的なウェルカムメッセージと、動作環境の基本情報を表示する。

**業務上の目的・背景**：新規Railsアプリケーション開発者に対して、アプリケーションが正常に起動していることを視覚的に確認させるとともに、開発環境のバージョン情報（Rails、Rack、Ruby）を即座に把握できるようにする。これにより、開発者は環境構築が正しく完了したことを確認でき、次の開発ステップに進む準備ができたことを認識できる。

**画面へのアクセス方法**：新規Railsアプリケーションでルーティングが定義されていない状態で、ルートパス（/）にアクセスすることで表示される。具体的には、`rails new` コマンド実行後、`rails server` でサーバーを起動し、ブラウザで `http://localhost:3000/` にアクセスする。

**主要な操作・処理内容**：
1. 画面中央のRailsロゴをクリックすると、Ruby on Rails公式サイト（https://rubyonrails.org）に新規タブで遷移する
2. 画面下部に表示されるバージョン情報の閲覧（Railsバージョン、Rackバージョン、Rubyバージョン）
3. レスポンシブ対応により、各種デバイスサイズで適切に表示される

**画面遷移**：
- 遷移元：特になし（アプリケーション起動時の初期画面）
- 遷移先：Railsロゴクリック時 → Ruby on Rails公式サイト（外部リンク）

**権限による表示制御**：本画面はすべてのユーザーに対して同一の内容を表示する。認証・認可の概念は存在せず、アクセス制限はない。ただし、アプリケーションにルーティングが定義されると本画面は表示されなくなる。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 2 | Railties | 主機能 | 新規Railsアプリケーション起動時のデフォルトページ表示処理 |
| 5 | Action View | 補助機能 | ERBテンプレートによるHTML描画処理 |

## 画面種別

表示専用画面（ウェルカムページ）

## URL/ルーティング

| HTTP メソッド | URL パターン | コントローラー#アクション |
|--------------|--------------|--------------------------|
| GET | / | rails/welcome#index |

ルーティング定義箇所: `railties/lib/rails/engine.rb` 内部で定義されるキャッチオールルート

## 入出力項目

本画面は表示専用であり、ユーザーからの入力項目は存在しない。

### 出力項目

| 項目名 | 表示形式 | 説明 |
|--------|----------|------|
| Railsロゴ | 画像（SVG埋め込み） | Ruby on Railsのロゴ画像。クリック可能なリンク |
| Rails version | テキスト | 現在のRailsバージョン番号 |
| Rack version | テキスト | 現在のRackバージョン番号 |
| Ruby version | テキスト | 現在のRubyバージョンとプラットフォーム情報 |

## 表示項目

| No | 項目ID | 項目名 | データ型 | 取得元 | 備考 |
|----|--------|--------|----------|--------|------|
| 1 | rails_version | Railsバージョン | String | Rails.version | Railsフレームワークのバージョン |
| 2 | rack_version | Rackバージョン | String | Rack.release | Rackライブラリのバージョン |
| 3 | ruby_version | Rubyバージョン | String | RUBY_DESCRIPTION | Rubyインタープリタのバージョンとプラットフォーム |

## イベント仕様

### 1-Railsロゴクリック

**トリガー**: 画面中央のRailsロゴ画像をクリック

**処理内容**:
1. 新規ブラウザタブを開く
2. Ruby on Rails公式サイト（https://rubyonrails.org）に遷移

**遷移先**: https://rubyonrails.org（外部サイト、target="_blank"）

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

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

本画面はデータベースアクセスを行わない。静的なウェルカムページの表示のみを行う。

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

## メッセージ仕様

本画面ではシステムメッセージの表示は行わない。

## 例外処理

| 例外条件 | 動作 |
|---------|------|
| ルーティングが定義されている場合 | 本画面は表示されず、定義されたルートに従った画面が表示される |

## 備考

- 本画面はRailsアプリケーションの開発時のみ使用される初期画面である
- アプリケーションにルーティング（config/routes.rb）を定義すると、本画面は表示されなくなる
- ダークモード対応：ユーザーのシステム設定に応じて、ライトモードとダークモードの2種類のカラースキームに自動切り替えされる
- レスポンシブデザイン：ビューポートサイズに応じてロゴサイズが動的に調整される（20vw、最小86px、最大280px）

---

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

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

### 推奨読解順序

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

本画面で使用されるバージョン情報の取得元を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | version.rb | `railties/lib/rails/version.rb` | Rails.versionの定義方法を理解する |
| 1-2 | gem_version.rb | `railties/lib/rails/gem_version.rb` | Railsバージョン番号の構成を理解する |

**読解のコツ**: `Rails.version` は `Rails::VERSION` モジュールの定数から組み立てられる。`MAJOR.MINOR.TINY.PRE` の形式で構成される。

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

処理の起点となるコントローラーを理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | welcome_controller.rb | `railties/lib/rails/welcome_controller.rb` | ウェルカム画面のコントローラーアクションを理解する |

**主要処理フロー**:
1. **5-6行目**: `Rails::ApplicationController` を継承
2. **7行目**: CSRF保護をスキップ（`skip_forgery_protection`）
3. **8行目**: レイアウトなしで描画（`layout false`）
4. **10-11行目**: `index` アクションは空の定義（テンプレートのみで描画）

#### Step 3: ビューテンプレートを理解する

HTMLの描画ロジックを理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | index.html.erb | `railties/lib/rails/templates/rails/welcome/index.html.erb` | テンプレートの構造とERB埋め込みを理解する |

**主要処理フロー**:
- **1-93行目**: DOCTYPE宣言、head要素、CSSスタイル定義
- **38-44行目**: ダークモード用のメディアクエリスタイル
- **95-106行目**: body要素内のコンテンツ（ロゴとバージョン情報）
- **103-105行目**: バージョン情報の動的出力（ERB）

#### Step 4: ルーティング定義を理解する

本画面へのアクセス経路を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 4-1 | engine.rb | `railties/lib/rails/engine.rb` | Railsエンジン内でのウェルカムルートの定義を理解する |

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

```
ブラウザリクエスト (GET /)
    │
    ├─ Rails::Engine (ルーティング)
    │      └─ キャッチオールルートで Rails::WelcomeController#index にディスパッチ
    │
    └─ Rails::WelcomeController#index
           │
           └─ index.html.erb テンプレート描画
                  │
                  ├─ Rails.version 取得
                  ├─ Rack.release 取得
                  └─ RUBY_DESCRIPTION 取得
```

### データフロー図

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

HTTPリクエスト ──▶ WelcomeController#index ──▶ index.html.erb
(GET /)                    │
                           │
                    バージョン情報取得
                           │
                           ├─ Rails.version
                           ├─ Rack.release
                           └─ RUBY_DESCRIPTION
                                                           ↓
                                                    HTML レスポンス
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| welcome_controller.rb | `railties/lib/rails/welcome_controller.rb` | コントローラー | ウェルカム画面のアクション定義 |
| index.html.erb | `railties/lib/rails/templates/rails/welcome/index.html.erb` | テンプレート | HTML描画テンプレート |
| application_controller.rb | `railties/lib/rails/application_controller.rb` | コントローラー | 親クラスの定義 |
| version.rb | `railties/lib/rails/version.rb` | ソース | Railsバージョン定義 |
| gem_version.rb | `railties/lib/rails/gem_version.rb` | ソース | バージョン番号の構成要素 |
| engine.rb | `railties/lib/rails/engine.rb` | ソース | ルーティング定義を含むエンジン基盤 |
