36歳がDjangoを勉強してみた（掲示板のサンプルデータを個別に表示）

shin

2020年7月3日 20:13

今回もpaizaで勉強したWebアプリケーションフレームワークのDjangoについて書きます。

今日学んだことです。

【学んだこと】

●掲示板のサンプルデータを個別に表示する

今回は、データベースに入っているデータを個別に表示してみます。

今までの差分から作っていますので、最初から見たい方はこちらのマガジンより設定してください。

それでは設定していきます。

【手順】
１．ルーティングを設定するため、「myapp/helloworld/urls.py」ファイルを変更します。

$ vi myapp/helloworld/urls.py

以下の内容に変更します。

from django.urls import path
from . import views

app_name = 'helloworld'　←　新規追加

urlpatterns = [
          path('', views.index, name='index'),
          path('<int:id>', views.detail, name='detail')　←新規追加
          ]

このコードでは、ID番号をURLを呼び出すプログラムを追加しています。
「app_name」は後のリンクで使うため記載します。

２．次に「myapp>helloworld>views.py」を変更します。


~$ vi myapp>helloworld>views.py

以下のように変更します。
from django.shortcuts import render, get_object_or_404　←　追記
from django.http import HttpResponse
from .models import Article

def index(request):
  articles = Article.objects.all()
  context = {
      'message': 'Welcome Hello 習慣',
      'articles': articles,
  }
  return render(request, 'helloworld/index.html', context)


下記のdetail関数を追加する

def detail(request, id):
   article = get_object_or_404(Article, pk=id)
   context = {
       'message': 'Show Article ' + str(id),
       'article': article,
   }
   return render(request, 'helloworld/detail.html', context)

「get_object_or_404」とはDjangoのショーカット関数で、指定したモデルからデータを取得してきます。また、エラーが発生した場合に「404」エラーを返すことができます。

その後、「context」に表示する文字を、returnで「detail.html」に戻るようにしています。

３．「detail.html」ファイルを作成します。
これは、「index.html」をコピーして内容を修正します。
次のコマンドを実行すると、「detail.html」ファイルがコピーされます。

~/myapp$ cp helloworld/templates/helloworld/index.html helloworld/templates/helloworld/detail.html

４．コピーした、「detail.html」を編集します。

<!DOCTYPE html>
<html>
 <head>
    <meta charset='utf-8'>
    <title>hello 習慣</title>
    <style>body {padding: 10px;}</style>
 </head>
 <body>
    <h1>hello 習慣</h1>
    <p>{{ message }}</p>
    <p>{{ article.content }}</p>
    <p><a href="{% url 'helloworld:index' %}">一覧></a></p>
 </body>
</html>

このプログラムでは、データベースから指定したIDのデータを取得し表示させています。
また、一覧ページに戻るためのリンクを作成しています。
※ここで、「urls.py」で作成した「app_name」を利用しています。

５．プログラムが問題なく動作するか確認します。
Djangoのサーバを起動して、ログインします。

~/myapp$ python manage.py runserver

６．ブラウザより以下のURLを入力

https://localhost:8000/helloworld/1

ID２を入力した時

ID４を入力すると。

プログラムした通り、データベースがあるID番号を指定すると、個別ページが表示され、ないID番号を指定すると４０４エラーが表示されました。

また、一覧リンクを押すことで一覧画面が表示されました。

一覧ページから個別ページへのリンクを作成する場合は、「index.html」に以下のようにコードを追加します。

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <title>hello 習慣</title>
    <style>body {padding: 10px;}</style>
</head>
<body>
    <h1>hello 習慣</h1>
    <p>{{ message }}</p>
    {% for article in articles %}
        <p>　←　場所移動
            {{ article.content }}
        <a href="{% url 'helloworld:detail' article.id %}">詳細</a>　←追加
        </p>　←　場所移動
    {% endfor %}
</body>
</html>

本日はここまでです。

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

この記事が気に入ったらサポートをしてみませんか？