Django入門: テンプレートの描画 ～ 簡単な一行掲示板アプリを作る その6【Windows10】
- 作成日: 2020-10-18
- 更新日: 2023-12-26
- カテゴリ: Django
はじめに
この記事はDjangoで簡単な1行掲示板を作ろうというシリーズ内の記事です。
前回までにDjangoでプロジェクトとアプリを作成し、アプリ（bbs）をインストール後にプロジェクトのルート情報とアプリのルート情報を接続しました。
そしてアプリのルート情報からbbsアプリのビューに接続し、「Hello, World!」を出力する所までやりました。
今回からbbsアプリのビューからテンプレートファイルを描画してみたいと思います。
DjangoのMVTアーキテクチャのV（View）とT（Template）の部分です。
またOSはWindows10でシェルはコマンドプロンプトを使用します。
コマンドプロンプトは仮想環境をアクティベートしている前提です。
アクティベートしていない場合はvenv\Scripts\activateを実行して仮想環境をアクティベートしてください。
仮想環境については第1回をご覧ください。
それから作業ディレクトリとしてmanage.pyのあるディレクトリに移動している前提です。
テンプレートの作成
manage.pyのあるディレクトリからbbsディレクトリの中身を見てみます。
> dir bbs
admin.py # アプリの管理ページ
apps.py # アプリの設定
migrations # マイグレーションファイル用のディレクトリ
models.py # モデル
tests.py # テスト
urls.py # ルート情報
views.py # ビュー
__init__.py # このディレクトリをモジュールとして認識させるためのファイル
__pycache__ # Pythonのキャッシュ
前回はurls.pyとviews.pyを編集しました。
もう一度views.pyを見てみます。
from django.shortcuts import render
from django.http import HttpResponse # <- この行を追加
def home_view(request):
"""
パス bbs/ のテンプレートを出力するビュー
"""
return HttpResponse('Hello, World!') # テスト。レスポンスを返す
↑のビュー（home_view）は「Hello, World!」を出力するビューでした。
このビューを改造してテンプレートを描画します。
最初にテンプレートファイルを作成します。
テンプレートファイルはアプリ内のtemplates\ディレクトリ以下に作成するのが慣例になっています。
このディレクトリはアプリの作成直後は自動で生成されたりはしていません。
開発者が自分でtemplates\ディレクトリを作成し、テンプレートファイルを配置する必要があります。
manage.pyのあるディレクトリからbbsディレクトリに移動します。
> cd bbs
その後、templateディレクトリを作成します。
> mkdir templates
templatesディレクトリの中にはまた慣例なんですが、アプリ名のディレクトリを作成することが多いです。
この慣例に従わなくてもテンプレートファイルは配置できますが、今回はこの慣例に従うためにtemplates以下にbbsディレクトリを作成します。
> mkdir templates\bbs
templates\bbsディレクトリを作成したらそのディレクトリ以下にhome.htmlというHTMLファイルを作成します。
このファイルがDjangoの「テンプレート」ファイルで、home_viewから描画するテンプレートです。
これは一見するとただのHTMLファイルに見えますが、その中身はDjango独自のテンプレート言語で記述されます。
エディタでtemplates\bbs\home.htmlを開き、↓のように編集します。
<h1>{{ message }}</h1>
Djangoのテンプレートファイル内ではDjangoのテンプレート言語の構文が使えます。
↑の場合<h1>や</h1>などはただのHTMLのタグですが、{{ message }}という部分はテンプレート言語の構文です。
{{ }}で囲い、その中に変数名を書くと、コンテキストの中の変数を参照し、出力することが出来ます。
コンテキストというのはビューからテンプレートファイルに渡される辞書（dict）のことです。
このようにDjangoのテンプレートにはビューからコンテキストと呼ばれる辞書を渡すことが出来ます。
この辞書の中に変数を保存したりすることで、テンプレート内からビューの情報にアクセスすることが可能です。
ビューからテンプレートを描画する
ではビューに戻ります。
エディタでbbsディレクトリ以下のviews.pyを開き↓のように編集します。
from django.shortcuts import render
def home_view(request):
"""
パス bbs/ のテンプレートを出力するビュー
"""
context = {} # コンテキストを作成
context['message'] = 'Hello, World!' # コンテキストにmessage変数を作成
return render(request, 'bbs/home.html', context) # renderにコンテキストを渡しテンプレートを描画
↑の冒頭でインポートしているrender()は、ビューからテンプレートファイルを描画するための関数でした。
render()の第1引数にはrequestを渡し、第2引数にはテンプレートファイルのパス、第3引数にはコンテキストを渡します。
ビュー内の処理を見てみます。
context = {} # コンテキストを作成
context['message'] = 'Hello, World!' # コンテキストにmessage変数を作成
↑の部分はコンテキストを作成し、コンテキストの中にmessageという変数を定義している所です。
これはただのPythonのdictの操作で、特に難しいところは無いと思います。
次に↓の部分です。
return render(request, 'bbs/home.html', context) # renderにコンテキストを渡しテンプレートを描画
render()に引数にはさきほど説明した引数を渡します。
繰り返しになりますが、第1引数にrequestを渡し、第2引数にテンプレートファイルのパス、第3引数にコンテキストです。
テンプレートファイルのパスはアプリ内のtemplatesディレクトリを起点に記述します。
↑の場合、パスがbbs/home.htmlになっていますが、これはtemplates\bbs\home.htmlを指しています。
render()は返り値としてレスポンス（django.http.response.HttpResponse）を返します。
ビューからこのrender()の返り値を返すことで、あとはDjango（とWebサーバー）が描画をやってくれます。
これでビューによるテンプレートファイルの描画は完了です。
開発用サーバーで表示する
それではmanage.pyのあるディレクトリに移動して開発用サーバーを起動しましょう。
特にエラーがなければ↓のように表示されるはずです。
> python manage.py runserver 0.0.0.0:8123
Watching for file changes with StatReloader
Performing system checks...
System check identified no issues (0 silenced).
You have 18 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions.
Run 'python manage.py migrate' to apply them.
September 20, 2020 - 10:30:28
Django version 3.1.1, using settings 'linebbs.settings'
Starting development server at http://0.0.0.0:8123/
Quit the server with CTRL-BREAK.
http://localhost:8123/bbsにアクセスすると↓のように表示されます。
無事にテンプレートファイルの描画が完了しました。
おわりに
今回はビューからrender()を使ってテンプレートファイルを描画しました。
次回から一行掲示板の作成に入っていきたいと思います。
🦝 < おつかれさまでした