Djangoでページを追加し表示する|初心者・独学者向け入門コンテンツ
今回は前回追加したDjangoのアプリケーション（mysite/polls）へhtmlを追加して、ページを表示します。
なお、本内容からチュートリアルの参照ではなく、当サイトのオリジナルの内容になります。
作成するページについて
今回はページで、DBからのデータ呼び出しは行いません。
共通のレイアウトページを作成して、そのページからhtml要素を呼び出す設定を行います。
今回のアプリケーション構成
mysite/
manage.py
mysite/
__init__.py
settings.py
urls.py
wsgi.py
※mysiteの名前は適時変更可能
polls/
__init__.py
admin.py
apps.py
migrations/
__init__.py
models.py
tests.py
views.py
※pollsの名前は適時変更可能
フォルダを作成する
まずは以下２つのフォルダを作成します。
追加フォルダパス１： polls/templates
追加フォルダパス2： polls/templates/polls
polls/
#中間省略
migrations/
__init__.py
templates/
polls
models.py
views.py
※templates配下のフォルダ名とアプリケーションのフォルダ名は 同様になる必要があります。 今回ですと pollsで設定しています。
ページを作成する
レイアウトページとカテゴリーページの２つを作成します。
完成形のパスイメージ
polls/
#中間省略
migrations/
__init__.py
templates/
polls/
layout.html
category.html
models.py
views.py
※ページ名は適時変更頂いて問題ございません。
layout.htmlへ以下コードを貼り付けます。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>{%block title%}{%endblock%}</title> <!--CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/> <!--JS --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> </head> <body> <div class="contanier"> <div> {%block content%} {%endblock%} </div> </div> </body> </html>
categoryページを作成
追加するファイルのパス
polls/templates/polls/category.html
{% extends 'polls/layout.html'%}
{%block title%}
カテゴリーページです。
{%endblock%}
{%block content%}
カテゴリーページを表示しています。
{%endblock%}
{%block content%}などの内容は後ほど紹介します。
urlを編集する
チュートリアルで作成したurlを流用します。
mysite/urls.pyは編集しません
mysite/urls.py from django.contrib import admin from django.urls import include, path urlpatterns = [ path('polls/', include('polls.urls')), #adminパスはなくても可 path('admin/', admin.site.urls), ]
polls/urls.pyを以下の通り編集します。
polls/urls.py from django.urls import path from . import views urlpatterns = [ path('', views.index, name='index'), #以下追加分 path('category/', views.category, name='category'), path('about/', views.about, name='about'), ]
Djangoのルート構成は、アプリケーションの管理ファイルでアプリケーションのURLを紐づけ、アプリケーションでURLとviewを紐づけます。
今回の場合、mysite/urls.pyの
path('polls/', include('polls.urls'))
でpolls/urls.pyを指定し、polls/urls.pyの
path('category/', views.category, name='category'),
でviewを指定します。
view.pyファイルを編集する
Djangoのview.pyファイルは他のプログラミング言語のフレームワークで言うとControllerに該当します。
その為、DjangoでControllerを編集するにはviewファイルを編集する必要があります。
編集ファイルパス： /Users/smt/mysite/polls/views.py
from django.shortcuts import render #以下を追加 def category(request): return render(request, 'polls/category.html')
上記でlocalhost:8000/polls/category/へアクセスしてみましょう。
カテゴリーページのテキストが表示されているはずです。
ページの解説
レイアウトページで設定した内容をカテゴリーページで呼び出す設定の解説を行います。
※Ruby On Railsのpartialになります。
まずはlayout.htmlの以下をご覧ください
<!DOCTYPE html> <html lang="ja"> <head> <!--中間省略--> <meta charset="utf-8"> <title>{%block title%}{%endblock%}</title> </head> <div class="contanier"> <div> <!--中間省略--> {%block content%} {%endblock%} </div> </div>
layout.htmlのタイトル行で{%block title%} を、divタグで {%block content%}を設定されているかと思います。
{%block %}はDjangoのテンプレートタグで、このタグを設定することによって、layout.htmlの内容を、他のページで継承する事ができます。
なお、{%block %}タグの名称は変更可能なので、以下の様に 変更する事も可能です
<div>
{%block head-content%}
{%endblock head-content%}
</div>
category.htmlで継承したページを呼び出す場合は
以下ソースの１行目の通り、呼び出したいページのパスを設定し、{%block %}タグを設定すれば、layout.htmlの内容を呼び出す事ができます。
{% extends 'polls/layout.html'%}
{%block title%}
カテゴリーページです。
{%endblock%}
{%block content%}
カテゴリーページを表示しています。
{%endblock%}
以上になります。
モデルの生成は以下記事から
Djangoでマイグレーションを実行しDBテーブルを生成する|初心者・独学者向け入門コンテンツ
その他関連記事
Djangoで発生するエラー:TemplateDoesNotExist atの解説と解消方法
DjangoとPython3でMysqlを利用する|初心者・独学者向け入門コンテンツ
Python3初心者向け|無料で使えるIDE PyCharmの紹介
