1. HOME
  2. ブログ
  3. IT技術
  4. 【第4回】Responderを使ってDjangoチュートリアルをやってみた【公開ビュー作成編】

【第4回】Responderを使ってDjangoチュートリアルをやってみた【公開ビュー作成編】

第4回~Responderを使ってDjangoチュートリアルをやってみた~

 

前回、「【第3回】Responderを使ってDjangoチュートリアルをやってみた【データベース操作編】」の続きです。

今回も、Responder(レスポンダー)を使って「Djangoのチュートリアル」をやってみたいと思います。

Django のチュートリアル「はじめての Django アプリ作成」を、Responderで追う形になりますので、多少内容が異なる部分がありますが、成果物はできるだけ同じモノになるよう作る予定です。

【はじめての Django アプリ作成】
https://docs.djangoproject.com/ja/2.2/intro/

第1回はこちら

オーバビュー

今記事は、Djangoチュートリアルでいうところのと、「はじめての Django アプリ作成、その 3 」と「 はじめての Django アプリ作成、その 4 」にあたります。

現在、作成しているPollsアプリケーションでは、以下のビューを公開用として作成していきます。

質問-インデックスページ最新エントリーをいくつか表示
質問-詳細ページ結果を表示せず、質問テキストと投票フォームを表示
質問-結果ページ特定の質問の結果を表示
投票ページ特定の質問の選択を投票として受付

また、ビューのURLは、前回の「/delete/question/1」のような解りやすくシンプルなURLパターンで提供できるようにします。

早速作成していきましょう。

質問-インデックスページ

インデックスページとは、http://127.0.0.1:5042で表示されるビューです。

簡単ではありますが、インデックスページを以前すでに作っています。

現在、 templates/index.html は以下のようになっているはずです。

この章では、これを改造していきたいと思います。

インデックスページでは、質問一覧を表示させる必要があります。

しかし、このようなデータベース処理は、【第1回】から読んでいただいている方には、さほど難しくはないはずです。

urls.py

それでは、まず、 urls.py の @api.route('/') を触っていきましょう。

Questionテーブルから「id」「質問内容」「公開日」を持ってきてビューに渡すだけですが、少し凝ってみましょう。

としてみました。

def get_queryset(self, latest=5) で、最新 latest 個、公開日が新しい順で取得しています。

今回は、最新順で表示させる必要があるため、データベースからは降順でデータを取得する必要があります。

したがって、SQLでいう「ORDER BY DESC」でデータを取得する必要があり、SQLAlchemyでは order_by() を使います。

ビュー

それでは、次に、ビューを作ります。

こちらも、もらった質問一覧をビューで展開するだけなので、とても簡単です。

今回は、このように実装してみました。

質問の詳細は、/detail/1のようなURLパターンで処理することにしています。

質問一覧としては機能していますが、せっかくなので少し仕様を変更してみましょう。

最新(直近)の質問だけ強調する

現在は、公開日が新しい順に並んでいますが、昨日までに公開されたものを強調してみましょう。

久しぶりに、モデルをいじります。

上記のような関数を追加しました。

これは、登録されている日付が、現在から days 日前に存在していればTrueを返す関数です。

次に、インデックスページを表示させる関数に以下の処理を追加していきます。

Pythonの内包表記を使って、各質問の公開日が最新かどうかをlistとして取得しています。

ビュー

それでは、ビューには、以下のように追記してみましょう。

Jinja2では、 loop.index は「」から始まるので、配列のインデックスとして扱う場合は上記のように -1 します。

動作確認

それでは、新しく質問を追加してみて、実際に動作するか確認してみましょう!

画像のように、バッジが表示されていれば成功です!

SQLAlchemyでは、モデルクラスに関数の定義が可能で、それらをResponderとリンクさせることでさまざまな機能が実現できます。

質問-詳細ページ

それでは、詳細ページを作っていきます。

まず、 detail/{id} というURLパターンを urls.py に追記していきます。

これは、URLによって指定された「id」に対して、合致するものをデータベースから取得しビューに渡すだけなので、

のように記述します。

Questionテーブルからは、一つで良いので first() 、Choiceテーブルからは質問idが同じものすべて取得する必要があるので all() を使っていきます。

ビュー

次に、ビューを作って行きましょう。

ビューでは、質問内容に対して選択肢と、投票機能を備えていれば良いので以下のようなコーディングが良いでしょう。

次に、投票機能質問-結果ページを実装していきたいと思います。

投票機能と質問-結果ページ

投票機能では、先ほどのビューで /vote/{id} のようなURLパターンで提供するように実装しました。

したがって、いつもの如くルーティング作業をしていきます。

実装内容の詳細な説明は、もう大丈夫だと思います。

これで、投票機能はできたので、リダイレクト先となる質問-結果ページを作成していきます。

ルーティング

まずは、ルーテイングから。

ビュー

次に、ビューは以下のように実装しました。

投票数は、bootstrap4のbadgeクラスを用いてデザインしていますが、どんな形でも構いません。

動作確認

実際に投票してみると、以下のように、うまいこと投票機能と結果のビューが実装できていることが確認できます。

404エラーの送出

Djangoチュートリアルでは、ここで404エラー、すなわち「ページが存在しないときのエラー画面」についての説明が入ります。

しかし、Responderには現在そのようなエラーハンドリングがないようです。

ネット上でも様々な人が試行錯誤していますが、既存のResponderではスマートに解決できていないようです。

力技で解決する場合

この方法は、Responderのコード自体をいじってしまうため、あまりオススメできませんが、ひとつの解決案として参考にしてください。

Responderのコードをいじると言っても1行変更するだけです。

Responderの api.py というファイルの494行目に default_response() という関数があります。

その関数を、以下のように変更してみたください(変更部分は508行目)。

これで404エラーコードはすべてテンプレートの「404.html」にレスポンスされます

404.html

ひとまず、404.htmlは、以下のようにしてみました。

これで、ルーティングしていないURLにアクセスすると、今追加した404.htmlが表示されると思います。

あまりスマートな方法ではありませんが、大きな変更ではないのでひとつの案としてご紹介しました。

第5回へつづく!

ここまでの内容で、Pollsアプリケーションは、最低限の機能の実装を終えました

投票の一覧も確認できて、投票もできて、結果も確認できるようになりました。

そして、質問や選択肢を追加したり、変更したり、削除もできます。

次は、少し内容が変わって、自動テストについてのチュートリアルに移ります。

内容が内容なだけに距離をおきがちですが、このチュートリアルでは大したことはやらないので、これを機に自動テストについて理解を深めていきましょう。

第5回の記事はこちら

【全編まとめ】Responderを使ってDjangoチュートリアルをやってみた

こちらの記事もオススメ!


書いた人はこんな人

広告メディア事業部
広告メディア事業部
「好きを仕事にするエンジニア集団」の(株)ライトコードです!

ライトコードは、福岡、東京、大阪の3拠点で事業展開するIT企業です。
現在は、国内を代表する大手IT企業を取引先にもち、ITシステムの受託事業が中心。
いずれも直取引で、月間PV数1億を超えるWebサービスのシステム開発・運営、インフラの構築・運用に携わっています。

システム開発依頼・お見積もり大歓迎!

また、現在「WEBエンジニア」「モバイルエンジニア」「営業」「WEBデザイナー」「WEBディレクター」を積極採用中です!
インターンや新卒採用も行っております。

以下よりご応募をお待ちしております!
https://rightcode.co.jp/recruit

関連記事

採用情報

\ あの有名サービスに参画!? /

バックエンドエンジニア

\ クリエイティブの最前線 /

フロントエンドエンジニア

\ 世界を変える…! /

Androidエンジニア

\ みんなが使うアプリを創る /

iOSエンジニア