Djangoテンプレート継承の基礎｜base.htmlを作るベストプラクティスを初心者向けに完全解説
生徒
「Djangoのテンプレートって、毎回同じHTMLを書かないといけないんですか？」
先生
「いいえ、Djangoにはテンプレート継承という仕組みがあって、共通部分を一つにまとめられます。」
生徒
「それって、ヘッダーやメニューを毎回書かなくていいってことですか？」
先生
「その通りです。base.htmlを作ることで、Webサイト全体をとても管理しやすくできます。」
1. Djangoテンプレート継承とは何か
Djangoテンプレート継承とは、HTMLファイル同士を親子関係のようにつなげて使う仕組みです。Webサイトでは、どのページにも共通して表示される部分があります。例えば、画面の一番上にあるタイトルやナビゲーションメニュー、下にあるフッターなどです。
テンプレート継承を使わない場合、これらをすべてのHTMLファイルに毎回書く必要があります。これはとても大変で、修正があったときにミスが起きやすくなります。テンプレート継承を使うことで、共通部分を一か所にまとめ、必要な部分だけを書けばよくなります。
2. base.htmlの役割と考え方
base.htmlは、テンプレート継承の「親」になるHTMLファイルです。家で例えると、家の設計図のような存在です。どの部屋にも共通する柱や壁があり、その中に部屋ごとの家具を配置するイメージです。
Djangoでは、このbase.htmlにサイト全体の共通レイアウトを書き、各ページはその内容を引き継いで使います。これにより、デザインの統一感が生まれ、管理も簡単になります。
3. base.htmlの基本的な書き方
base.htmlでは、blockという特別なタグを使います。blockは「子テンプレートが内容を差し込める場所」を意味します。ここでは、最も基本的なbase.htmlの例を見てみましょう。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>{% block title %}サイトタイトル{% endblock %}</title>
</head>
<body>
<header>
<h1>共通ヘッダー</h1>
</header>
<main>
{% block content %}
{% endblock %}
</main>
<footer>
<p>共通フッター</p>
</footer>
</body>
</html>
このように、blockで囲まれた部分が、子テンプレートで自由に書き換えられる場所になります。
4. 子テンプレートでbase.htmlを使う方法
次に、base.htmlを使って実際のページを作る方法です。子テンプレートでは、extendsという命令を使います。これは「このHTMLはbase.htmlを元にしています」という意味です。
{% extends "base.html" %}
{% block title %}
トップページ
{% endblock %}
{% block content %}
<p>ここにページごとの内容を書きます。</p>
{% endblock %}
このように書くことで、base.htmlのレイアウトをそのまま使いながら、必要な部分だけを変更できます。
5. blockを使うときのベストプラクティス
blockの名前は、誰が見ても分かるように付けることが大切です。例えば、content、title、header、footerなど、役割が想像できる名前にします。
また、base.htmlには必要以上にblockを増やしすぎないこともポイントです。初心者のうちは、「title」と「content」だけでも十分です。慣れてきたら、必要に応じて追加していくと混乱しにくくなります。
6. Djangoテンプレート継承でよくある失敗
初心者がよくつまずくポイントとして、extendsを一番上に書かないというミスがあります。extendsは必ずテンプレートの最初に書く必要があります。これを守らないと、正しく表示されません。
また、blockの名前をbase.htmlと子テンプレートで一致させることも重要です。名前が違うと、内容が反映されないので注意しましょう。
7. base.htmlを使うメリットまとめ
base.htmlを使ったテンプレート継承には、多くのメリットがあります。HTMLを何度も書かなくてよくなり、修正も一か所で済みます。Webサイト全体のデザインが統一され、見た目も整います。
Djangoテンプレート継承は、Webアプリ開発を楽にし、ミスを減らしてくれるとても大切な機能です。初心者のうちからbase.htmlを正しく使う習慣を身につけることで、後々の開発がぐっと楽になります。
Djangoエンタープライズ開発の真髄｜大規模システムを支える堅牢なMVTアーキテクチャとセキュリティ設計セミナー
ハローワーク職業訓練講師の実績を持つプロが監修。商用Python開発の「現場の作法」を完全伝授。
Djangoで極める。堅牢な商用アプリケーション設計とMVTモデルの真髄。
本講座では、大規模開発の標準であるDjangoを用いたエンタープライズ開発を学びます。認証、管理画面、ORMなど、Djangoが提供する強力な機能を「なぜ、どう使うのか」という設計的観点から理解し、フルスタック・バックエンドエンジニアとしての地位を確立する60分です。
具体的なワークショップ内容と環境
【つくるもの】
ユーザー認証とデータベース連携を完備した「商用基準の会員制ダッシュボード」を構築。大規模アクセスに耐えうるデータモデリングの基礎を実践します。
【開発環境】
PostgreSQL & Django Debug Toolbarを活用。本番環境を見据えたDB設計と、クエリの最適化（N+1問題の解決）など、テックリード視点の開発を伝授します。
この60分で得られる3つの革新スキル
SQLを意識した効率的なデータ取得。複雑なリレーションをスマートに操る技術をマスターします。
CSRF/XSS対策。プログラミングで最も重要な「ユーザー情報を守る」ための設計思想を習得します。
疎結合で保守性の高いアーキテクチャ。チーム開発で混乱を招かない、綺麗なコードの構造化を学びます。
20名規模を率いる現役PL（プロジェクトリーダー）かつ、ハローワーク等の職業訓練で指導経験を持つ講師陣が、実務で通用するPythonアーキテクチャ設計を体系的に解説。初心者から実務レベルへの「最短到達」を支援します。
