似非プログラマのうんちく

「似非プログラマの覚え書き」出張版

巳年じゃないけど Python やろうぜ(その 8)

3 週間ほど空いてしまいました。この間こっそりと開発環境を Linux に移行させていたのは秘密です*1

hello ページを作る(続き)

静的ファイル(CSS, JavaScript, etc...)の配置

今回は CSS を配置してみます。django_test\hello\static\hello というフォルダを作り、その中に css\hello.css を作成します。

body {
    background-color: #f8f8f8;
    color: #0c3c26;
}

p {
    font-size: large;
}

label {
    font-weight: bold;
}

次に common.html を書き換えます。

{% load static %}
<!doctype html>
<html>
  <head>
    <title>{{ page_title | title }}</title>
    <link rel="stylesheet" href="{% static 'hello/css/hello.css' %}">
  </head>
  <body>
    {% block content %}{% endblock %}
  </body>
</html>

サーバーを起動して確認してみましょう。

わかりにくいですが、文字色と背景色を Django の公式ドキュメントに合わせています。

JavaScript や画像ファイルなど、その他の静的ファイルも同様の方法で配置して読み込むことができます。

…君らそろそろ Model 使いたいやろ ? というわけで、次回からいよいよ Model です !

*1:実はこの記事も Linux 上の Firefox で書いてる

巳年じゃないけど Python やろうぜ(その 7)

もうちょっとだけ hello ページをいじるよ。

hello ページを作る(続き)

テンプレートを使い回す

Django には共通のテンプレートを用意してそれを使い回す方法が用意されています。extendsinclude です。前者はベースとなるテンプレートに個別のテンプレートを埋め込むイメージ、後者は共通する部分的なテンプレートを呼び出すイメージです。今回は extends を紹介します。

続きを読む

巳年じゃないけど Python やろうぜ(その 6)

Hello ページを作る(続き)

前回までで、テンプレートを利用して Web ページを表示させることができましたが、まだ Web アプリっぽくないですよね。

もう少しそれっぽくするにはフォームとかあったらいいんじゃないでしょうかね。

フォームを作成する

今回はフォームを使って

  • http://localhost:8000/hello/ にアクセスしたら、名前を入力するフォームが表示されるようにする
  • 名前を入力して送信したら、それを表示専用のページに渡して表示させる。リダイレクト先は http://localhost:8000/hello/thanks/ とする(「名前を入力してくれてありがとう !」的な感じ)
続きを読む

巳年じゃないけど Python やろうぜ(その 5)

前回からの続きです。

Hello ページを作る(続き)

HttpResponse に HTML を渡すための方法として、テンプレートを用いることにします。

まず django_test\hello の下に templates というフォルダを作り、さらにその中に hello というフォルダを作ります(このようにするわけは後で説明します。)

django_test\hello\templates\hello\hello.html を以下の内容で作成します。

<!doctype html>
<html>
  <head>
    <title>Hello Page</title>
  </head>
  <body>
    <p>Hello, Django!</p>
  </body>
</html>

django_test\hello\views.py を以下のように修正します。

from django.template import loader  # 追加
from django.http import HttpResponse


def index(request):
    template = loader.get_template('hello/hello.html')
    html = template.render()
    return HttpResponse(html)

サーバを起動して確認してみましょう。

テンプレートの置き場所として、templates フォルダの中にもう一度 hello フォルダを作りましたが、これには理由があります。Django では、仮に

  • django_test\foo\templates\index.html
  • django_test\bar\templates\index.html

と、異なるアプリで同名のテンプレートがあったとき、常に 先に検出した テンプレートを読み込んでしまいます。そのため、意図しないテンプレートを読み込んでしまわないように「名前空間」を付けて

  • django_test\foo\templates\foo\index.html
  • django_test\bar\templates\bar\index.html

のように管理するわけです。

ビューで使える便利なショートカット

テンプレートを読み込んで、それをレンダリングして HttpResponse に渡す、といった処理は頻繁に行います。そのため django.shortcutsrender という関数が用意されています。

from django.shortcuts import render


def index(request):
    return render(request, 'hello/hello.html')

この 1 行目は、最初に hello アプリを作った直後の views.py のものと同じです。それだけよく使う、ということで、最初から用意してくれているんですね。ちなみに render_to_response というのもありますが、公式ドキュメントによると非推奨、かつ将来的に廃止予定になるようです。

テンプレートに変数を埋め込む

実際にはどっか(データベースとか)から取得してきたデータをテンプレートに渡して値を埋め込むような処理をすることが多いでしょう。公式ドキュメントを見ると、render の第三引数に辞書を渡すことでそれができることが分かります。

from django.shortcuts import render


def index(request):
    my_name = 'Django'
    return render(request, 'hello/hello.html', {'my_name': my_name})
<!doctype html>
<html>
  <head>
    <title>Hello Page</title>
  </head>
  <body>
    <p>Hello, {{ my_name }}!</p>
  </body>
</html>

テンプレートの方に独特の記法が出てきました。これが Django のテンプレートならではの記法です。今後いろいろなところで出てきます。ちなみに拡張子は html のままで大丈夫です。

巳年じゃないけど Python やろうぜ(その 4)

ちょっと前回の補足。

もし Python 3.6.0 しか入れていないか、もしくは Python 2.7.x の後に Python 3.6.0 をインストールしていて、なおかつ Python Launcher をインストールしていたなら、開発用サーバの起動は

>manage.py runserver

で行えます。その他の Django 用のコマンドも同様に実行できます。

Django アプリを作る

アプリを作るためのコマンドは「うまくいった!」のページに書いてありましたね。今回は hello という名前のアプリを作ります。

>manage.py startapp hello

こんな感じで新たに hello というフォルダができています。

django_test
│  db.sqlite3
│  manage.py
│
├─django_test
│      settings.py
│      urls.py
│      wsgi.py
│      __init__.py
│
└─hello
    │  admin.py
    │  apps.py
    │  models.py
    │  tests.py
    │  views.py
    │  __init__.py
    │
    └─migrations
            __init__.py

Hello ページを作る

実際に Hello ページを作ってみましょう。django_test\hello\views.py を編集して以下のようにします。

from django.http import HttpResponse


def index(request):
    return HttpResponse('Hello, Django!')

Python のお作法として

  • 関数定義などのブロックはインデント(半角スペース 4 個)で明示する
  • 関数定義やクラス定義などの前には空行を二つ入れる
  • ファイルの終端は改行で終わる

などがあります。だいたいは pep8 が教えてくれるので、その通りにやりましょう。

次に django_test\django_test\urls.py を編集します。

from django.conf.urls import url, include  # include を追加
from django.contrib import admin

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^hello/', include('hello.urls')),  # この行を追加
]

コメントは分かりやすさのために入れてるので、実際には書かなくても大丈夫*1です。

これは何をやっているのかというと、http://localhost:8000/hello/ にアクセスしたら、それ以降の URL 文字列の処理を hello アプリの urls モジュールに委ねますよ、ということです。

なので、当然 django_test\hello\urls.py を作成することになります。このファイルはあらかじめ用意されていないので、新規に作成します。

from django.conf.urls import url
from . import views

urlpatterns = [
    url(r'^$', views.index),
]

これで http://localhost:8000/hello/ にアクセスしたら、先ほど views.py に書いた index 関数が呼ばれるようになりました。

最後に、settings.py を編集して、hello アプリが追加されたことをプロジェクトに教えてやります。

# Application definition

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

さて、開発用サーバを起動して http://localhost:8000/hello/ にアクセスしてみましょう。

表示されました。でもこれ、本当にただのテキストです。HTML でも何でもありません。HTML を表示させるには HttpResponse に HTML を渡す必要があります。でも直接長々と HTML を書き込むのは面倒ですよね。そこでテンプレートの登場となります。

*1:ちなみに行末にコメントを書くときは半角スペース 2 個分開けてから書きなさい、と pep8 が教えてくれました。

巳年じゃないけど Python やろうぜ(その 3)

似非プログラマです。本日、御年 41 になりました。また一つ、おっさんの階段を上りました。

まぁそんなことは置いといて、Django です。

そもそも Django って何よ ?

Django is a high-level Python Web framework that encourages rapid development and clean, pragmatic design.

(The Web framework for perfectionists with deadlines | Django より引用)

ざっくり訳すと「素早い開発、かつ綺麗で現実的なデザインを後押ししてくれる高水準な Python の Web フレームワークですよ~」ってところかしら。

Django 以外だと、Web2py なんてのがあるらしいけど、残念ながらこいつはまだ Python 3 系には対応してない。まぁそのうち対応するんじゃないかな。

ということで。

とにかく入れる

とにかくインストールする。と言っても、ものすごく簡単。コマンドプロンプトを開いて

>pip install django

以上。あとは画面をボーッと眺めてれば、ものの数十秒で Django はインストールされます。便利な世の中になったアル。

とにかく作る

Django のアプリを管理するプロジェクトを作ります。お好きなフォルダに移動して

>django-admin startproject django_test

すると django_test というフォルダができます。ちなみにできたフォルダの中身はこんな感じ。

django_test
│  manage.py
│
└─django_test
        settings.py
        urls.py
        wsgi.py
        __init__.py

とにかく動かす

>cd django_test
>python manage.py runserver
Performing system checks...

System check identified no issues (0 silenced).

You have 13 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.
January 14, 2017 - 22:40:49
Django version 1.10.5, using settings 'django_test.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CTRL-BREAK.

ということでブラウザで http://localhost:8000 にアクセスしてみましょう。

とりあえず動きましたが、まだ何もありません。

日本語化する

ここから Atom で作業します。

django_test\django_test\settings.py を開くと、106 行目~108 行目に

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

ってのがあると思うので、これを

LANGUAGE_CODE = 'ja-jp'

TIME_ZONE = 'Asia/Tokyo'

に直します。保存すると、コマンドプロンプトで runserver が再起動しているのが分かると思いますので、さっきのページをリロードしてみましょう。

メッセージが日本語になりましたね。もちろん、まだ作業は何も手を付けていません。次にやるべきことは、もう書いてありますね。そう、startapp でアプリのひな型を作るのです。

巳年じゃないけど Python やろうぜ(その 2)

前回からの続きです。

開発環境を整える

PyCharm は割とおすすめらしいんだけど、無料版だと Web 開発にはやや機能不足っぽい。

ということで、無料で整えられる環境としては以下のパターンがあるかと思います。

Eclipse + PyDev

Eclipse - The Eclipse Foundation open source community website.
PyDev

おなじみの Eclipse に PyDev プラグインをインストールして Python の開発環境として使う方法。マウスクリックで Django プロジェクトも作れる。そんなに悪くない。

Atom + 各種パッケージ

Atom

GitHub が提供している無料の高機能エディタにパッケージを入れて Python 用のエディタとして使う方法。linter-pep8 linter-pycodestyle を入れると pep8 pycodestyle*1 を利用してコードのチェックができる(PyDev は pylint のみ対応)。pep8 pycodestyle の他に flake8 というのもあって、そちらを使うのであれば linter-flake8 を入れればよい。

一応、両方それぞれに構築してみた。Eclipse + PyDev は特に問題なし…と思ったが、後に pylint の設定でハマる。

Atom は差し当たり

あたりを入れておけばいいんじゃないでしょうか(Django 関連は後ほど紹介)

各種 linter のインストール

pylint

普通に pip install pylint したら見事にハマりました ! のぉー !

というわけで、昨日紹介した非公式バイナリ配布サイトから lazy_object_proxy と wrapt を持ってきてまず先に入れておきます。それから pip install pylint でインストール完了。

pep8 pycodestyle, flake8

pip install pep8 pip install pycodestyle, pip install flake8 で問題なし。

次はいよいよ Django ですよ !

*1:pep8 は pycodestyle にリネームされたそうです。