Djangoを勉強してみる_テンプレートを学ぶ(入門編)

Pocket

前回の続きで、Djangoについて学んでいきます。

今回はテンプレートについて勉強していきます。

Djangoの勉強内容は以下の本を参考にしています。

参考

Python Django3超入門 (日本語) 単行本 – 2020/6/13 掌田 津耶乃 (著)

テンプレート

コードは以前の記事を参考にしてください。

Djangoを勉強してみる(入門編)

Djangoを勉強してみる(入門編その2)

Djangoを勉強してみる_urlを学ぶ(入門編)

テンプレートとは

テンプレートとは、HTMLコードの中にPythonで作成した様々な変数やデータを組み込んだものです。

そのため、Python独自の機能を利用して、その結果をHTMLで表示させることができるメリットがあります。

まずはテンプレートを使うための準備をします。

アプリケーションの登録

テンプレートを使うためには、Djangoにアプリケーションの登録をする必要があります。

アプリケーションの登録には以下のコードを追加します。

ファイル:sample_app>sample_app>settings.py

コード:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
'hello', #追加 ]

settings.pyのINSTALLED_APPSのリストに、「hello」を追加します。

このコードを追加する理由は、Djangoのテンプレート機能がhelloというアプリケーションを検索できるようにするためです。

Djangoを使うときの決まりなので、気にせず追加しておきます。

テンプレートの準備

テンプレートを利用するにはもう一つあります。

それは、アプリケーション直下に以下のフォルダとファイルを用意することです。

ちなみに、フォルダ名には命名規則があり、アプリケーション直下に作成するフォルダ名は「templates」、その直下に作成するフォルダ名は「アプリケーション名」と決まっています。ファイル名は好きなように指定できます。

今回の構成でまとめると次のようになります。

プロジェクト名:sample_app
アプリケーション名:hello

テンプレートフォルダ構成:sample_app>hello>templates>hello
ファイル:index.html

それでは作っていきます。

  1. フォルダを新規作成する
    フォルダ:templates>hello
  2. ファイルを作成する
    ファイル:index.html
test@ubuntu:~/デスクトップ/Django/sample_app$ tree
.
├── db.sqlite3
├── hello
│   ├── __init__.py
│   ├── __pycache__
│   │   ├── __init__.cpython-38.pyc
│   │   ├── urls.cpython-38.pyc
│   │   └── views.cpython-38.pyc
│   ├── admin.py
│   ├── apps.py
│   ├── migrations
│   │   └── __init__.py
│   ├── models.py
│   ├── templates
│   │   └── hello
│   │       └── index.html
│   ├── tests.py
│   ├── urls.py
│   └── views.py
├── manage.py
└── sample_app
    ├── __init__.py
    ├── __pycache__
    │   ├── __init__.cpython-38.pyc
    │   ├── settings.cpython-38.pyc
    │   ├── urls.cpython-38.pyc
    │   └── wsgi.cpython-38.pyc
    ├── asgi.py
    ├── settings.py
    ├── urls.py
    └── wsgi.py

これで準備が整ったので、HTMLファイルにコードを書いていきます。

index.htmlの準備

それでは、変数をHTML与えてDjangoを通して読み込んでみます。

  1. index.htmlに以下のコードを追記します。

    <!DOCTYPE html>
    <html lang="ja">
    <head>
        <meta charset="UTF-8">
        <title>{{ title }}</title>
    </head>
    <body>
        <h1>{{ title }}</h1>
        <p>{{ msg }}</p>
    </body>
    </html>
    ここでは、HTMLコードに変数「title」と「msg」を埋め込んでいます。
    pythonの変数などをHTMLに渡す場合{{}}を使います。
  2. アプリケーションのviews.pyを編集する

    次にviews.pyのindex関数を編集します。

ファイル:sample_app>hello>views.py

コード:

from django.shortcuts import render
from django.http import HttpResponse

def index(request):
    params = {
        'title': 'Hello World!!',
        'msg': 'これはサンプルページです。'
    }
    return render(request, 'hello/index.html', params)

このコードでは、index関数に「params」という辞書に変数「title」と「msg」の値を挿入しています。

そして、returnでrender関数を使って、呼び出すテンプレートと辞書を呼び出すようにしています。

render関数とは、テンプレートをレンダリングするときに使う関数です。
使い方は、第1引数にクライアントへの返送を管理するHttpRequestインスタンスを指定し、第2引数に使用するテンプレートを指定します。
第3引数にはテンプレートで利用するための変数を指定します。

以上で、設定は終わりなので動作確認してみます。

動作確認

python manage.py runserver

ブラウザで以下にアクセスします。

http://localhost:8000/hello

 

ちゃんとviews.pyのindex関数で指定した変数がテンプレートに読み込まれて表示されています。

こんな感じでテンプレートを利用することでpythonの機能をHTMLファイルに渡すことができます。

本日はここまでです。

ありがとうございました。

P.S.

勉強を継続することが苦手ですか?

少し前からココナラというサービスで習慣化のテクニックについて教えるサービスを始めました。

もし、いつも3日坊主で終わってしまうという方や、ダイエットを続けたい、勉強したい、運動したいなど何か習慣化したいと思っている方がいましたら全力でサポートしますので、まずは覗いてみてください。

すでに何人かの方に実践してもらって効果が出ているという感想をいただいてます。

人生変わる?【習慣化の方法】を教えます 。ダイエット、勉強、運動を続けることが苦手ですか?

Pocket

「Djangoを勉強してみる_テンプレートを学ぶ(入門編)」への2件のフィードバック

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です