ページの作成
親となるページを選択してください。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球
子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール
親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
| この記事の要点 |
|---|
|
MVC とは
MVC (Model-View-Controller) は Web アプリケーションを 3 つの責務に分けて設計する古典的なパターンです。
| 層 | 役割 | 例 |
|---|---|---|
| Model | データとビジネスロジック | DB 接続、エンティティ、サービスクラス |
| View | 表示(プレゼンテーション) | HTML テンプレート、JSP、Blade、Twig |
| Controller | リクエスト処理と View 選択 | URL ハンドラ、@Controller クラス |
MVC のフロー
- ユーザがブラウザでリクエスト送信
- Controller がリクエストを受信
- Controller が Model を呼び出してデータ取得
- Controller が View にデータを渡す
- View が HTML を生成してレスポンス
主要フレームワーク別の実装
Spring MVC (Java)
// Controller
@Controller
@RequestMapping("/users")
public class UserController {
@Autowired
private UserService userService; // ← Model 層
@GetMapping("/{id}")
public String show(@PathVariable Long id, Model model) {
User user = userService.findById(id); // Model 呼び出し
model.addAttribute("user", user);
return "users/show"; // ← View 名(Thymeleaf テンプレート)
}
}
// Model (Entity + Service)
@Entity
public class User {
@Id private Long id;
private String name;
}
@Service
public class UserService {
@Autowired private UserRepository userRepository;
public User findById(Long id) {
return userRepository.findById(id).orElseThrow();
}
}
名前
メール
Laravel (PHP)
// Controller: app/Http/Controllers/UserController.php
class UserController extends Controller {
public function show($id) {
$user = User::findOrFail($id); // Model (Eloquent)
return view("users.show", compact("user")); // View 呼び出し
}
}
// Model: app/Models/User.php
class User extends Model {
protected $fillable = ["name", "email"];
}
{{ $user->name }}
{{ $user->email }}
Rails (Ruby)
# Controller: app/controllers/users_controller.rb
class UsersController < ApplicationController
def show
@user = User.find(params[:id]) # Model
# 自動的に app/views/users/show.html.erb をレンダリング
end
end
# Model: app/models/user.rb
class User < ApplicationRecord
end
<%= @user.name %>
<%= @user.email %>
MVT とは (Django)
Django は MVC のうち「View」と「Controller」の役割が逆転した独自命名を採用しています。
| 標準 MVC | Django (MVT) | 説明 |
|---|---|---|
| Model | Model | 同じ |
| View (HTML) | Template | HTML テンプレート |
| Controller | View | リクエスト処理(紛らわしい) |
Django (Python) の例
# urls.py
from django.urls import path
from . import views
urlpatterns = [
path("users//", views.user_detail, name="user_detail"),
]
# views.py (役割は MVC の Controller)
from django.shortcuts import render, get_object_or_404
from .models import User
def user_detail(request, id):
user = get_object_or_404(User, pk=id) # Model 呼び出し
return render(request, "users/detail.html", {"user": user}) # Template
# models.py (Model)
from django.db import models
class User(models.Model):
name = models.CharField(max_length=100)
email = models.EmailField()
{% extends "base.html" %}
{% block content %}
{{ user.name }}
{{ user.email }}
{% endblock %}
MVC のメリット
- 責務分離: 各層が独立してテスト可能
- 並行開発: フロント (View) とバック (Controller/Model) を別チームで開発可能
- 保守性: View 変更がロジックに影響しない
- 再利用: 同じ Model を複数 View で使い回せる
- テスト容易: Model / Controller を独立して単体テスト可能
MVC の限界とモダンアーキテクチャ
純粋 MVC では Controller がビジネスロジックを抱え込む「Fat Controller」問題が起きがち。モダンな対策:
- Service 層追加: Controller → Service → Model の 4 層
- Repository 層: DB アクセスを抽象化(Model から分離)
- DTO: Controller ↔ View 間のデータ転送オブジェクト
- Form Request / DTO 検証: バリデーション層の分離
モダンな層構成例 (Spring Boot)
- Controller: HTTP 受付、リクエスト → DTO 変換
- Service: ビジネスロジック、トランザクション境界
- Repository: DB アクセス (JPA / MyBatis)
- Entity: DB マッピング
- DTO: API レスポンス / リクエスト型
SPA + API での MVC
React/Vue + REST API の構成では、View が完全にフロント側に移動:
- サーバ側: Model + Controller (Service 含む)。REST API で JSON 返却
- クライアント側: View (React/Vue コンポーネント) + 状態管理
関連記事
ページの作成
親となるページを選択してください。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球
子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール
親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
同階層のページ
- 環境構築とプロジェクト/アプリの作成
- MVC(MVT)のそれぞれの使い方と説明
- データベースへの接続と操作
- Django Administration
- git管理
- エラー一覧
- バージョンの確認方法
- ログ出力方法
- SQLのログ出力方法
- ログのローテート設定
- settings.pyの定数にアクセスする方法
- 本番環境へのインストールとアプリのデプロイ(apache編)
- 本番環境へのインストールとアプリのデプロイ(nginx編)
- djangoアプリの本番の開始URLを変更する
- 静的(static)ファイルの置き場所と読み込み(画像、css、js )
- CSRFトークンをAjaxで使用する方法
- ajaxの使用例(POST編)
- ファイルのアップロードとファイルの名前
- クイックスタート/チュートリアル
- ログイン機能
- テンプレート側のログイン判定
- ビュー側のログイン判定
- 管理者ユーザーの作成/判定と管理画面
- モデルのjson化とレスポンス
- runserverでポートを指定する方法
- cronによるバッチ実行
- テンプレートで利用する共通のcontextを定義する方法
- プログラムが本番サーバーで反映されない場合の対処法
- APIの作成
- cron用コマンド・ファイルの作成
人気ページ
- 1 Eclipseで「サーバーに追加または除去できるリソースがありません。」の原因と対処法
- 2 tomcat の起動 / 停止ログと catalina.log・catalina.out の違い
- 3 JavaScript base URL 取得方法|window.location.origin と SSR/Node.js 対応
- 4 YouTube Data API v3 エラー一覧|403/400/404 の主要原因と切り分け
- 5 Spring Frameworkのアノテーション一覧
- 6 Laravel エラー一覧|500/Blade/DB 接続/ルーティングの代表エラー
- 7 3Dグラフィックスとは|モデリング/レンダリング/主要ソフトウェア (Blender / Maya)
- 8 【Spring】@Valueアノテーションとは
- 9 CATALINA_HOME の確認方法 (Linux / Mac)
- 10 【Spring】@Autowiredアノテーションとは
最近更新/作成されたページ
- Struts1 の ActionForm とは? validate() / reset() / DynaActionForm の使い分け 2026-05-16 17:19:31
- PC の最大メモリ容量を確認する方法(Windows wmic / PowerShell, Linux dmidecode / lshw) 2026-05-16 17:19:31
- Eclipse で Tomcat を起動するボタンを出す手順(Servers ビュー + サーバー登録) 2026-05-16 17:19:31
- Tomcat の AutoDeploy 設定(autoDeploy / unpackWARs / deployOnStartup の意味と本番運用) 2026-05-16 17:19:31
- ポリモーフィズム(多様性)とは何か? Java / C++ コード例と OCP・拡張性の理由 2026-05-16 17:19:31
- <head> の内容が <body> に移動する原因と対処(HTML5 パーサのエラー復旧) 2026-05-16 17:19:31
- Amazon PA-API 5.0 の AWS V4 署名を PHP で生成(SDK 利用 / 自前 hash_hmac 両方) 2026-05-16 17:19:31
- Amazon PA-API 5.0 リクエスト構造(SearchItems / GetItems / GetVariations と Resources 指定) 2026-05-16 17:19:31
- Maven / Ant / Gradle で "Missing target argument" が出る原因と対処(goal / target 指定) 2026-05-16 17:19:31
- Struts1 の ActionMapping とは? <action> 定義・ActionForward・findForward の使い方 2026-05-16 17:19:31
- Apache / Nginx でドキュメントルートを変更する手順(Laravel public/ への切替も) 2026-05-16 17:19:26
- cron / crontab の書き方完全ガイド(書式・@reboot・環境変数・systemd timer 比較) 2026-05-16 17:19:26
- DB トランザクション完全ガイド(SQL BEGIN/COMMIT / Laravel / Spring / 分離レベル / デッドロック) 2026-05-16 17:19:26
- .env の値を取り出す方法(Laravel env / config / Node.js dotenv / PHP phpdotenv) 2026-05-16 17:19:26
- Laravel キャッシュクリア完全ガイド(cache:clear / config:clear / route:clear / view:clear / OPcache) 2026-05-16 17:19:26
コメントを削除してもよろしいでしょうか?