2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

@ktdatascience

【Web開発】MVCモデルをサクッと5分で理解する

Posted at

はじめに

Webアプリケーションを開発する際、コードをどのように整理すれば良いのか悩んだことはありませんか？

この記事では、Webアプリケーション開発で広く使われているMVCモデルについて解説します。MVCモデルを理解することで、保守性が高く、チーム開発にも適したアーキテクチャを設計できるようになります。

対象読者

  • Webアプリケーション開発の基礎を学んでいる方
  • アーキテクチャ設計の考え方を知りたい方
  • コードの整理方法に悩んでいる方

MVCモデルとは

MVCモデルは、アプリケーションを3つの要素に分割する設計パターンです。Model（モデル）、View（ビュー）、Controller（コントローラー）の頭文字を取ってMVCと呼ばれています。

なぜMVCが生まれたのか

アプリケーションのコードを1つのファイルや場所にまとめてしまうと、以下のような問題が発生します。

  • コードが長くなり、どこに何が書いてあるか分からなくなる
  • 一部の修正が他の部分に予期しない影響を与える
  • 複数人で開発する際に、同じファイルを編集して衝突が起きる

MVCモデルは、これらの問題を解決するために「関心の分離」という考え方を採用しています。それぞれの要素に明確な役割を持たせることで、コードの見通しを良くし、保守性を高めます。

MVCの3つの要素

MVCモデルを構成する3つの要素について、それぞれの役割と責務を見ていきましょう。

Model（モデル）

役割: アプリケーションのデータとビジネスロジックを管理する

Modelは、アプリケーションが扱うデータの構造や、データに対する操作を定義します。データベースとのやり取りや、データの検証、計算処理などを担当します。

具体例

ブログアプリケーションの場合、以下のような責務を持ちます。

  • 記事データの取得、保存、更新、削除
  • 記事の公開/非公開の判定
  • 記事の文字数カウント
  • ユーザー認証情報の管理

重要なポイント: ModelはViewやControllerの存在を知りません。純粋にデータとビジネスロジックのみに関心を持ちます。

View（ビュー）

役割: ユーザーに情報を表示する

Viewは、Modelから受け取ったデータをユーザーが見やすい形式で表示します。HTMLテンプレート、JSON、XMLなど、様々な形式での出力を担当します。

具体例

ブログアプリケーションの場合、以下のような責務を持ちます。

  • 記事一覧ページのHTML生成
  • 記事詳細ページのHTML生成
  • エラーメッセージの表示
  • API用のJSONレスポンス生成

重要なポイント: Viewはデータの表示のみに専念し、ビジネスロジックを含めません。データベースへの直接的なアクセスも行いません。

Controller（コントローラー）

役割: ユーザーからのリクエストを受け取り、ModelとViewを連携させる

Controllerは、ユーザーの操作を受け取り、適切なModelを呼び出してデータを取得・更新し、結果をViewに渡す役割を担います。いわば、ModelとViewの橋渡し役です。

具体例

ブログアプリケーションの場合、以下のような責務を持ちます。

  • 記事一覧表示のリクエストを受け取り、Modelから記事データを取得してViewに渡す
  • 記事投稿フォームからのデータを受け取り、Modelに保存を指示する
  • ユーザー認証の確認を行い、権限に応じた処理を振り分ける

重要なポイント: Controllerは処理の流れを制御しますが、複雑なビジネスロジックはModelに委譲します。

MVCの動作の流れ

ユーザーがWebアプリケーションにアクセスしてから、画面が表示されるまでの流れを見てみましょう。

処理の流れの詳細

  1. ユーザーがリクエストを送信: ブラウザからURLにアクセスしたり、フォームを送信したりする
  2. Controllerがリクエストを受け取る: URLやHTTPメソッドに応じて、適切なControllerの処理が実行される
  3. ControllerがModelを呼び出す: 必要なデータを取得・更新するためにModelのメソッドを呼び出す
  4. Modelがデータを処理: データベースへのアクセスやビジネスロジックの実行を行う
  5. ControllerがViewにデータを渡す: Modelから取得したデータをViewに渡す
  6. Viewが画面を生成: 受け取ったデータを使ってHTML等を生成する
  7. ユーザーにレスポンスを返す: 生成された画面がブラウザに表示される

MVCモデルの利点

MVCモデルを採用することで、以下のような利点が得られます。

関心の分離

それぞれの要素が明確な責務を持つため、コードの見通しが良くなります。「データ処理はModel」「画面表示はView」「制御はController」と考えることで、どこに何を書けば良いかが明確になります。

保守性の向上

変更の影響範囲が限定されるため、機能追加や修正が容易になります。

  • デザインを変更したい → Viewだけを修正すれば良い
  • ビジネスルールを変更したい → Modelだけを修正すれば良い
  • 処理の流れを変更したい → Controllerを修正すれば良い

チーム開発での効果

役割が分かれているため、複数人での並行開発がしやすくなります。

  • デザイナーはViewに集中できる
  • バックエンドエンジニアはModelに集中できる
  • 全体の流れを管理する人はControllerに集中できる

テストのしやすさ

各要素が独立しているため、単体テストが書きやすくなります。Modelのビジネスロジックだけを切り出してテストすることも、Controllerの処理フローだけをテストすることも可能です。

実際のアーキテクチャ設計

MVCモデルを実際のプロジェクトに適用する際の考え方を見ていきましょう。

ディレクトリ構成の例

一般的なMVCアプリケーションのディレクトリ構成は以下のようになります。

project/
├── app/
│   ├── controllers/
│   │   ├── ArticleController.php
│   │   └── UserController.php
│   ├── models/
│   │   ├── Article.php
│   │   └── User.php
│   └── views/
│       ├── articles/
│       │   ├── index.html
│       │   └── show.html
│       └── users/
│           └── profile.html
├── config/
│   └── database.php
└── public/
    └── index.php

ファイルの責務分担

Controller層

  • リクエストパラメータの受け取り
  • バリデーションの実行（基本的なもの）
  • Modelの呼び出し
  • Viewへのデータ渡し
  • リダイレクトやエラーハンドリング

Model層

  • データベースアクセス
  • データの検証（ビジネスルール）
  • 計算処理
  • 外部APIとの連携
  • トランザクション管理

View層

  • HTMLの生成
  • データの整形表示
  • フォームの生成
  • エラーメッセージの表示

設計時の判断基準

どこに何を書くべきか迷った時は、以下の質問を自分に投げかけてみましょう。

「このコードは、表示形式が変わったら修正が必要か？」
→ Yes なら View、No なら Model か Controller

「このコードは、ビジネスルールが変わったら修正が必要か？」
→ Yes なら Model、No なら Controller か View

「このコードは、処理の流れが変わったら修正が必要か？」
→ Yes なら Controller、No なら Model か View

MVCモデルの注意点

MVCモデルを使う際に、よく陥りがちな問題とその対策を紹介します。

よくある間違い

Viewに直接データベースアクセスを書く

<!-- 悪い例 -->
<?php
$db = new Database();
$articles = $db->query("SELECT * FROM articles");
foreach ($articles as $article) {
    echo $article['title'];
}
?>

Viewはデータを表示するだけで、データの取得はModelに任せましょう。

Controllerにビジネスロジックを書く

// 悪い例
public function createArticle($title, $content) {
    // 文字数チェックやビジネスルールをControllerに書いてしまう
    if (strlen($title) < 5 || strlen($title) > 100) {
        return false;
    }
    // ...
}

ビジネスルールはModelに移動させ、Controllerはその結果を受け取るだけにしましょう。

Fat Controller（太ったコントローラー）の問題

Controllerにあらゆる処理を詰め込んでしまうと、数百行に及ぶ巨大なControllerが生まれます。これを「Fat Controller」と呼びます。

対策

  • 複雑なビジネスロジックはModelに移動
  • 共通処理はサービスクラスやヘルパーに分離
  • 1つのControllerメソッドは20〜30行程度を目安にする

Modelの肥大化

逆に、すべてのロジックをModelに詰め込むと、今度はModelが巨大化します。1つのModelファイルが1000行を超えるようなケースです。

対策

  • 関連する機能ごとにModelを分割
  • データアクセス層とビジネスロジック層を分離
  • リポジトリパターンやサービス層の導入を検討

まとめ

MVCモデルは、Webアプリケーション開発における基本的な設計パターンです。

  • Model: データとビジネスロジックを管理
  • View: ユーザーへの表示を担当
  • Controller: リクエストを受け取り、ModelとViewを連携

MVCモデルを理解し、適切に適用することで、保守性が高く、チーム開発にも適したアプリケーションを構築できます。

最初は各要素の役割分担に悩むこともありますが、実際にコードを書きながら経験を積むことで、自然と適切な設計ができるようになります。まずは小さなプロジェクトから、MVCモデルを意識した設計を試してみましょう。

2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?