設計に関する用語を全て整理する。       /MVC/MVVM/3層アーキテクチャ/オニオン/クリーン/ヘキサゴナル/...

# きっかけ
MVCとかMVVMとかクリーンアーキテクチャとかそれぞれどの部分の設計思想なのか分かりずらすぎるからまとめたいと思った。

**注意事項**
本記事は筆者が初学者として学んだ内容をまとめたものです。MVC、MVVM、MVPの解釈や各アーキテクチャとの対応関係について、厳密な定義と異なる可能性があります。


# Webアプリケーションの構成
一般的にwebアプリケーションは**webサーバ**, **アプリケーションサーバ**, **DBサーバ**の３つで構成される。

そしてこのサーバの構成を**3層アーキテクチャ**と呼ぶ。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3868342/dc348ec9-0f04-4d62-a163-e20e4cd53578.png)

# アプリケーションサーバの構成
アプリケーションサーバ内部の構成はどんなものがあるのかみていく。
### 3層アーキテクチャ
ややこしいことに、Webアプリケーションの構成と同じく3層アーキテクチャと呼ぶ。混同しないように注意。
![3-layer architecture](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3868342/1634acaf-3685-4ad5-a90f-6b56e702aeb5.png)
システム全体を以下の3層に分ける。

- **プレゼンテーション層（UI層）**  
  ユーザーとのインターフェース（例：Webページ、モバイル画面）
- **アプリケーション層（ビジネスロジック層）**  
  業務処理やビジネスルールを実装
- **データロジック層**  
  データベースやリポジトリなど、データの永続化を担当

各設計パターンとの対応例:

| 設計パターン | 3層アーキテクチャでの対応例 |
|-------------|-----------------------------|
| **MVC**  | `Controller` と `View` → プレゼンテーション層<br>`Model` → アプリケーション層（ビジネスロジック） |
| **MVVM** | `View` と `ViewModel` → プレゼンテーション層<br>`Model` → アプリケーション層（ビジネスロジック） |
| **MVP**  | `View` と `Presenter` → プレゼンテーション層<br>`Model` → アプリケーション層（ビジネスロジック） |


### レイヤードアーキテクチャ
![Layered Architecture](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3868342/306e1f6b-0f4e-4b8b-9559-0e7612106a4a.png)

レイヤードアーキテクチャは、以下の4層でシステムを構成する。

- **プレゼンテーション層（UI層）**  
  ユーザーインターフェースの実装
- **アプリケーション層（サービス層）**  
  ユースケースや業務ロジックの調整
- **ドメイン層（ビジネスルール）**  
  ビジネスの中心となるルールやエンティティ
- **インフラストラクチャ層**  
  データベース、外部API、その他技術的な基盤

各設計パターンとの対応例:

| 設計パターン | レイヤードアーキテクチャでの対応例 |
|-------------|-----------------------------------|
| **MVC**  | `Controller` → プレゼンテーション層<br>`Model` → ドメイン層<br>`View` → プレゼンテーション層 |
| **MVVM** | `ViewModel` → プレゼンテーション層<br>`Model` → ドメイン層<br>`View` → プレゼンテーション層 |
| **MVP**  | `Presenter` → プレゼンテーション層<br>`Model` → ドメイン層<br>`View` → プレゼンテーション層 |



### ヘキサゴナルアーキテクチャ
![Hexagonal Architecture](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3868342/41755d9d-5d85-4539-87fd-68870d7b04d7.png)  
[画像元](https://guildworksblog.wordpress.com/2014/10/31/hexagonal-architecture/)

ヘキサゴナルアーキテクチャは、以下の要素で構成され、システムのコア（ドメイン）と外部との依存関係を明確に分離する。

- **ドメイン層（アプリケーションのコア）**  
  ビジネスルールやエンティティを実装
- **ポート**  
  ドメイン層が外部と通信するためのインターフェースの定義
- **アダプタ**  
  UI、データベース、APIなど、外部システムとの接続部分の実装

各設計パターンとの対応例:

| 設計パターン | ヘキサゴナルアーキテクチャでの対応例 |
|-------------|-------------------------------------|
| **MVC**  | `Model` → ドメイン層<br>`Controller` と `View` → アダプタ層（ポートを介してドメインと連携） |
| **MVVM** | `Model` → ドメイン層<br>`ViewModel` と `View` → アダプタ層 |
| **MVP**  | `Model` → ドメイン層<br>`Presenter` と `View` → アダプタ層 |


### オニオンアーキテクチャ
![Onion Architecture](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3868342/719b4659-b1bf-4c28-a2a5-00cc21eeb7cc.png)  
[画像元](https://little-hands.hatenablog.com/entry/2017/10/11/075634)

オニオンアーキテクチャは、システムの中心にドメイン（コアビジネスロジック）を据え、その周囲にアプリケーション層、インフラ層、プレゼンテーション層を配置して依存関係の逆転を実現する。

- **ドメイン層**  
  システムの中核となるビジネスロジック・エンティティ
- **アプリケーション層**  
  ユースケースの実装や、ドメイン層と外部の橋渡し
- **インフラストラクチャ層**  
  データベース、外部APIなどの技術的基盤
- **プレゼンテーション層**  
  UIやAPIなど、ユーザーとの接点

各設計パターンとの対応例（※Controller/Presenter/ViewModelはアプリケーション層に位置づける場合もあります）:

| 設計パターン | オニオンアーキテクチャでの対応例 |
|-------------|---------------------------------|
| **MVC**  | `Controller` → アプリケーション層<br>`Model` → ドメイン層<br>`View` → プレゼンテーション層 |
| **MVVM** | `ViewModel` → アプリケーション層<br>`Model` → ドメイン層<br>`View` → プレゼンテーション層 |
| **MVP**  | `Presenter` → アプリケーション層<br>`Model` → ドメイン層<br>`View` → プレゼンテーション層 |


### クリーンアーキテクチャ
![Clean Architecture](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3868342/74d3ef3a-7fd3-4255-85c5-5517d759677f.png)  
[画像元](https://blog.tai2.net/the_clean_architecture.html)

クリーンアーキテクチャは、依存関係の逆転原則に基づいてシステムを以下の4層に分割し、内側ほど抽象度が高くビジネスロジックに集中する。

- **エンティティ層**  
  ビジネスルールやエンティティなど、システムの核となる部分
- **ユースケース層**  
  アプリケーション固有のビジネスロジックや処理の流れ
- **インターフェースアダプタ層**  
  Controller、Presenterなど、外部と内部の橋渡しを行う
- **フレームワーク＆ドライバ層**  
  UI、データベース、外部API、Webフレームワークなど、技術的な実装

各設計パターンとの対応例:

| 設計パターン | クリーンアーキテクチャでの対応例 |
|-------------|---------------------------------|
| **MVC**  | `Controller` → インターフェースアダプタ層<br>`Model` はエンティティ層とユースケース層にまたがる<br>`View` → フレームワーク＆ドライバ層 |
| **MVVM** | `ViewModel` → インターフェースアダプタ層<br>`Model` はエンティティ層とユースケース層にまたがる<br>`View` → フレームワーク＆ドライバ層 |
| **MVP**  | `Presenter` → インターフェースアダプタ層<br>`Model` はエンティティ層とユースケース層にまたがる<br>`View` → フレームワーク＆ドライバ層 |

クリーンアーキテクチャをより詳しく

https://qiita.com/nrslib/items/a5f902c4defc83bd46b8


# 参考資料
https://qiita.com/os1ma/items/7a229585ebdd8b7d86c2#%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%E6%A7%8B%E6%88%90

https://qiita.com/shunta01/items/ed46b904071841957f8a