【Django入門5】初めてのHTMLテンプレート|Djangoのテンプレートシステムを学ぶ

HTMLテンプレートとは

テンプレートの基本

DjangoのHTMLテンプレートは、動的なWebページを作成するために使われます。通常のHTMLファイルにDjangoのテンプレートタグを組み込むことで、データベースから取得した情報をページに表示したり、動的なコンテンツを作成することができます。

なぜテンプレートが必要なのか

  • 静的なHTMLファイルでは、ページごとに内容を手作業で編集する必要があります。
  • テンプレートを使えば、データを動的に埋め込むことができ、効率的な開発が可能になります。

テンプレートの準備

テンプレートの配置場所

Djangoでは、テンプレートは通常アプリケーション内に「templates」というフォルダを作成し、その中に配置します。

例: ディレクトリ構成

myproject/
    └── myapp/
        ├── templates/
        │   └── home.html
        ├── views.py
        └── urls.py

テンプレートフォルダの設定確認

プロジェクトのsettings.pyにはデフォルトでテンプレートのディレクトリが設定されています。

設定の確認例:

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

HTMLテンプレートの作成

簡単なHTMLファイルの例

テンプレートファイルは通常のHTMLファイルと同じ形式ですが、Djangoのテンプレートタグを使って動的なデータを埋め込むことができます。

home.html:

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>ホームページ</title>
</head>
<body>
    <h1>ようこそ、Djangoの世界へ!</h1>
    <p>このページはテンプレートを使って動的に表示されています。</p>
</body>
</html>

ビューでテンプレートを表示する

ビュー関数の作成

テンプレートを表示するためには、views.pyにビュー関数を定義します。

例: ビュー関数

from django.shortcuts import render

def home(request):
    return render(request, 'home.html')

render()関数の役割

  • render()関数は、指定したテンプレートを使ってHTMLレスポンスを生成します。
  • requestオブジェクトとテンプレートファイル名を引数に渡します。

URLの設定

urls.pyの編集

ビュー関数をURLに紐づけるには、urls.pyに設定を追加します。

例: URL設定

from django.contrib import admin
from django.urls import path
from . import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', views.home, name='home'),
]

これにより、ホームページ(/)にアクセスしたときにhome.htmlが表示されるようになります。

動的なデータの埋め込み

変数の表示

Djangoのテンプレートでは、ビューから渡されたデータを表示することができます。

例: ビュー関数でデータを渡す

from django.shortcuts import render

def home(request):
    context = {
        'greeting': 'ようこそ、Djangoのテンプレートへ!'
    }
    return render(request, 'home.html', context)

home.htmlで変数を表示

<h1>{{ greeting }}</h1>

このように記述することで、ビューから渡されたデータがページ上に表示されます。

テンプレートタグの利用

Djangoには、条件分岐や繰り返しを実現するためのテンプレートタグが用意されています。

例: 繰り返し処理

from django.shortcuts import render

def home(request):
    context = {
        'items': ['りんご', 'みかん', 'バナナ']
    }
    return render(request, 'home.html', context)

home.htmlで繰り返し処理

<ul>
    {% for item in items %}
        <li>{{ item }}</li>
    {% endfor %}
</ul>

まとめ

Djangoのテンプレートを使えば、動的なコンテンツを簡単にWebページに表示することができます。ビューからデータを渡し、テンプレートで表示する流れを覚えれば、より複雑なWebアプリケーションも構築できます。