@k2works/claude-code-booster 6.2.0 → 6.3.0

package/lib/assets/docs/article/practical-database-design/study/study4-1.md

@@ -1,2596 +0,0 @@
----
-type: Article
-title: "実践データベース設計：生産管理システム 研究 1 - モノリスサービスの実装"
-description: "本研究では、API サーバー構成（第32章）とは異なるアプローチとして、モノリスアーキテクチャによる生産管理システムを実装します。"
-tags: [article, practical-database-design, study]
-status: stable
-generated: { by: human:kakimomokuri, at: 2026-03-30T08:34:28Z }
----
-
-# 実践データベース設計：生産管理システム 研究 1 - モノリスサービスの実装
-
-## はじめに
-
-本研究では、API サーバー構成（第32章）とは異なるアプローチとして、**モノリスアーキテクチャ**による生産管理システムを実装します。UI（テンプレートエンジン）、ビジネスロジック、データベースアクセスがすべて同一サーバー内で動作する、伝統的かつ堅実なアーキテクチャです。
-
----
-
-## 第33章：モノリスアーキテクチャの基礎
-
-### 33.1 モノリスアーキテクチャとは
-
-**モノリス（Monolith / Monolithic Architecture）**とは、「API」と「UI」と「ビジネスロジック」が **1つの実行ユニット**（1つのプロジェクトやバイナリ）にまとまっているアーキテクチャを指します。
-
-```plantuml
-@startuml monolith_architecture
-!define RECTANGLE class
-
-title モノリスアーキテクチャ
-
-package "モノリスサーバー (単一の実行ユニット)" {
-
-  package "プレゼンテーション層" {
-    [Controller]
-    [Thymeleaf テンプレート]
-    [静的リソース (CSS/JS)]
-  }
-
-  package "ビジネスロジック層" {
-    [Application Service]
-    [Domain Model]
-    [Domain Service]
-  }
-
-  package "データアクセス層" {
-    [Repository]
-    [MyBatis Mapper]
-  }
-}
-
-database "PostgreSQL" as DB
-
-actor "ブラウザ" as Browser
-
-Browser --> [Controller] : HTTP リクエスト
-[Controller] --> [Thymeleaf テンプレート] : モデル渡し
-[Thymeleaf テンプレート] --> Browser : HTML レスポンス
-[Controller] --> [Application Service]
-[Application Service] --> [Domain Model]
-[Application Service] --> [Repository]
-[Repository] --> [MyBatis Mapper]
-[MyBatis Mapper] --> DB
-
-note right of "モノリスサーバー (単一の実行ユニット)"
-  すべてが1つのプロセスで動作
-  - 同一JVMで実行
-  - 同一デプロイユニット
-  - 密結合だが開発・運用がシンプル
-end note
-
-@enduml
-```
-
-**モノリスの主な特徴：**
-
-| 特徴 | 説明 |
-|------|------|
-| **単一デプロイ** | アプリケーション全体が1つのアーティファクト（JAR/WAR）としてデプロイ |
-| **同一プロセス** | UI、ビジネスロジック、データアクセスが同じ JVM で動作 |
-| **テンプレートエンジン** | サーバーサイドで HTML を生成してブラウザに返却 |
-| **セッション管理** | サーバーサイドでユーザーセッションを管理 |
-| **トランザクション境界** | 単一プロセス内でのローカルトランザクション |
-
----
-
-### 33.2 API サーバー vs モノリス
-
-```plantuml
-@startuml api_vs_monolith
-!define RECTANGLE class
-
-left to right direction
-
-package "API サーバー構成（疎結合）" {
-  package "フロントエンド" as FE {
-    [React/Vue/Angular]
-    [SPA]
-  }
-
-  package "バックエンド" as BE {
-    [REST API]
-    [JSON レスポンス]
-  }
-
-  database "DB1" as DB_API
-
-  FE --> BE : HTTP/JSON
-  BE --> DB_API
-}
-
-package "モノリス構成（密結合）" {
-  package "モノリスサーバー" as Mono {
-    [Controller + View]
-    [テンプレートエンジン]
-    [ビジネスロジック]
-    [データアクセス]
-  }
-
-  database "DB2" as DB_Mono
-
-  Mono --> DB_Mono
-}
-
-actor "ブラウザ (API)" as Browser1
-actor "ブラウザ (Mono)" as Browser2
-
-Browser1 --> FE
-Browser2 --> Mono : HTTP (HTML)
-
-@enduml
-```
-
-| 観点 | API サーバー構成 | モノリス構成 |
-|------|-----------------|-------------|
-| **結合度** | 疎結合（フロントエンドとバックエンドが分離） | 密結合（すべてが同一サーバー） |
-| **フロントエンド** | SPA（React/Vue/Angular） | テンプレートエンジン（Thymeleaf） |
-| **通信方式** | REST API（JSON） | サーバーサイドレンダリング（HTML） |
-| **開発チーム** | フロント/バックエンドで分業可能 | フルスタックで開発 |
-| **デプロイ** | 別々にデプロイ可能 | 単一アーティファクトをデプロイ |
-| **スケーリング** | 個別にスケール可能 | 全体をスケール |
-| **複雑さ** | API 設計・認証・CORS などが必要 | シンプル、設定が少ない |
-| **初期開発速度** | 環境構築に時間がかかる | 素早く開発開始できる |
-| **SEO** | SSR/SSG が必要な場合あり | サーバーサイドレンダリングで SEO フレンドリー |
-
-#### モノリスを選択すべき場面
-
-**モノリスが適している状況：**
-
-1. **小〜中規模のチーム**：専門のフロントエンドチームがいない場合
-2. **社内システム**：SEO 不要、限られたユーザー数
-3. **業務アプリケーション**：複雑な業務フローをサーバーサイドで処理
-4. **迅速な開発**：MVP やプロトタイプの素早い構築
-5. **運用コスト重視**：インフラ構成をシンプルに保ちたい場合
-
-**生産管理システムにおけるモノリスのメリット：**
-
-```
-生産管理システムの特性
-├── 社内利用が中心 → SEO 不要、SPA 不要
-├── 複雑な業務フロー → サーバーサイドで制御が容易
-├── 帳票出力 → サーバーサイドで PDF/Excel 生成
-├── 大量データ処理 → MRP などバッチ処理との親和性
-└── 運用担当者のスキル → シンプルな構成が望ましい
-```
-
----
-
-### 33.3 モノリスにおけるヘキサゴナルアーキテクチャ
-
-モノリスであっても、ヘキサゴナルアーキテクチャ（Ports and Adapters）を採用することで、保守性の高い設計を実現できます。
-
-```plantuml
-@startuml hexagonal_monolith
-!define RECTANGLE class
-
-package "Hexagonal Architecture (モノリス版)" {
-
-  RECTANGLE "Application Core\n(Domain + Use Cases)" as core {
-    - Item (品目)
-    - Bom (部品構成表)
-    - Order (オーダ)
-    - Stock (在庫)
-    - ItemUseCase
-    - OrderUseCase
-    - InventoryUseCase
-  }
-
-  RECTANGLE "Input Adapters\n(Driving Side)" as input {
-    - Thymeleaf Controller
-    - フォーム処理
-    - セッション管理
-    - リクエスト検証
-  }
-
-  RECTANGLE "Output Adapters\n(Driven Side)" as output {
-    - MyBatis Repository
-    - Database Access
-    - Entity Mapping
-    - 帳票出力
-  }
-}
-
-input --> core : "Input Ports\n(Use Cases)"
-core --> output : "Output Ports\n(Repository Interfaces)"
-
-note top of core
-  純粋なビジネスロジック
-  UI 技術（Thymeleaf）に依存しない
-  テスト可能な状態を維持
-end note
-
-note left of input
-  HTML フォームからの入力
-  サーバーサイドレンダリング
-  セッションベースの認証
-end note
-
-note right of output
-  PostgreSQL + MyBatis
-  帳票生成（PDF/Excel）
-  ファイル出力
-end note
-
-@enduml
-```
-
-**モノリスでもヘキサゴナルアーキテクチャを適用する理由：**
-
-1. **テスト容易性**：ドメインロジックを UI から分離してテスト可能
-2. **将来の移行**：必要に応じて API 層を追加可能
-3. **保守性**：関心の分離により変更影響を局所化
-4. **再利用性**：ドメインロジックを複数の UI で共有可能
-
----
-
-### 33.4 ディレクトリ構成
-
-```
-src/main/java/com/example/production/
-├── domain/                     # ドメイン層（API版と共通）
-│   ├── model/
-│   │   ├── item/
-│   │   ├── bom/
-│   │   ├── order/
-│   │   └── inventory/
-│   └── exception/
-│
-├── application/               # アプリケーション層（API版と共通）
-│   ├── port/
-│   │   ├── in/               # Input Port（ユースケース）
-│   │   └── out/              # Output Port（リポジトリ）
-│   └── service/
-│
-├── infrastructure/
-│   ├── persistence/          # Output Adapter（DB実装）
-│   │   ├── mapper/
-│   │   └── repository/
-│   └── web/                  # Input Adapter（Web実装）
-│       ├── controller/       # Thymeleaf Controller
-│       ├── form/             # フォームオブジェクト
-│       └── helper/           # ビューヘルパー
-│
-├── config/
-│
-└── resources/
-    ├── templates/            # Thymeleaf テンプレート
-    │   ├── layout/           # 共通レイアウト
-    │   ├── items/            # 品目マスタ画面
-    │   ├── bom/              # BOM 画面
-    │   ├── orders/           # オーダ画面
-    │   └── inventory/        # 在庫画面
-    ├── static/               # 静的リソース
-    │   ├── css/
-    │   ├── js/
-    │   └── images/
-    └── messages.properties   # メッセージリソース
-```
-
----
-
-### 33.5 技術スタックの導入
-
-<details>
-<summary>build.gradle.kts</summary>
-
-```kotlin
-plugins {
-    id("java")
-    id("org.springframework.boot") version "3.2.0"
-    id("io.spring.dependency-management") version "1.1.4"
-}
-
-dependencies {
-    // Spring Boot Web（REST APIではなくMVCとして使用）
-    implementation("org.springframework.boot:spring-boot-starter-web")
-    implementation("org.springframework.boot:spring-boot-starter-validation")
-
-    // Thymeleaf（テンプレートエンジン）
-    implementation("org.springframework.boot:spring-boot-starter-thymeleaf")
-    implementation("nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect:3.3.0")
-
-    // Thymeleaf + Spring Security（認証機能を使う場合）
-    implementation("org.thymeleaf.extras:thymeleaf-extras-springsecurity6")
-
-    // htmx（モダンなインタラクティブUI）
-    // CDN から読み込むため依存関係は不要
-
-    // MyBatis
-    implementation("org.mybatis.spring.boot:mybatis-spring-boot-starter:3.0.3")
-
-    // PostgreSQL
-    runtimeOnly("org.postgresql:postgresql")
-
-    // Flyway
-    implementation("org.flywaydb:flyway-core")
-    implementation("org.flywaydb:flyway-database-postgresql")
-
-    // Webjars（Bootstrap等のフロントエンドライブラリ）
-    implementation("org.webjars:bootstrap:5.3.2")
-    implementation("org.webjars:webjars-locator-core:0.55")
-
-    // 帳票出力
-    implementation("org.apache.poi:poi-ooxml:5.2.5")  // Excel
-    implementation("com.itextpdf:itext7-core:8.0.2")  // PDF
-
-    // Test
-    testImplementation("org.springframework.boot:spring-boot-starter-test")
-    testImplementation("org.testcontainers:postgresql:1.19.3")
-    testImplementation("org.testcontainers:junit-jupiter:1.19.3")
-
-    // Lombok
-    compileOnly("org.projectlombok:lombok")
-    annotationProcessor("org.projectlombok:lombok")
-}
-```
-
-</details>
-
-**パッケージの説明：**
-
-| パッケージ | 用途 |
-|-----------|------|
-| spring-boot-starter-thymeleaf | サーバーサイドテンプレートエンジン |
-| thymeleaf-layout-dialect | レイアウト継承（共通ヘッダー・フッター） |
-| webjars:bootstrap | CSS フレームワーク（サーバーから配信） |
-| poi-ooxml | Excel ファイル出力 |
-| itext7-core | PDF ファイル出力 |
-
----
-
-### 33.6 基本的な Spring Boot + Thymeleaf アプリケーション
-
-<details>
-<summary>ProductionManagementApplication.java</summary>
-
-```java
-package com.example.production;
-
-import org.springframework.boot.SpringApplication;
-import org.springframework.boot.autoconfigure.SpringBootApplication;
-
-@SpringBootApplication
-public class ProductionManagementApplication {
-
-    public static void main(String[] args) {
-        SpringApplication.run(ProductionManagementApplication.class, args);
-    }
-}
-```
-
-</details>
-
-<details>
-<summary>application.yml</summary>
-
-```yaml
-spring:
-  datasource:
-    url: jdbc:postgresql://localhost:5432/production
-    username: postgres
-    password: postgres
-
-  thymeleaf:
-    cache: false  # 開発時はキャッシュ無効
-    prefix: classpath:/templates/
-    suffix: .html
-    encoding: UTF-8
-    mode: HTML
-
-  messages:
-    basename: messages
-    encoding: UTF-8
-
-mybatis:
-  mapper-locations: classpath:mapper/*.xml
-  configuration:
-    map-underscore-to-camel-case: true
-
-server:
-  servlet:
-    session:
-      timeout: 30m  # セッションタイムアウト
-```
-
-</details>
-
-<details>
-<summary>layout/default.html（共通レイアウト）</summary>
-
-```html
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org"
-      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-      lang="ja">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title layout:title-pattern="$CONTENT_TITLE - $LAYOUT_TITLE">生産管理システム</title>
-
-    <!-- Bootstrap CSS -->
-    <link rel="stylesheet" th:href="@{/webjars/bootstrap/css/bootstrap.min.css}">
-
-    <!-- カスタム CSS -->
-    <link rel="stylesheet" th:href="@{/css/style.css}">
-
-    <!-- htmx（部分更新用） -->
-    <script src="https://unpkg.com/htmx.org@1.9.10"></script>
-</head>
-<body>
-    <!-- ナビゲーションバー -->
-    <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
-        <div class="container-fluid">
-            <a class="navbar-brand" th:href="@{/}">生産管理システム</a>
-            <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
-                    data-bs-target="#navbarNav">
-                <span class="navbar-toggler-icon"></span>
-            </button>
-            <div class="collapse navbar-collapse" id="navbarNav">
-                <ul class="navbar-nav">
-                    <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" role="button"
-                           data-bs-toggle="dropdown">マスタ</a>
-                        <ul class="dropdown-menu">
-                            <li><a class="dropdown-item" th:href="@{/items}">品目マスタ</a></li>
-                            <li><a class="dropdown-item" th:href="@{/bom}">部品構成表</a></li>
-                            <li><a class="dropdown-item" th:href="@{/suppliers}">取引先マスタ</a></li>
-                            <li><a class="dropdown-item" th:href="@{/locations}">場所マスタ</a></li>
-                        </ul>
-                    </li>
-                    <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" role="button"
-                           data-bs-toggle="dropdown">計画</a>
-                        <ul class="dropdown-menu">
-                            <li><a class="dropdown-item" th:href="@{/mps}">基準生産計画</a></li>
-                            <li><a class="dropdown-item" th:href="@{/mrp}">MRP実行</a></li>
-                            <li><a class="dropdown-item" th:href="@{/orders}">オーダ照会</a></li>
-                        </ul>
-                    </li>
-                    <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" role="button"
-                           data-bs-toggle="dropdown">購買</a>
-                        <ul class="dropdown-menu">
-                            <li><a class="dropdown-item" th:href="@{/purchase-orders}">発注</a></li>
-                            <li><a class="dropdown-item" th:href="@{/receiving}">入荷・検収</a></li>
-                        </ul>
-                    </li>
-                    <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" role="button"
-                           data-bs-toggle="dropdown">製造</a>
-                        <ul class="dropdown-menu">
-                            <li><a class="dropdown-item" th:href="@{/work-orders}">作業指示</a></li>
-                            <li><a class="dropdown-item" th:href="@{/completions}">完成実績</a></li>
-                            <li><a class="dropdown-item" th:href="@{/labor-hours}">工数実績</a></li>
-                        </ul>
-                    </li>
-                    <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" role="button"
-                           data-bs-toggle="dropdown">在庫</a>
-                        <ul class="dropdown-menu">
-                            <li><a class="dropdown-item" th:href="@{/inventory}">在庫照会</a></li>
-                            <li><a class="dropdown-item" th:href="@{/issues}">払出</a></li>
-                            <li><a class="dropdown-item" th:href="@{/stocktaking}">棚卸</a></li>
-                        </ul>
-                    </li>
-                </ul>
-            </div>
-        </div>
-    </nav>
-
-    <!-- フラッシュメッセージ -->
-    <div class="container mt-3">
-        <div th:if="${successMessage}" class="alert alert-success alert-dismissible fade show" role="alert">
-            <span th:text="${successMessage}"></span>
-            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-        </div>
-        <div th:if="${errorMessage}" class="alert alert-danger alert-dismissible fade show" role="alert">
-            <span th:text="${errorMessage}"></span>
-            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-        </div>
-    </div>
-
-    <!-- メインコンテンツ -->
-    <main class="container mt-4">
-        <div layout:fragment="content">
-            <!-- 各ページのコンテンツがここに挿入される -->
-        </div>
-    </main>
-
-    <!-- フッター -->
-    <footer class="footer mt-5 py-3 bg-light">
-        <div class="container text-center">
-            <span class="text-muted">生産管理システム &copy; 2025</span>
-        </div>
-    </footer>
-
-    <!-- Bootstrap JS -->
-    <script th:src="@{/webjars/bootstrap/js/bootstrap.bundle.min.js}"></script>
-
-    <!-- ページ固有のスクリプト -->
-    <th:block layout:fragment="scripts"></th:block>
-</body>
-</html>
-```
-
-</details>
-
-<details>
-<summary>HomeController.java</summary>
-
-```java
-package com.example.production.infrastructure.web.controller;
-
-import com.example.production.application.port.in.InventoryUseCase;
-import com.example.production.application.port.in.OrderUseCase;
-import org.springframework.stereotype.Controller;
-import org.springframework.ui.Model;
-import org.springframework.web.bind.annotation.GetMapping;
-
-import java.time.LocalDate;
-
-/**
- * ホーム画面 Controller
- */
-@Controller
-public class HomeController {
-
-    private final OrderUseCase orderUseCase;
-    private final InventoryUseCase inventoryUseCase;
-
-    public HomeController(OrderUseCase orderUseCase, InventoryUseCase inventoryUseCase) {
-        this.orderUseCase = orderUseCase;
-        this.inventoryUseCase = inventoryUseCase;
-    }
-
-    @GetMapping("/")
-    public String home(Model model) {
-        // ダッシュボード情報を取得
-        model.addAttribute("today", LocalDate.now());
-        model.addAttribute("pendingOrders", orderUseCase.countPendingOrders());
-        model.addAttribute("shortageItems", inventoryUseCase.getShortageItems());
-        model.addAttribute("todayWorkOrders", orderUseCase.getTodayWorkOrders());
-
-        return "home";
-    }
-}
-```
-
-</details>
-
-<details>
-<summary>templates/home.html</summary>
-
-```html
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org"
-      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-      layout:decorate="~{layout/default}">
-<head>
-    <title>ホーム</title>
-</head>
-<body>
-<div layout:fragment="content">
-    <h1 class="mb-4">ダッシュボード</h1>
-
-    <div class="row">
-        <!-- 本日の日付 -->
-        <div class="col-md-3">
-            <div class="card text-white bg-primary mb-3">
-                <div class="card-header">本日</div>
-                <div class="card-body">
-                    <h5 class="card-title" th:text="${#temporals.format(today, 'yyyy年MM月dd日')}"></h5>
-                </div>
-            </div>
-        </div>
-
-        <!-- 未処理オーダ数 -->
-        <div class="col-md-3">
-            <div class="card text-white bg-warning mb-3">
-                <div class="card-header">未処理オーダ</div>
-                <div class="card-body">
-                    <h5 class="card-title">
-                        <span th:text="${pendingOrders}">0</span> 件
-                    </h5>
-                    <a th:href="@{/orders}" class="btn btn-sm btn-light">詳細を見る</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- 在庫不足品目 -->
-        <div class="col-md-3">
-            <div class="card text-white bg-danger mb-3">
-                <div class="card-header">在庫不足</div>
-                <div class="card-body">
-                    <h5 class="card-title">
-                        <span th:text="${#lists.size(shortageItems)}">0</span> 品目
-                    </h5>
-                    <a th:href="@{/inventory/shortage}" class="btn btn-sm btn-light">詳細を見る</a>
-                </div>
-            </div>
-        </div>
-
-        <!-- 本日の作業指示 -->
-        <div class="col-md-3">
-            <div class="card text-white bg-success mb-3">
-                <div class="card-header">本日の作業指示</div>
-                <div class="card-body">
-                    <h5 class="card-title">
-                        <span th:text="${#lists.size(todayWorkOrders)}">0</span> 件
-                    </h5>
-                    <a th:href="@{/work-orders}" class="btn btn-sm btn-light">詳細を見る</a>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <!-- 在庫不足品目一覧 -->
-    <div class="card mt-4" th:if="${not #lists.isEmpty(shortageItems)}">
-        <div class="card-header bg-danger text-white">
-            在庫不足品目
-        </div>
-        <div class="card-body">
-            <table class="table table-striped">
-                <thead>
-                    <tr>
-                        <th>品目コード</th>
-                        <th>品名</th>
-                        <th>現在庫</th>
-                        <th>安全在庫</th>
-                        <th>不足数</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr th:each="item : ${shortageItems}">
-                        <td>
-                            <a th:href="@{/items/{code}(code=${item.itemCode})}"
-                               th:text="${item.itemCode}"></a>
-                        </td>
-                        <td th:text="${item.itemName}"></td>
-                        <td th:text="${item.currentStock}"></td>
-                        <td th:text="${item.safetyStock}"></td>
-                        <td class="text-danger"
-                            th:text="${item.safetyStock - item.currentStock}"></td>
-                    </tr>
-                </tbody>
-            </table>
-        </div>
-    </div>
-
-    <!-- クイックアクセス -->
-    <div class="card mt-4">
-        <div class="card-header">クイックアクセス</div>
-        <div class="card-body">
-            <div class="row">
-                <div class="col-md-3 mb-2">
-                    <a th:href="@{/items/new}" class="btn btn-outline-primary w-100">
-                        品目登録
-                    </a>
-                </div>
-                <div class="col-md-3 mb-2">
-                    <a th:href="@{/purchase-orders/new}" class="btn btn-outline-primary w-100">
-                        発注登録
-                    </a>
-                </div>
-                <div class="col-md-3 mb-2">
-                    <a th:href="@{/work-orders/new}" class="btn btn-outline-primary w-100">
-                        作業指示登録
-                    </a>
-                </div>
-                <div class="col-md-3 mb-2">
-                    <a th:href="@{/mrp/execute}" class="btn btn-outline-success w-100">
-                        MRP 実行
-                    </a>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-</body>
-</html>
-```
-
-</details>
-
----
-
-### 33.7 htmx による部分更新
-
-モノリスアプリケーションでも、**htmx** を使用することで SPA のような操作性を実現できます。ページ全体をリロードせず、必要な部分だけを更新します。
-
-```plantuml
-@startuml htmx_flow
-!define RECTANGLE class
-
-title htmx による部分更新
-
-actor "ブラウザ" as Browser
-participant "htmx" as htmx
-participant "Controller" as Controller
-participant "Thymeleaf\nフラグメント" as Fragment
-
-Browser -> htmx : ボタンクリック
-htmx -> Controller : AJAX リクエスト\n(hx-get/hx-post)
-Controller -> Fragment : フラグメントを\nレンダリング
-Fragment --> Controller : HTML フラグメント
-Controller --> htmx : HTML レスポンス
-htmx -> Browser : DOM を部分更新\n(hx-target)
-
-note right of htmx
-  htmx は特別な属性（hx-*）を
-  使って AJAX 通信を行う
-  JavaScript を書かずに
-  インタラクティブな UI を実現
-end note
-
-@enduml
-```
-
-<details>
-<summary>htmx による品目検索（部分更新）</summary>
-
-```html
-<!-- 品目検索（部分更新） -->
-<div class="mb-3">
-    <input type="text"
-           class="form-control"
-           name="keyword"
-           placeholder="品目コードまたは品名で検索"
-           hx-get="/items/search"
-           hx-trigger="keyup changed delay:300ms"
-           hx-target="#search-results"
-           hx-indicator="#loading">
-    <span id="loading" class="htmx-indicator">検索中...</span>
-</div>
-
-<!-- 検索結果がここに挿入される -->
-<div id="search-results">
-    <!-- Controller から返される HTML フラグメント -->
-</div>
-```
-
-</details>
-
-<details>
-<summary>検索エンドポイント（htmx 用 Controller）</summary>
-
-```java
-@Controller
-@RequestMapping("/items")
-public class ItemController {
-
-    private final ItemUseCase itemUseCase;
-
-    // ... コンストラクタ省略
-
-    /**
-     * htmx 用の検索エンドポイント（フラグメントを返す）
-     */
-    @GetMapping("/search")
-    public String search(
-            @RequestParam(required = false) String keyword,
-            Model model) {
-
-        List<Item> items = itemUseCase.searchItems(keyword);
-        model.addAttribute("items", items);
-
-        // フラグメントのみを返す
-        return "items/search-results :: results";
-    }
-}
-```
-
-</details>
-
-<details>
-<summary>items/search-results.html（検索結果フラグメント）</summary>
-
-```html
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-<!-- フラグメント定義 -->
-<div th:fragment="results">
-    <table class="table table-striped" th:if="${not #lists.isEmpty(items)}">
-        <thead>
-            <tr>
-                <th>品目コード</th>
-                <th>品名</th>
-                <th>品目区分</th>
-                <th>操作</th>
-            </tr>
-        </thead>
-        <tbody>
-            <tr th:each="item : ${items}">
-                <td th:text="${item.itemCode}"></td>
-                <td th:text="${item.itemName}"></td>
-                <td th:text="${item.category.displayName}"></td>
-                <td>
-                    <a th:href="@{/items/{code}(code=${item.itemCode})}"
-                       class="btn btn-sm btn-primary">詳細</a>
-                    <button class="btn btn-sm btn-danger"
-                            hx-delete="/items/{code}"
-                            th:attr="hx-delete=@{/items/{code}(code=${item.itemCode})}"
-                            hx-confirm="本当に削除しますか？"
-                            hx-target="closest tr"
-                            hx-swap="outerHTML">削除</button>
-                </td>
-            </tr>
-        </tbody>
-    </table>
-    <div th:if="${#lists.isEmpty(items)}" class="alert alert-info">
-        該当する品目が見つかりませんでした。
-    </div>
-</div>
-</html>
-```
-
-</details>
-
----
-
-### 33.8 API サーバー版との Controller の違い
-
-#### API サーバー版（REST Controller）
-
-<details>
-<summary>ItemApiController.java（API サーバー版）</summary>
-
-```java
-@RestController  // JSON を返す
-@RequestMapping("/api/items")
-public class ItemApiController {
-
-    @GetMapping
-    public ResponseEntity<List<ItemResponse>> getAllItems() {
-        List<Item> items = itemUseCase.getAllItems();
-        return ResponseEntity.ok(items.stream()
-            .map(ItemResponse::from)
-            .toList());
-    }
-
-    @PostMapping
-    public ResponseEntity<ItemResponse> createItem(
-            @Valid @RequestBody CreateItemRequest request) {  // JSON リクエスト
-        Item item = itemUseCase.createItem(request.toCommand());
-        return ResponseEntity.status(HttpStatus.CREATED)
-            .body(ItemResponse.from(item));
-    }
-}
-```
-
-</details>
-
-#### モノリス版（MVC Controller）
-
-<details>
-<summary>ItemController.java（モノリス版）</summary>
-
-```java
-@Controller  // HTML を返す
-@RequestMapping("/items")
-public class ItemController {
-
-    @GetMapping
-    public String list(Model model) {
-        List<Item> items = itemUseCase.getAllItems();
-        model.addAttribute("items", items);
-        return "items/list";  // Thymeleaf テンプレート
-    }
-
-    @PostMapping
-    public String create(
-            @Valid @ModelAttribute("form") ItemForm form,  // フォームデータ
-            BindingResult bindingResult,
-            RedirectAttributes redirectAttributes) {
-
-        if (bindingResult.hasErrors()) {
-            return "items/new";  // バリデーションエラー時は入力画面に戻る
-        }
-
-        itemUseCase.createItem(form.toCommand());
-        redirectAttributes.addFlashAttribute("successMessage", "品目を登録しました");
-        return "redirect:/items";  // PRG パターン
-    }
-}
-```
-
-</details>
-
-**主な違い：**
-
-| 観点 | API サーバー版 | モノリス版 |
-|------|--------------|-----------|
-| アノテーション | `@RestController` | `@Controller` |
-| 戻り値 | `ResponseEntity<T>` | テンプレート名（String） |
-| リクエスト | `@RequestBody`（JSON） | `@ModelAttribute`（フォーム） |
-| バリデーション | 例外ハンドラで処理 | `BindingResult` で処理 |
-| レスポンス | JSON | HTML（Thymeleaf） |
-| リダイレクト | 不要 | PRG パターン |
-
----
-
-## 第34章：マスタの実装
-
-### 34.1 品目マスタ画面の設計
-
-| 画面 | URL | メソッド | 説明 |
-|------|-----|---------|------|
-| 品目一覧 | /items | GET | 品目の検索・一覧表示 |
-| 品目詳細 | /items/{itemCode} | GET | 品目の詳細表示 |
-| 品目登録 | /items/new | GET | 登録フォーム表示 |
-| 品目登録処理 | /items | POST | 登録処理 |
-| 品目編集 | /items/{itemCode}/edit | GET | 編集フォーム表示 |
-| 品目更新処理 | /items/{itemCode} | POST | 更新処理（PUT 代替） |
-| 品目削除処理 | /items/{itemCode}/delete | POST | 削除処理（DELETE 代替） |
-
-**注意**: HTML フォームは GET/POST のみ対応のため、PUT/DELETE は POST で代替します。
-
----
-
-### 34.2 フォームオブジェクトの設計
-
-<details>
-<summary>ItemForm.java</summary>
-
-```java
-package com.example.production.infrastructure.web.form;
-
-import com.example.production.application.port.in.CreateItemCommand;
-import com.example.production.domain.model.item.ItemCategory;
-import jakarta.validation.constraints.NotBlank;
-import jakarta.validation.constraints.NotNull;
-import jakarta.validation.constraints.Positive;
-import jakarta.validation.constraints.Size;
-import lombok.Data;
-
-/**
- * 品目登録・編集フォーム
- */
-@Data
-public class ItemForm {
-
-    @NotBlank(message = "品目コードは必須です")
-    @Size(max = 20, message = "品目コードは20文字以内で入力してください")
-    private String itemCode;
-
-    @NotBlank(message = "品名は必須です")
-    @Size(max = 100, message = "品名は100文字以内で入力してください")
-    private String itemName;
-
-    @NotNull(message = "品目区分は必須です")
-    private ItemCategory category;
-
-    private String itemGroupCode;
-
-    private String unitCode;
-
-    private String locationCode;
-
-    @Positive(message = "リードタイムは正の整数で入力してください")
-    private Integer leadTime;
-
-    @Positive(message = "安全在庫は正の整数で入力してください")
-    private Integer safetyStock;
-
-    /**
-     * フォームをコマンドに変換
-     */
-    public CreateItemCommand toCommand() {
-        return CreateItemCommand.builder()
-            .itemCode(this.itemCode)
-            .itemName(this.itemName)
-            .category(this.category)
-            .itemGroupCode(this.itemGroupCode)
-            .unitCode(this.unitCode)
-            .locationCode(this.locationCode)
-            .leadTime(this.leadTime)
-            .safetyStock(this.safetyStock)
-            .build();
-    }
-
-    /**
-     * エンティティからフォームを生成
-     */
-    public static ItemForm from(Item item) {
-        ItemForm form = new ItemForm();
-        form.setItemCode(item.getItemCode());
-        form.setItemName(item.getItemName());
-        form.setCategory(item.getCategory());
-        form.setItemGroupCode(item.getItemGroupCode());
-        form.setUnitCode(item.getUnitCode());
-        form.setLocationCode(item.getLocationCode());
-        form.setLeadTime(item.getLeadTime());
-        form.setSafetyStock(item.getSafetyStock());
-        return form;
-    }
-}
-```
-
-</details>
-
----
-
-### 34.3 品目 Controller の TDD 実装
-
-<details>
-<summary>ItemControllerTest.java</summary>
-
-```java
-package com.example.production.infrastructure.web.controller;
-
-import com.example.production.domain.model.item.Item;
-import com.example.production.domain.model.item.ItemCategory;
-import com.example.production.infrastructure.persistence.mapper.ItemMapper;
-import org.junit.jupiter.api.*;
-import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.boot.test.autoconfigure.web.servlet.AutoConfigureMockMvc;
-import org.springframework.boot.test.context.SpringBootTest;
-import org.springframework.test.context.DynamicPropertyRegistry;
-import org.springframework.test.context.DynamicPropertySource;
-import org.springframework.test.web.servlet.MockMvc;
-import org.testcontainers.containers.PostgreSQLContainer;
-import org.testcontainers.junit.jupiter.Container;
-import org.testcontainers.junit.jupiter.Testcontainers;
-
-import java.time.LocalDate;
-
-import static org.hamcrest.Matchers.*;
-import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.*;
-import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.*;
-
-@SpringBootTest
-@AutoConfigureMockMvc
-@Testcontainers
-@DisplayName("品目マスタ画面")
-class ItemControllerTest {
-
-    @Container
-    static PostgreSQLContainer<?> postgres = new PostgreSQLContainer<>("postgres:15")
-            .withDatabaseName("production_test")
-            .withUsername("test")
-            .withPassword("test");
-
-    @DynamicPropertySource
-    static void configureProperties(DynamicPropertyRegistry registry) {
-        registry.add("spring.datasource.url", postgres::getJdbcUrl);
-        registry.add("spring.datasource.username", postgres::getUsername);
-        registry.add("spring.datasource.password", postgres::getPassword);
-    }
-
-    @Autowired
-    private MockMvc mockMvc;
-
-    @Autowired
-    private ItemMapper itemMapper;
-
-    @BeforeEach
-    void setUp() {
-        itemMapper.deleteAll();
-    }
-
-    @Nested
-    @DisplayName("GET /items - 品目一覧")
-    class ItemList {
-
-        @Test
-        @DisplayName("品目一覧画面を表示できる")
-        void shouldDisplayItemList() throws Exception {
-            // Arrange
-            insertTestItem("PROD-001", "テスト製品", ItemCategory.PRODUCT);
-
-            // Act & Assert
-            mockMvc.perform(get("/items"))
-                .andExpect(status().isOk())
-                .andExpect(view().name("items/list"))
-                .andExpect(model().attributeExists("items"))
-                .andExpect(content().string(containsString("PROD-001")))
-                .andExpect(content().string(containsString("テスト製品")));
-        }
-
-        @Test
-        @DisplayName("品目区分でフィルタリングできる")
-        void shouldFilterByCategory() throws Exception {
-            // Arrange
-            insertTestItem("PROD-001", "製品A", ItemCategory.PRODUCT);
-            insertTestItem("PART-001", "部品A", ItemCategory.PART);
-
-            // Act & Assert
-            mockMvc.perform(get("/items").param("category", "PRODUCT"))
-                .andExpect(status().isOk())
-                .andExpect(model().attribute("items", hasSize(1)))
-                .andExpect(content().string(containsString("製品A")))
-                .andExpect(content().string(not(containsString("部品A"))));
-        }
-    }
-
-    @Nested
-    @DisplayName("POST /items - 品目登録処理")
-    class CreateItem {
-
-        @Test
-        @DisplayName("品目を登録できる")
-        void shouldCreateItem() throws Exception {
-            mockMvc.perform(post("/items")
-                    .param("itemCode", "NEW-001")
-                    .param("itemName", "新規品目")
-                    .param("category", "PRODUCT"))
-                .andExpect(status().is3xxRedirection())
-                .andExpect(redirectedUrl("/items"))
-                .andExpect(flash().attribute("successMessage", containsString("登録")));
-
-            // データベースに保存されていることを確認
-            var saved = itemMapper.findByCode("NEW-001");
-            Assertions.assertNotNull(saved);
-            Assertions.assertEquals("新規品目", saved.getItemName());
-        }
-
-        @Test
-        @DisplayName("バリデーションエラー時は入力画面に戻る")
-        void shouldReturnFormOnValidationError() throws Exception {
-            mockMvc.perform(post("/items")
-                    .param("itemCode", "")  // 必須項目が空
-                    .param("itemName", "")
-                    .param("category", "PRODUCT"))
-                .andExpect(status().isOk())
-                .andExpect(view().name("items/new"))
-                .andExpect(model().attributeHasFieldErrors("form", "itemCode", "itemName"));
-        }
-    }
-
-    private void insertTestItem(String code, String name, ItemCategory category) {
-        itemMapper.insert(Item.builder()
-            .itemCode(code)
-            .effectiveDate(LocalDate.of(2025, 1, 1))
-            .itemName(name)
-            .category(category)
-            .build());
-    }
-}
-```
-
-</details>
-
-<details>
-<summary>ItemController.java</summary>
-
-```java
-package com.example.production.infrastructure.web.controller;
-
-import com.example.production.application.port.in.*;
-import com.example.production.domain.exception.DuplicateItemException;
-import com.example.production.domain.exception.ItemNotFoundException;
-import com.example.production.domain.model.item.Item;
-import com.example.production.domain.model.item.ItemCategory;
-import com.example.production.infrastructure.web.form.ItemForm;
-import jakarta.validation.Valid;
-import org.springframework.stereotype.Controller;
-import org.springframework.ui.Model;
-import org.springframework.validation.BindingResult;
-import org.springframework.web.bind.annotation.*;
-import org.springframework.web.servlet.mvc.support.RedirectAttributes;
-
-import java.util.List;
-
-/**
- * 品目マスタ Controller（モノリス版）
- */
-@Controller
-@RequestMapping("/items")
-public class ItemController {
-
-    private final ItemUseCase itemUseCase;
-
-    public ItemController(ItemUseCase itemUseCase) {
-        this.itemUseCase = itemUseCase;
-    }
-
-    /**
-     * 品目一覧画面
-     */
-    @GetMapping
-    public String list(
-            @RequestParam(required = false) ItemCategory category,
-            @RequestParam(required = false) String keyword,
-            Model model) {
-
-        List<Item> items;
-        if (category != null) {
-            items = itemUseCase.getItemsByCategory(category);
-        } else if (keyword != null && !keyword.isBlank()) {
-            items = itemUseCase.searchItems(keyword);
-        } else {
-            items = itemUseCase.getAllItems();
-        }
-
-        model.addAttribute("items", items);
-        model.addAttribute("categories", ItemCategory.values());
-        model.addAttribute("selectedCategory", category);
-        model.addAttribute("keyword", keyword);
-
-        return "items/list";
-    }
-
-    /**
-     * 品目詳細画面
-     */
-    @GetMapping("/{itemCode}")
-    public String detail(@PathVariable String itemCode, Model model) {
-        Item item = itemUseCase.getItemByCode(itemCode);
-        model.addAttribute("item", item);
-        return "items/detail";
-    }
-
-    /**
-     * 品目登録画面
-     */
-    @GetMapping("/new")
-    public String newForm(Model model) {
-        model.addAttribute("form", new ItemForm());
-        model.addAttribute("categories", ItemCategory.values());
-        return "items/new";
-    }
-
-    /**
-     * 品目登録処理
-     */
-    @PostMapping
-    public String create(
-            @Valid @ModelAttribute("form") ItemForm form,
-            BindingResult bindingResult,
-            Model model,
-            RedirectAttributes redirectAttributes) {
-
-        if (bindingResult.hasErrors()) {
-            model.addAttribute("categories", ItemCategory.values());
-            return "items/new";
-        }
-
-        try {
-            itemUseCase.createItem(form.toCommand());
-            redirectAttributes.addFlashAttribute("successMessage",
-                "品目「" + form.getItemCode() + "」を登録しました");
-            return "redirect:/items";
-        } catch (DuplicateItemException e) {
-            model.addAttribute("errorMessage",
-                "品目コード「" + form.getItemCode() + "」は既に存在します");
-            model.addAttribute("categories", ItemCategory.values());
-            return "items/new";
-        }
-    }
-
-    /**
-     * 品目削除処理
-     */
-    @PostMapping("/{itemCode}/delete")
-    public String delete(
-            @PathVariable String itemCode,
-            RedirectAttributes redirectAttributes) {
-
-        itemUseCase.deleteItem(itemCode);
-        redirectAttributes.addFlashAttribute("successMessage",
-            "品目「" + itemCode + "」を削除しました");
-        return "redirect:/items";
-    }
-
-    /**
-     * 例外ハンドリング（品目が見つからない場合）
-     */
-    @ExceptionHandler(ItemNotFoundException.class)
-    @ResponseStatus(org.springframework.http.HttpStatus.NOT_FOUND)
-    public String handleItemNotFound(ItemNotFoundException e, Model model) {
-        model.addAttribute("errorMessage", e.getMessage());
-        return "error/404";
-    }
-}
-```
-
-</details>
-
----
-
-### 34.4 品目一覧テンプレート
-
-<details>
-<summary>items/list.html</summary>
-
-```html
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org"
-      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-      layout:decorate="~{layout/default}">
-<head>
-    <title>品目マスタ</title>
-</head>
-<body>
-<div layout:fragment="content">
-    <div class="d-flex justify-content-between align-items-center mb-4">
-        <h1>品目マスタ</h1>
-        <a th:href="@{/items/new}" class="btn btn-primary">
-            新規登録
-        </a>
-    </div>
-
-    <!-- 検索フォーム -->
-    <div class="card mb-4">
-        <div class="card-body">
-            <form th:action="@{/items}" method="get" class="row g-3">
-                <div class="col-md-4">
-                    <label class="form-label">キーワード検索</label>
-                    <input type="text" class="form-control" name="keyword"
-                           th:value="${keyword}" placeholder="品目コードまたは品名">
-                </div>
-                <div class="col-md-3">
-                    <label class="form-label">品目区分</label>
-                    <select class="form-select" name="category">
-                        <option value="">すべて</option>
-                        <option th:each="cat : ${categories}"
-                                th:value="${cat}"
-                                th:text="${cat.displayName}"
-                                th:selected="${cat == selectedCategory}"></option>
-                    </select>
-                </div>
-                <div class="col-md-2 d-flex align-items-end">
-                    <button type="submit" class="btn btn-secondary">検索</button>
-                </div>
-            </form>
-        </div>
-    </div>
-
-    <!-- 品目一覧テーブル -->
-    <div class="card">
-        <div class="card-body">
-            <table class="table table-striped table-hover" th:if="${not #lists.isEmpty(items)}">
-                <thead>
-                    <tr>
-                        <th>品目コード</th>
-                        <th>品名</th>
-                        <th>品目区分</th>
-                        <th>リードタイム</th>
-                        <th>安全在庫</th>
-                        <th>操作</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr th:each="item : ${items}">
-                        <td>
-                            <a th:href="@{/items/{code}(code=${item.itemCode})}"
-                               th:text="${item.itemCode}"></a>
-                        </td>
-                        <td th:text="${item.itemName}"></td>
-                        <td>
-                            <span class="badge"
-                                  th:classappend="${item.category.name() == 'PRODUCT'} ? 'bg-primary' :
-                                                  (${item.category.name() == 'PART'} ? 'bg-success' : 'bg-secondary')"
-                                  th:text="${item.category.displayName}"></span>
-                        </td>
-                        <td th:text="${item.leadTime} + ' 日'" th:if="${item.leadTime}"></td>
-                        <td th:unless="${item.leadTime}">-</td>
-                        <td th:text="${item.safetyStock}" th:if="${item.safetyStock}"></td>
-                        <td th:unless="${item.safetyStock}">-</td>
-                        <td>
-                            <a th:href="@{/items/{code}/edit(code=${item.itemCode})}"
-                               class="btn btn-sm btn-outline-primary">編集</a>
-                            <form th:action="@{/items/{code}/delete(code=${item.itemCode})}"
-                                  method="post" class="d-inline"
-                                  onsubmit="return confirm('本当に削除しますか？');">
-                                <button type="submit" class="btn btn-sm btn-outline-danger">削除</button>
-                            </form>
-                        </td>
-                    </tr>
-                </tbody>
-            </table>
-            <div th:if="${#lists.isEmpty(items)}" class="alert alert-info">
-                該当する品目がありません。
-            </div>
-        </div>
-    </div>
-
-    <!-- 件数表示 -->
-    <div class="mt-3 text-muted">
-        全 <span th:text="${#lists.size(items)}">0</span> 件
-    </div>
-</div>
-</body>
-</html>
-```
-
-</details>
-
----
-
-### 34.5 BOM マスタ画面の実装
-
-<details>
-<summary>BomController.java</summary>
-
-```java
-@Controller
-@RequestMapping("/bom")
-public class BomController {
-
-    private final BomService bomService;
-    private final ItemUseCase itemUseCase;
-
-    public BomController(BomService bomService, ItemUseCase itemUseCase) {
-        this.bomService = bomService;
-        this.itemUseCase = itemUseCase;
-    }
-
-    /**
-     * BOM 一覧画面（製品の一覧）
-     */
-    @GetMapping
-    public String list(Model model) {
-        List<Item> products = itemUseCase.getItemsByCategory(ItemCategory.PRODUCT);
-        model.addAttribute("products", products);
-        return "bom/list";
-    }
-
-    /**
-     * BOM 構成表示（ツリー展開）
-     */
-    @GetMapping("/{itemCode}/explode")
-    public String explode(@PathVariable String itemCode, Model model) {
-        BomNode tree = bomService.explodeBom(itemCode);
-        Item item = itemUseCase.getItemByCode(itemCode);
-
-        model.addAttribute("item", item);
-        model.addAttribute("bomTree", tree);
-        return "bom/explode";
-    }
-
-    /**
-     * 逆展開（使用先照会）
-     */
-    @GetMapping("/{itemCode}/where-used")
-    public String whereUsed(@PathVariable String itemCode, Model model) {
-        List<WhereUsedResult> parents = bomService.whereUsed(itemCode);
-        Item item = itemUseCase.getItemByCode(itemCode);
-
-        model.addAttribute("item", item);
-        model.addAttribute("parents", parents);
-        return "bom/where-used";
-    }
-}
-```
-
-</details>
-
-<details>
-<summary>bom/explode.html（BOM 展開テンプレート）</summary>
-
-```html
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org"
-      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-      layout:decorate="~{layout/default}">
-<head>
-    <title>BOM 展開</title>
-    <style>
-        .bom-tree { list-style-type: none; padding-left: 0; }
-        .bom-tree ul { list-style-type: none; padding-left: 20px; }
-        .bom-item { padding: 5px; border-left: 2px solid #dee2e6; margin-bottom: 2px; }
-        .bom-item:hover { background-color: #f8f9fa; }
-        .level-0 { border-left-color: #0d6efd; }
-        .level-1 { border-left-color: #198754; }
-        .level-2 { border-left-color: #ffc107; }
-        .level-3 { border-left-color: #dc3545; }
-    </style>
-</head>
-<body>
-<div layout:fragment="content">
-    <h1 class="mb-4">BOM 展開</h1>
-
-    <div class="card mb-4">
-        <div class="card-header">
-            <strong th:text="${item.itemCode}"></strong> -
-            <span th:text="${item.itemName}"></span>
-        </div>
-        <div class="card-body">
-            <!-- 再帰的なツリー表示 -->
-            <ul class="bom-tree">
-                <th:block th:replace="~{bom/fragments :: bomNode(${bomTree})}"></th:block>
-            </ul>
-        </div>
-    </div>
-
-    <a th:href="@{/bom}" class="btn btn-secondary">戻る</a>
-</div>
-</body>
-</html>
-```
-
-</details>
-
----
-
-## 第35章：トランザクションの実装
-
-### 35.1 発注業務画面の実装
-
-<details>
-<summary>PurchaseOrderController.java</summary>
-
-```java
-@Controller
-@RequestMapping("/purchase-orders")
-public class PurchaseOrderController {
-
-    private final PurchaseOrderUseCase purchaseOrderUseCase;
-    private final ItemUseCase itemUseCase;
-    private final SupplierUseCase supplierUseCase;
-
-    // ... コンストラクタ省略
-
-    /**
-     * 発注一覧画面
-     */
-    @GetMapping
-    public String list(
-            @RequestParam(required = false) String status,
-            @RequestParam(required = false) String supplierCode,
-            Model model) {
-
-        List<PurchaseOrder> orders = purchaseOrderUseCase.getOrders(status, supplierCode);
-        model.addAttribute("orders", orders);
-        model.addAttribute("suppliers", supplierUseCase.getAllSuppliers());
-        return "purchase-orders/list";
-    }
-
-    /**
-     * 発注登録画面
-     */
-    @GetMapping("/new")
-    public String newForm(Model model) {
-        model.addAttribute("form", new PurchaseOrderForm());
-        model.addAttribute("suppliers", supplierUseCase.getAllSuppliers());
-        model.addAttribute("items", itemUseCase.getItemsByCategory(ItemCategory.MATERIAL));
-        return "purchase-orders/new";
-    }
-
-    /**
-     * 発注登録処理
-     */
-    @PostMapping
-    public String create(
-            @Valid @ModelAttribute("form") PurchaseOrderForm form,
-            BindingResult bindingResult,
-            Model model,
-            RedirectAttributes redirectAttributes) {
-
-        if (bindingResult.hasErrors()) {
-            model.addAttribute("suppliers", supplierUseCase.getAllSuppliers());
-            model.addAttribute("items", itemUseCase.getItemsByCategory(ItemCategory.MATERIAL));
-            return "purchase-orders/new";
-        }
-
-        PurchaseOrder order = purchaseOrderUseCase.createOrder(form.toCommand());
-        redirectAttributes.addFlashAttribute("successMessage",
-            "発注「" + order.getOrderNumber() + "」を登録しました");
-        return "redirect:/purchase-orders";
-    }
-
-    /**
-     * 発注確定処理
-     */
-    @PostMapping("/{orderNumber}/confirm")
-    public String confirm(
-            @PathVariable String orderNumber,
-            RedirectAttributes redirectAttributes) {
-
-        purchaseOrderUseCase.confirmOrder(orderNumber);
-        redirectAttributes.addFlashAttribute("successMessage",
-            "発注「" + orderNumber + "」を確定しました");
-        return "redirect:/purchase-orders/" + orderNumber;
-    }
-}
-```
-
-</details>
-
----
-
-### 35.2 MRP 実行画面の実装
-
-<details>
-<summary>MrpController.java</summary>
-
-```java
-@Controller
-@RequestMapping("/mrp")
-public class MrpController {
-
-    private final MrpService mrpService;
-
-    public MrpController(MrpService mrpService) {
-        this.mrpService = mrpService;
-    }
-
-    /**
-     * MRP 実行画面
-     */
-    @GetMapping
-    public String index(Model model) {
-        model.addAttribute("form", new MrpExecuteForm());
-        return "mrp/index";
-    }
-
-    /**
-     * MRP 実行処理
-     */
-    @PostMapping("/execute")
-    public String execute(
-            @Valid @ModelAttribute("form") MrpExecuteForm form,
-            BindingResult bindingResult,
-            Model model,
-            RedirectAttributes redirectAttributes) {
-
-        if (bindingResult.hasErrors()) {
-            return "mrp/index";
-        }
-
-        MrpResult result = mrpService.execute(form.getStartDate(), form.getEndDate());
-
-        // 結果をセッションに保存（大量データのため）
-        model.addAttribute("result", result);
-        return "mrp/result";
-    }
-
-    /**
-     * MRP 結果の帳票出力（Excel）
-     */
-    @GetMapping("/export")
-    public ResponseEntity<Resource> exportExcel(HttpSession session) {
-        MrpResult result = (MrpResult) session.getAttribute("mrpResult");
-        if (result == null) {
-            throw new IllegalStateException("MRP 結果が見つかりません");
-        }
-
-        ByteArrayResource resource = mrpService.exportToExcel(result);
-
-        return ResponseEntity.ok()
-            .header(HttpHeaders.CONTENT_DISPOSITION,
-                "attachment; filename=mrp-result.xlsx")
-            .contentType(MediaType.parseMediaType(
-                "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"))
-            .body(resource);
-    }
-}
-```
-
-</details>
-
----
-
-## 第36章：エラーハンドリングと帳票出力
-
-### 36.1 グローバル例外ハンドラ
-
-<details>
-<summary>GlobalExceptionHandler.java</summary>
-
-```java
-package com.example.production.infrastructure.web.exception;
-
-import com.example.production.domain.exception.*;
-import org.springframework.ui.Model;
-import org.springframework.web.bind.annotation.ControllerAdvice;
-import org.springframework.web.bind.annotation.ExceptionHandler;
-import org.springframework.web.servlet.mvc.support.RedirectAttributes;
-
-/**
- * グローバル例外ハンドラ（モノリス版）
- */
-@ControllerAdvice
-public class GlobalExceptionHandler {
-
-    /**
-     * 品目が見つからない
-     */
-    @ExceptionHandler(ItemNotFoundException.class)
-    public String handleItemNotFound(ItemNotFoundException e, Model model) {
-        model.addAttribute("errorTitle", "品目が見つかりません");
-        model.addAttribute("errorMessage", e.getMessage());
-        return "error/404";
-    }
-
-    /**
-     * 重複エラー
-     */
-    @ExceptionHandler(DuplicateItemException.class)
-    public String handleDuplicate(DuplicateItemException e, RedirectAttributes redirectAttributes) {
-        redirectAttributes.addFlashAttribute("errorMessage", e.getMessage());
-        return "redirect:/items/new";
-    }
-
-    /**
-     * 在庫不足
-     */
-    @ExceptionHandler(InsufficientInventoryException.class)
-    public String handleInsufficientInventory(InsufficientInventoryException e, Model model) {
-        model.addAttribute("errorTitle", "在庫不足");
-        model.addAttribute("errorMessage", e.getMessage());
-        return "error/business-error";
-    }
-
-    /**
-     * その他の例外
-     */
-    @ExceptionHandler(Exception.class)
-    public String handleGenericException(Exception e, Model model) {
-        model.addAttribute("errorTitle", "システムエラー");
-        model.addAttribute("errorMessage", "予期しないエラーが発生しました。管理者に連絡してください。");
-        model.addAttribute("errorDetail", e.getMessage());
-        return "error/500";
-    }
-}
-```
-
-</details>
-
----
-
-### 36.2 帳票出力（Excel）
-
-<details>
-<summary>ReportService.java</summary>
-
-```java
-@Service
-public class ReportService {
-
-    /**
-     * 在庫一覧を Excel 出力
-     */
-    public ByteArrayResource exportInventoryToExcel(List<Stock> stocks) {
-        try (Workbook workbook = new XSSFWorkbook()) {
-            Sheet sheet = workbook.createSheet("在庫一覧");
-
-            // ヘッダー行
-            Row headerRow = sheet.createRow(0);
-            String[] headers = {"場所コード", "品目コード", "品名", "在庫数量", "在庫状態"};
-            for (int i = 0; i < headers.length; i++) {
-                Cell cell = headerRow.createCell(i);
-                cell.setCellValue(headers[i]);
-            }
-
-            // データ行
-            int rowNum = 1;
-            for (Stock stock : stocks) {
-                Row row = sheet.createRow(rowNum++);
-                row.createCell(0).setCellValue(stock.getLocationCode());
-                row.createCell(1).setCellValue(stock.getItemCode());
-                row.createCell(2).setCellValue(stock.getItemName());
-                row.createCell(3).setCellValue(stock.getQuantity().doubleValue());
-                row.createCell(4).setCellValue(stock.getStatus().getDisplayName());
-            }
-
-            // 列幅自動調整
-            for (int i = 0; i < headers.length; i++) {
-                sheet.autoSizeColumn(i);
-            }
-
-            ByteArrayOutputStream out = new ByteArrayOutputStream();
-            workbook.write(out);
-            return new ByteArrayResource(out.toByteArray());
-
-        } catch (IOException e) {
-            throw new RuntimeException("Excel 出力に失敗しました", e);
-        }
-    }
-}
-```
-
-</details>
-
-<details>
-<summary>ReportController.java</summary>
-
-```java
-@Controller
-@RequestMapping("/reports")
-public class ReportController {
-
-    private final ReportService reportService;
-    private final InventoryUseCase inventoryUseCase;
-
-    // ... コンストラクタ省略
-
-    @GetMapping("/inventory/excel")
-    public ResponseEntity<Resource> exportInventoryExcel(
-            @RequestParam(required = false) String locationCode) {
-
-        List<Stock> stocks = inventoryUseCase.getInventory(
-            InventoryQuery.builder().locationCode(locationCode).build());
-
-        ByteArrayResource resource = reportService.exportInventoryToExcel(stocks);
-
-        String filename = "inventory-" + LocalDate.now() + ".xlsx";
-
-        return ResponseEntity.ok()
-            .header(HttpHeaders.CONTENT_DISPOSITION,
-                "attachment; filename=" + filename)
-            .contentType(MediaType.parseMediaType(
-                "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"))
-            .body(resource);
-    }
-}
-```
-
-</details>
-
----
-
-## 第37章：ページネーション
-
-### 37.1 ページネーションの概要
-
-大量のデータを扱う一覧画面では、すべてのデータを一度に表示すると、パフォーマンスの低下やユーザビリティの問題が発生します。ページネーション（ページ分割）を実装することで、これらの問題を解決します。
-
-```plantuml
-@startuml pagination_flow
-!define RECTANGLE class
-
-title ページネーションの仕組み
-
-actor "ブラウザ" as Browser
-participant "Controller" as Controller
-participant "UseCase" as UseCase
-participant "Repository" as Repository
-database "Database" as DB
-
-Browser -> Controller : GET /items?page=2&size=20
-Controller -> UseCase : getItems(page=2, size=20)
-UseCase -> Repository : findAll(Pageable)
-Repository -> DB : SELECT ... LIMIT 20 OFFSET 20
-DB --> Repository : 20件のデータ + 総件数
-Repository --> UseCase : Page<Item>
-UseCase --> Controller : Page<Item>
-Controller --> Browser : items + ページ情報
-
-note right of DB
-  LIMIT: 1ページあたりの件数
-  OFFSET: スキップする件数
-  例: 2ページ目 = OFFSET 20
-end note
-
-@enduml
-```
-
-### 37.2 ページネーション用のドメインオブジェクト
-
-<details>
-<summary>PageResult.java（ページ結果）</summary>
-
-```java
-package com.example.pms.domain.model.common;
-
-import java.util.List;
-
-/**
- * ページネーション結果を保持するクラス.
- *
- * @param <T> コンテンツの型
- */
-public class PageResult<T> {
-
-    private final List<T> content;
-    private final int page;
-    private final int size;
-    private final long totalElements;
-    private final int totalPages;
-
-    public PageResult(List<T> content, int page, int size, long totalElements) {
-        this.content = content;
-        this.page = page;
-        this.size = size;
-        this.totalElements = totalElements;
-        this.totalPages = size > 0 ? (int) Math.ceil((double) totalElements / size) : 0;
-    }
-
-    public List<T> getContent() {
-        return content;
-    }
-
-    public int getPage() {
-        return page;
-    }
-
-    public int getSize() {
-        return size;
-    }
-
-    public long getTotalElements() {
-        return totalElements;
-    }
-
-    public int getTotalPages() {
-        return totalPages;
-    }
-
-    public boolean hasNext() {
-        return page < totalPages - 1;
-    }
-
-    public boolean hasPrevious() {
-        return page > 0;
-    }
-
-    public boolean isFirst() {
-        return page == 0;
-    }
-
-    public boolean isLast() {
-        return page >= totalPages - 1;
-    }
-}
-```
-
-</details>
-
----
-
-### 37.3 Repository 層の実装
-
-<details>
-<summary>ItemRepository.java（ページネーション対応）</summary>
-
-```java
-package com.example.pms.application.port.out;
-
-import com.example.pms.domain.model.item.Item;
-import com.example.pms.domain.model.item.ItemCategory;
-
-import java.util.List;
-import java.util.Optional;
-
-public interface ItemRepository {
-
-    /**
-     * ページネーション付きで品目を取得
-     */
-    List<Item> findWithPagination(ItemCategory category, String keyword, int limit, int offset);
-
-    /**
-     * 条件に一致する品目の件数を取得
-     */
-    long count(ItemCategory category, String keyword);
-
-    List<Item> findAll();
-
-    List<Item> findByCategory(ItemCategory category);
-
-    List<Item> searchByKeyword(String keyword);
-
-    Optional<Item> findByItemCode(String itemCode);
-
-    void save(Item item);
-
-    void update(Item item);
-
-    void deleteByItemCode(String itemCode);
-}
-```
-
-</details>
-
-<details>
-<summary>ItemMapper.xml（MyBatis XML マッピング - PostgreSQL/H2 対応）</summary>
-
-```xml
-<!-- ページネーション対応クエリ -->
-<select id="findWithPagination" resultMap="itemResultMap" databaseId="postgresql">
-    SELECT
-        id, 品目コード, 品目名, 品目区分, 単位コード,
-        適用開始日, 適用終了日, リードタイム, 安全リードタイム,
-        安全在庫, 歩留率, 最小ロットサイズ, ロット増分,
-        最大ロットサイズ, 賞味期限日数, 作成日時, 更新日時
-    FROM 品目マスタ
-    WHERE 1=1
-    <if test="category != null">
-        AND 品目区分 = #{category}::品目区分
-    </if>
-    <if test="keyword != null and keyword != ''">
-        AND (品目コード LIKE '%' || #{keyword} || '%'
-             OR 品目名 LIKE '%' || #{keyword} || '%')
-    </if>
-    ORDER BY 品目コード
-    LIMIT #{limit} OFFSET #{offset}
-</select>
-
-<select id="findWithPagination" resultMap="itemResultMap" databaseId="h2">
-    SELECT
-        id, 品目コード, 品目名, 品目区分, 単位コード,
-        適用開始日, 適用終了日, リードタイム, 安全リードタイム,
-        安全在庫, 歩留率, 最小ロットサイズ, ロット増分,
-        最大ロットサイズ, 賞味期限日数, 作成日時, 更新日時
-    FROM 品目マスタ
-    WHERE 1=1
-    <if test="category != null">
-        AND 品目区分 = #{category}
-    </if>
-    <if test="keyword != null and keyword != ''">
-        AND (品目コード LIKE '%' || #{keyword} || '%'
-             OR 品目名 LIKE '%' || #{keyword} || '%')
-    </if>
-    ORDER BY 品目コード
-    LIMIT #{limit} OFFSET #{offset}
-</select>
-
-<select id="count" resultType="long">
-    SELECT COUNT(*)
-    FROM 品目マスタ
-    WHERE 1=1
-    <if test="category != null">
-        <choose>
-            <when test="_databaseId == 'postgresql'">
-                AND 品目区分 = #{category}::品目区分
-            </when>
-            <otherwise>
-                AND 品目区分 = #{category}
-            </otherwise>
-        </choose>
-    </if>
-    <if test="keyword != null and keyword != ''">
-        AND (品目コード LIKE '%' || #{keyword} || '%'
-             OR 品目名 LIKE '%' || #{keyword} || '%')
-    </if>
-</select>
-```
-
-</details>
-
-<details>
-<summary>ItemRepositoryImpl.java（Repository 実装）</summary>
-
-```java
-package com.example.pms.infrastructure.out.persistence;
-
-import com.example.pms.application.port.out.ItemRepository;
-import com.example.pms.domain.model.item.Item;
-import com.example.pms.domain.model.item.ItemCategory;
-import org.springframework.stereotype.Repository;
-
-import java.util.List;
-import java.util.Optional;
-
-@Repository
-public class ItemRepositoryImpl implements ItemRepository {
-
-    private final ItemMapper itemMapper;
-
-    public ItemRepositoryImpl(ItemMapper itemMapper) {
-        this.itemMapper = itemMapper;
-    }
-
-    @Override
-    public List<Item> findWithPagination(ItemCategory category, String keyword, int limit, int offset) {
-        return itemMapper.findWithPagination(category, keyword, limit, offset);
-    }
-
-    @Override
-    public long count(ItemCategory category, String keyword) {
-        return itemMapper.count(category, keyword);
-    }
-
-    // ... その他のメソッド
-}
-```
-
-</details>
-
----
-
-### 37.4 Controller 層の実装
-
-<details>
-<summary>ItemWebController.java（ページネーション対応）</summary>
-
-```java
-package com.example.pms.infrastructure.in.web;
-
-import com.example.pms.application.port.in.ItemUseCase;
-import com.example.pms.domain.model.common.PageResult;
-import com.example.pms.domain.model.item.Item;
-import com.example.pms.domain.model.item.ItemCategory;
-import org.springframework.stereotype.Controller;
-import org.springframework.ui.Model;
-import org.springframework.web.bind.annotation.GetMapping;
-import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RequestParam;
-
-/**
- * 品目マスタ画面 Controller（モノリス版）.
- */
-@Controller
-@RequestMapping("/items")
-public class ItemWebController {
-
-    private static final int DEFAULT_PAGE_SIZE = 20;
-    private static final int MAX_PAGE_SIZE = 100;
-
-    private final ItemUseCase itemUseCase;
-
-    public ItemWebController(ItemUseCase itemUseCase) {
-        this.itemUseCase = itemUseCase;
-    }
-
-    /**
-     * 品目一覧画面.
-     */
-    @GetMapping
-    public String list(
-            @RequestParam(defaultValue = "0") int page,
-            @RequestParam(defaultValue = "20") int size,
-            @RequestParam(required = false) ItemCategory category,
-            @RequestParam(required = false) String keyword,
-            Model model) {
-
-        // ページサイズの上限を設定
-        int pageSize = Math.min(size, MAX_PAGE_SIZE);
-        if (pageSize <= 0) {
-            pageSize = DEFAULT_PAGE_SIZE;
-        }
-
-        PageResult<Item> pageResult = itemUseCase.getItems(page, pageSize, category, keyword);
-
-        model.addAttribute("items", pageResult.getContent());
-        model.addAttribute("page", pageResult);
-        model.addAttribute("currentSize", pageSize);
-        model.addAttribute("categories", ItemCategory.values());
-        model.addAttribute("selectedCategory", category);
-        model.addAttribute("keyword", keyword);
-
-        return "items/list";
-    }
-}
-```
-
-</details>
-
-<details>
-<summary>ItemService.java（ページネーション対応 UseCase 実装）</summary>
-
-```java
-@Override
-@Transactional(readOnly = true)
-public PageResult<Item> getItems(int page, int size, ItemCategory category, String keyword) {
-    int offset = page * size;
-    List<Item> items = itemRepository.findWithPagination(category, keyword, size, offset);
-    long totalElements = itemRepository.count(category, keyword);
-    return new PageResult<>(items, page, size, totalElements);
-}
-```
-
-</details>
-
----
-
-### 37.5 ページネーション用テンプレート
-
-<details>
-<summary>items/list.html（ページネーション対応）</summary>
-
-```html
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org"
-      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-      layout:decorate="~{layout/default}"
-      lang="ja">
-<head>
-    <title>品目一覧</title>
-</head>
-<body>
-    <div layout:fragment="content">
-        <div class="d-flex justify-content-between align-items-center mb-4">
-            <h1>品目一覧</h1>
-            <a th:href="@{/items/new}" class="btn btn-primary">
-                <i class="bi bi-plus-lg"></i> 新規登録
-            </a>
-        </div>
-
-        <!-- 検索フォーム -->
-        <div class="card mb-4">
-            <div class="card-body">
-                <form th:action="@{/items}" method="get" class="row g-3">
-                    <div class="col-md-3">
-                        <label for="category" class="form-label">品目区分</label>
-                        <select id="category" name="category" class="form-select">
-                            <option value="">すべて</option>
-                            <option th:each="cat : ${categories}"
-                                    th:value="${cat}"
-                                    th:text="${cat.displayName}"
-                                    th:selected="${cat == selectedCategory}">
-                            </option>
-                        </select>
-                    </div>
-                    <div class="col-md-3">
-                        <label for="keyword" class="form-label">キーワード</label>
-                        <input type="text" id="keyword" name="keyword" class="form-control"
-                               th:value="${keyword}" placeholder="品目コードまたは品名">
-                    </div>
-                    <div class="col-md-2">
-                        <label for="size" class="form-label">表示件数</label>
-                        <select id="size" name="size" class="form-select">
-                            <option value="10" th:selected="${currentSize == 10}">10件</option>
-                            <option value="20" th:selected="${currentSize == 20}">20件</option>
-                            <option value="50" th:selected="${currentSize == 50}">50件</option>
-                            <option value="100" th:selected="${currentSize == 100}">100件</option>
-                        </select>
-                    </div>
-                    <div class="col-md-4 d-flex align-items-end">
-                        <button type="submit" class="btn btn-secondary me-2">
-                            <i class="bi bi-search"></i> 検索
-                        </button>
-                        <a th:href="@{/items}" class="btn btn-outline-secondary">クリア</a>
-                    </div>
-                </form>
-            </div>
-        </div>
-
-        <!-- 品目一覧テーブル -->
-        <div class="card">
-            <div class="card-body">
-                <div th:if="${#lists.isEmpty(items)}" class="alert alert-info">
-                    品目が登録されていません。
-                </div>
-                <table th:if="${not #lists.isEmpty(items)}" class="table table-striped table-hover">
-                    <thead>
-                        <tr>
-                            <th>品目コード</th>
-                            <th>品名</th>
-                            <th>品目区分</th>
-                            <th>単位</th>
-                            <th>リードタイム</th>
-                            <th>安全在庫</th>
-                            <th>操作</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr th:each="item : ${items}">
-                            <td>
-                                <a th:href="@{/items/{code}(code=${item.itemCode})}"
-                                   th:text="${item.itemCode}"></a>
-                            </td>
-                            <td th:text="${item.itemName}"></td>
-                            <td th:text="${item.itemCategory?.displayName}"></td>
-                            <td th:text="${item.unitCode}"></td>
-                            <td th:text="${item.leadTime}"></td>
-                            <td th:text="${item.safetyStock}"></td>
-                            <td>
-                                <a th:href="@{/items/{code}/edit(code=${item.itemCode})}"
-                                   class="btn btn-sm btn-outline-primary">
-                                    <i class="bi bi-pencil"></i>
-                                </a>
-                                <form th:action="@{/items/{code}/delete(code=${item.itemCode})}"
-                                      method="post" class="d-inline"
-                                      onsubmit="return confirm('この品目を削除してもよろしいですか？');">
-                                    <button type="submit" class="btn btn-sm btn-outline-danger">
-                                        <i class="bi bi-trash"></i>
-                                    </button>
-                                </form>
-                            </td>
-                        </tr>
-                    </tbody>
-                </table>
-
-                <!-- ページネーション -->
-                <div class="mt-3" th:if="${page != null}">
-                    <div class="text-muted text-center mb-2">
-                        <span th:if="${page.totalElements > 0}">
-                            <span th:text="${page.page * page.size + 1}">1</span> -
-                            <span th:text="${page.page * page.size + #lists.size(items)}">10</span> 件
-                            （全 <span th:text="${page.totalElements}">0</span> 件）
-                        </span>
-                        <span th:if="${page.totalElements == 0}">0 件</span>
-                    </div>
-
-                    <nav th:if="${page.totalPages > 1}" aria-label="ページナビゲーション">
-                        <ul class="pagination justify-content-center mb-0">
-                            <!-- 最初のページへ -->
-                            <li class="page-item" th:classappend="${page.first} ? 'disabled'">
-                                <a class="page-link" th:href="@{/items(page=0, size=${currentSize}, category=${selectedCategory}, keyword=${keyword})}">&laquo;</a>
-                            </li>
-                            <!-- 前のページへ -->
-                            <li class="page-item" th:classappend="${!page.hasPrevious()} ? 'disabled'">
-                                <a class="page-link" th:href="@{/items(page=${page.page - 1}, size=${currentSize}, category=${selectedCategory}, keyword=${keyword})}">&lsaquo;</a>
-                            </li>
-
-                            <!-- ページ番号 -->
-                            <th:block th:with="startPage=${page.page > 2 ? page.page - 2 : 0},
-                                               endPage=${page.page + 2 < page.totalPages - 1 ? page.page + 2 : page.totalPages - 1}">
-                                <li class="page-item" th:if="${startPage > 0}">
-                                    <span class="page-link">...</span>
-                                </li>
-                                <li th:each="i : ${#numbers.sequence(startPage, endPage)}"
-                                    class="page-item"
-                                    th:classappend="${i == page.page} ? 'active'">
-                                    <a class="page-link"
-                                       th:href="@{/items(page=${i}, size=${currentSize}, category=${selectedCategory}, keyword=${keyword})}"
-                                       th:text="${i + 1}">1</a>
-                                </li>
-                                <li class="page-item" th:if="${endPage < page.totalPages - 1}">
-                                    <span class="page-link">...</span>
-                                </li>
-                            </th:block>
-
-                            <!-- 次のページへ -->
-                            <li class="page-item" th:classappend="${!page.hasNext()} ? 'disabled'">
-                                <a class="page-link" th:href="@{/items(page=${page.page + 1}, size=${currentSize}, category=${selectedCategory}, keyword=${keyword})}">&rsaquo;</a>
-                            </li>
-                            <!-- 最後のページへ -->
-                            <li class="page-item" th:classappend="${page.last} ? 'disabled'">
-                                <a class="page-link" th:href="@{/items(page=${page.totalPages - 1}, size=${currentSize}, category=${selectedCategory}, keyword=${keyword})}">&raquo;</a>
-                            </li>
-                        </ul>
-                    </nav>
-                </div>
-            </div>
-        </div>
-    </div>
-</body>
-</html>
-```
-
-</details>
-
----
-
-### 37.6 ページネーションコンポーネントの共通化
-
-複数の画面で同じページネーションを使用するため、フラグメントとして共通化します。
-
-<details>
-<summary>fragments/pagination.html（共通ページネーションコンポーネント）</summary>
-
-```html
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<!-- ページネーションコンポーネント -->
-<nav th:fragment="pagination(page, currentSize, baseUrl, params)" th:if="${page.totalPages > 1}" class="mt-4">
-    <ul class="pagination justify-content-center">
-        <!-- 最初へ -->
-        <li class="page-item" th:classappend="${page.first} ? 'disabled'">
-            <a class="page-link"
-               th:href="${baseUrl + '?page=0&size=' + currentSize + (params != null ? '&' + params : '')}"
-               th:if="${!page.first}">&laquo;</a>
-            <span class="page-link" th:if="${page.first}">&laquo;</span>
-        </li>
-
-        <!-- 前へ -->
-        <li class="page-item" th:classappend="${!page.hasPrevious()} ? 'disabled'">
-            <a class="page-link"
-               th:href="${baseUrl + '?page=' + (page.page - 1) + '&size=' + currentSize + (params != null ? '&' + params : '')}"
-               th:if="${page.hasPrevious()}">&lsaquo;</a>
-            <span class="page-link" th:if="${!page.hasPrevious()}">&lsaquo;</span>
-        </li>
-
-        <!-- ページ番号（前後2ページ表示） -->
-        <th:block th:with="startPage=${page.page > 2 ? page.page - 2 : 0},
-                           endPage=${page.page + 2 < page.totalPages - 1 ? page.page + 2 : page.totalPages - 1}">
-            <li class="page-item" th:if="${startPage > 0}">
-                <span class="page-link">...</span>
-            </li>
-            <li th:each="i : ${#numbers.sequence(startPage, endPage)}"
-                class="page-item"
-                th:classappend="${i == page.page} ? 'active'">
-                <a class="page-link"
-                   th:href="${baseUrl + '?page=' + i + '&size=' + currentSize + (params != null ? '&' + params : '')}"
-                   th:text="${i + 1}"></a>
-            </li>
-            <li class="page-item" th:if="${endPage < page.totalPages - 1}">
-                <span class="page-link">...</span>
-            </li>
-        </th:block>
-
-        <!-- 次へ -->
-        <li class="page-item" th:classappend="${!page.hasNext()} ? 'disabled'">
-            <a class="page-link"
-               th:href="${baseUrl + '?page=' + (page.page + 1) + '&size=' + currentSize + (params != null ? '&' + params : '')}"
-               th:if="${page.hasNext()}">&rsaquo;</a>
-            <span class="page-link" th:if="${!page.hasNext()}">&rsaquo;</span>
-        </li>
-
-        <!-- 最後へ -->
-        <li class="page-item" th:classappend="${page.last} ? 'disabled'">
-            <a class="page-link"
-               th:href="${baseUrl + '?page=' + (page.totalPages - 1) + '&size=' + currentSize + (params != null ? '&' + params : '')}"
-               th:if="${!page.last}">&raquo;</a>
-            <span class="page-link" th:if="${page.last}">&raquo;</span>
-        </li>
-    </ul>
-
-    <!-- ページ情報 -->
-    <div class="text-center text-muted small">
-        <span th:text="${page.page + 1}"></span> /
-        <span th:text="${page.totalPages}"></span> ページ
-        （全 <span th:text="${page.totalElements}"></span> 件）
-    </div>
-</nav>
-
-</html>
-```
-
-</details>
-
-<details>
-<summary>使用例</summary>
-
-```html
-<!-- 品目一覧での使用例 -->
-<th:block th:replace="~{fragments/pagination :: pagination(
-    ${page},
-    ${currentSize},
-    '/items',
-    'category=' + ${selectedCategory} + '&keyword=' + ${keyword}
-)}"></th:block>
-
-<!-- 発注一覧での使用例 -->
-<th:block th:replace="~{fragments/pagination :: pagination(
-    ${page},
-    ${currentSize},
-    '/purchase-orders',
-    'status=' + ${status}
-)}"></th:block>
-```
-
-</details>
-
----
-
-### 37.7 htmx によるページネーションの部分更新
-
-ページ遷移時に画面全体をリロードせず、テーブル部分のみを更新します。
-
-<details>
-<summary>htmx 対応ページネーション</summary>
-
-```html
-<!-- ページネーションを htmx で部分更新 -->
-<div id="items-container">
-    <!-- テーブルとページネーションを含むコンテナ -->
-    <th:block th:replace="~{items/fragments :: itemsTable}"></th:block>
-</div>
-
-<!-- items/fragments.html -->
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<div th:fragment="itemsTable">
-    <!-- 件数表示 -->
-    <div class="d-flex justify-content-between align-items-center mb-3">
-        <div class="text-muted">
-            全 <span th:text="${page.totalElements}">0</span> 件中
-            <span th:text="${page.page * page.size + 1}">1</span> -
-            <span th:text="${page.page * page.size + #lists.size(items)}">20</span> 件を表示
-        </div>
-    </div>
-
-    <!-- テーブル -->
-    <table class="table table-striped table-hover">
-        <!-- ... テーブル内容 ... -->
-    </table>
-
-    <!-- ページネーション（htmx対応） -->
-    <nav th:if="${page.totalPages > 1}" class="mt-4">
-        <ul class="pagination justify-content-center">
-            <th:block th:with="startPage=${page.page > 2 ? page.page - 2 : 0},
-                               endPage=${page.page + 2 < page.totalPages - 1 ? page.page + 2 : page.totalPages - 1}">
-                <li th:each="i : ${#numbers.sequence(startPage, endPage)}"
-                    class="page-item"
-                    th:classappend="${i == page.page} ? 'active'">
-                    <a class="page-link"
-                       th:href="@{/items(page=${i}, size=${currentSize})}"
-                       hx-get="/items/table"
-                       th:attr="hx-get=@{/items/table(page=${i}, size=${currentSize})}"
-                       hx-target="#items-container"
-                       hx-swap="innerHTML"
-                       hx-push-url="true"
-                       th:text="${i + 1}"></a>
-                </li>
-            </th:block>
-        </ul>
-    </nav>
-</div>
-
-</html>
-```
-
-</details>
-
-<details>
-<summary>Controller（htmx 対応）</summary>
-
-```java
-@Controller
-@RequestMapping("/items")
-public class ItemWebController {
-
-    /**
-     * テーブル部分のみを返す（htmx用）
-     */
-    @GetMapping("/table")
-    public String table(
-            @RequestParam(defaultValue = "0") int page,
-            @RequestParam(defaultValue = "20") int size,
-            @RequestParam(required = false) ItemCategory category,
-            @RequestParam(required = false) String keyword,
-            Model model) {
-
-        int pageSize = Math.min(size, MAX_PAGE_SIZE);
-        PageResult<Item> pageResult = itemUseCase.getItems(page, pageSize, category, keyword);
-
-        model.addAttribute("items", pageResult.getContent());
-        model.addAttribute("page", pageResult);
-        model.addAttribute("currentSize", pageSize);
-
-        // フラグメントのみを返す
-        return "items/fragments :: itemsTable";
-    }
-}
-```
-
-</details>
-
----
-
-## まとめ
-
-本研究では、モノリスアーキテクチャによる生産管理システムを実装しました。
-
-### API サーバー版との比較
-
-| 観点 | API サーバー版（第32章） | モノリス版（本研究） |
-|------|------------------------|----------------------|
-| **アーキテクチャ** | フロントエンド分離（SPA） | 統合（Thymeleaf） |
-| **通信** | REST API（JSON） | サーバーサイドレンダリング（HTML） |
-| **状態管理** | クライアント側（localStorage等） | サーバー側（セッション） |
-| **部分更新** | JavaScript（Axios等） | htmx |
-| **帳票出力** | API経由でダウンロード | 直接ダウンロード |
-| **認証** | JWT/OAuth | セッションベース |
-| **複雑さ** | 高（API設計、CORS等） | 低（シンプル） |
-| **開発速度** | 初期は遅い | 初期は速い |
-
-### 実装した機能
-
-| カテゴリ | 機能 |
-|---------|------|
-| **品目マスタ** | 一覧、詳細、登録、編集、削除、検索 |
-| **BOM** | 階層表示（ツリー）、逆展開 |
-| **発注** | 一覧、登録（動的明細）、確定、取消 |
-| **在庫** | 照会、不足品目表示 |
-| **MRP** | 実行、結果表示 |
-| **帳票** | Excel 出力 |
-| **ページネーション** | ページ分割、ソート、件数表示、htmx 対応 |
-| **共通** | レイアウト、エラーハンドリング、フラッシュメッセージ |
-
-### 技術スタック
-
-- **Spring Boot 3.2**: Web フレームワーク
-- **Thymeleaf**: テンプレートエンジン
-- **htmx**: 部分更新（JavaScript 不要）
-- **Bootstrap 5**: CSS フレームワーク
-- **Apache POI**: Excel 出力
-- **MyBatis**: O/R マッピング
-- **Testcontainers**: 統合テスト
-
-### モノリスを選択すべき場面
-
-1. **社内システム**: 限られたユーザー、SEO 不要
-2. **業務アプリケーション**: 複雑な業務フロー
-3. **小規模チーム**: フルスタック開発
-4. **迅速な開発**: MVP、プロトタイプ
-5. **運用コスト重視**: シンプルなインフラ
-
----
-
-[目次へ戻る](../index.md)