この記事では、Webアプリケーションフレームワーク、Django(ジャンゴ)について解説します。
目次
Djangoって何?
Djangoはwebアプリケーションフレームワークです。webアプリケーションフレームワークというと難しいですが、要はwebアプリを作るときに必要な機能をまとめたものです。
django以外にも、Ruby on Rails や Node.js もwebアプリのフレームワークです。
情報を表示するだけのサイトであれば、webアプリは必要ありません。
ユーザの動作によって、サイトの表示を変えたり、データをサーバに送るなどの動的な機能が欲しい場合にはwebアプリを作成する必要があります。
webアプリの機能の例
・ログイン・ログアウト機能
・掲示板のメッセージ投稿機能
・ドロップダウンメニューの表示
他にも色々ありますが、全てのサイトでこういった機能はありますよね。
ほとんどのページはwebアプリで出来ていると考えて良いと思います。
templateって何?
templateはdjangoの1つの機能です。テンプレートを使うことで動的にHTMLを生成できます。
templateの基本機能
・フィルタ
・タグ
・コメント
・テンプレートの継承
変数(variable)
変数を表示したいときに使います。
{{ variable }}
変数の属性値にアクセスする時はドットを使います。
{{ section.title }}
sectionオブジェクトのtitle属性が表示されます。
フィルタ
変数を加工したい場合はフィルタを使います。例えば、文字列を小文字に変えたい場合は
{{ name|lower }}
と書きます。
リストの長さを表示したい場合は以下のように書きます。
{{ value|length }}
valueが[a,b,c,d]のリストだったら、4を出力します。
タグ(tag)
タグを使うと、HTMLの中にPythonのfor文やif文が書けるようになります。
for文
<ul> {% for athlete in athlete_list %} <li>{{ athlete.name }}</li> {% endfor %} </ul>
アスリートの名前を羅列するプログラムです。
if文
{% if athlete_list %} Number of athletes: {{ athlete_list|length }} {% else %} No athletes. {% endif %}
athlete_listが空でなければアスリートの数を表示するプログラムです。
コメント
1行のコメントする時に使います。{# #}の中に入れる文字列は何でも良いです。
{# greeting #}hello
テンプレートの継承
テンプレートの継承は少し難しいです。しかし、ほとんどのwebアプリで使われているのでここを理解しておくと後々有利ですよ。
親テンプレートでサイトの骨組みを作っておいて小テンプレートでその中身を埋めるのがテンプレートの継承です。
親テンプレート
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <link rel="stylesheet" href="style.css" /> <title>{% block title %}My amazing site{% endblock %}</title> </head> <body> <div id="sidebar"> {% block sidebar %} <ul> <li><a href="/">Home</a></li> <li><a href="/blog/">Blog</a></li> </ul> {% endblock %} </div> <div id="content"> {% block content %}{% endblock %} </div> </body> </html>
{% block %}を使って以下の3つのブロックを定義しています。ここの箇所を子テンプレートを使って上書きしてくださいねという意味です。
{% block title %} {% endblock %} {% block sidebar %} {% endblock %} {% block content %} {% endblock %}
子テンプレート
{% extends "base.html" %} {% block title %}My amazing blog{% endblock %} {% block content %} {% for entry in blog_entries %} <h2>{{ entry.title }}</h2> <p>{{ entry.body }}</p> {% endfor %} {% endblock %}
{% extends %}タグで継承していることを教えます。親のテンプレートにタグの中身を代入するためのコードです。
HTML出力結果
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <link rel="stylesheet" href="style.css" /> <title>My amazing blog</title> </head> <body> <div id="sidebar"> <ul> <li><a href="/">Home</a></li> <li><a href="/blog/">Blog</a></li> </ul> </div> <div id="content"> <h2>Entry one</h2> <p>This is my first entry.</p> <h2>Entry two</h2> <p>This is my second entry.</p> </div> </body> </html>
ブログ名がMy amazing blogになっていますね。これは子テンプレートで定義した値です。
blog_entriesの中身が出力されています。継承された値が出力されていることが分かります。
まとめ
・テンプレートはHTMLを生成するための機能
・テンプレートの基本は変数とタグ
以上です。お疲れ様でした。