チュートリアル
settings.py
INSTALLED_APPS
アプリケーションのリスト。
INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'hogeapp.apps.HogeappConfig' ]
最後の行。自作したアプリケーションを登録する。
URL
インポート
from django.urls import path, include from .views import hoge, fuge
書き方
プロジェクトの urls.py
from django.contrib import admin from django.urls import path, include urlpatterns = [ path('admin/', admin.site.urls), path('', include('hoge.urls')) ]
アプリケーションの urls に繋げる場合は include
で繋げる。
アプリケーションの urls.py
urlpatterns = [ path('hoge/', HogeList.as_view(), name='hoge_name'), path('fuge/<int:pk>', FugeDetail.as_view(), name='fuge_name'),
as_view()
URL を Class Based View に接続する場合は as_view()
をつける。
name
URL を指定するときに使用する名前。
例えば データ消去後のページ遷移などでこの name で定義した名前を指定する。
<int:pk>
Primary Key。
削除や編集、詳細に関してはどのデータに対して処理を行うかを指定する必要がある。
このときに使用するのがこの Primary Key。
データベースはデータに対して重複しない番号を振っていく。
この番号には Primary Key という属性が付いている。
データを削除した場合、Primary Key は抜け番になったまま使われない。
つまり、削除したデータを含めて重複しない番号が振られていく。
Primary Key の設定はマイグレーションで表記される。
モデル
from django.db import models CHOICE = (('danger', 'hoge'), ('warning', 'huge'), ('primary', 'hogehoge')) class TestModel(models.Model): char = models.CharField(max_length=100) text = models.TextField() choice = models.CharField(max_length=50, choices=CHOICE) date = models.DateField() def __str__(self): return self.char
admin への登録
モデルは models.py に作成するだけでは管理画面に表示されない。
admin.py でモデルの登録が必要。
from django.contrib import admin from .models import ClassName admin.site.register(ClassName)
フィールドの種類
フィールドの型 | データ | 備考 |
---|---|---|
BooleanField | TrueまたはFalse | |
CharField | 文字列 | max_length 必須 |
SlugField | 文字列(制限あり) | |
IntegerField | 整数 | |
PositiveIntegerField | 正の整数 | |
TextField | 長い文字列 | |
DateField | 日付 | |
DateTimeField | 日時 | |
FileField | ファイルアップロード | |
ImageField | 画像 | Pillow のインストールが必要 |
URLField | URL | |
EmailField | メールアドレス | |
GenericIPAddressField | IPアドレス |
フィールドのオプション
名前 | 内容 |
---|---|
max_length | 文字列などの最大の長さ |
label | Field が Form 内で表示されるときに使用 |
initial | デフォルトの値 |
max_value | 最大値 |
min_value | 最小値 |
widget | form の詳細設定 |
attrs | 辞書型で設定を行う |
choices | 選択肢の設定 |
null | データベースの中身が空の状態を許可する |
blank | フォームからの投稿時に項目が空の状態を許可する |
選択式のフィールド
choices=タプル型 で選択肢を作れる。('danger', 'hoge')
の場合、Django 内部で使用するのが左の 'danger'
、Webアプリケーションで表示されるのが'hoge'
となる。
<div class="alert alert-{{ object.choice}}">
テンプレートで上記のコードを書いた場合、object.choice
に入るのは'danger'
。Bootstrap では赤色が表示される。
項目名を任意のフィールドへ変更
def __str__(self): return self.char
上記の文でデータの項目の表記を指定する。
デフォルトでは モデル名 object (1)
といった名前になる。
入力を任意に設定する
null=True
データベースの中身が空の状態を許可する
blank=True
フォームからの投稿時に項目が空の状態を許可する
ビュー
Class Based View
インポート
from django.view.generic import ListView, DetailView from .models import TestModel
ビュークラス一覧
ビュークラス名 | 概要 | 利用画面例 | 必要な引数 |
---|---|---|---|
View | get()、post()などHTTPメソッドに特化したビュー | 画面全般 | |
TemplateView | テンプレートファイルを読み込み、ページ生成するための便利機能が揃った最も代表的なビュー | 画面全般 | |
ListView | データベースと連携し、複数レコードの特定情報を一覧表示する際に利用 | 一覧画面 | |
DetailView | データベースと連携し、単一レコードの詳細情報を表示する際に利用 | 詳細画面 | |
CreateView | データベースと連携し、レコード生成する際に利用 | 新規登録 | fields, success_url |
UpdateView | データベースと連携し、レコードの中身を編集する際に利用 | 編集画面 | fieds, success_url |
DeleteView | データベースと連携し、レコード削除する際に利用 | 削除画面 | success_url |
FormView | フォームを実装する際に利用 | 問い合わせ | |
LoginView | ログイン機能実装時に利用 | ログイン | |
APIView | 外部APIを用いたロジック構築時に利用。実装時はDjango Rest frameworkの知識が必要 |
書き方
class TestUpdate(UpdateView): template_name = 'update.html' model = TestModel fields = ('title', 'memo', 'priority', 'duedate') success_url = reverse_lazy('hoge_name')
ここで使用する変数名は固定。規定の変数名で定義していく。
template_name
表示する html のファイル名を指定する。
model
使用するモデルを定義する。models.py で定義したモデルを入れる。
fields
利用する項目を定義する。UpdateView と CreateView で使用。
success_url
処理が成功した場合の遷移ページを指定する。
指定する内容は urls.py で Path に name で渡した値。
この遷移処理はデータベースに対する処理を行った後に実行される。
そのため、reverse_lazy
で URL に繋げる必要がある。
Function Based View
テンプレート
ビューの処理
受け取ったオブジェクトを for 文で回す
ListView などで複数のオブジェクトを受け取っている場合に利用できる。
{% for object in object_list %} <!-- 処理 //--> {% endfor %}
項目の取得 / 表示
Primary Key で ID が指定されている場合や 上記の for 文の中で使用できる。
{{ object.項目名 }}
<div class="alert alert-{{ object.choice}}">
など、css のクラス指定の中で利用することも可能。
テンプレート
base.html
<!doctype html> <html lang="ja"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Bootstrap CSS --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> <title>Hello, world!</title> </head> <body> {% block header %} {% endblock header %} {% block content %} {% endblock content %} <!-- Optional JavaScript; choose one of the two! --> <!-- Option 1: Bootstrap Bundle with Popper --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script> <!-- Option 2: Separate Popper and Bootstrap JS --> <!-- <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script> --> </body> </html>
その他の html
{% extends 'base.html' %} {% block content %} {% endblock content %}
{% extends 'base.html' %}
で base.html を元に html を構成できる。
form タグを使用する場合
form タグを使用する場合は CSRF トークンを指定する必要がある。
<form action="" method="POST">{% csrf_token %} </form>
とりあえず form を使うときは上記のように CSRF トークンをテンプレートにいれること。
POST と GET
ブラウザは HTTP リクエストをサーバーに投げていくが、このときこの URL 以外の情報もサーバーに送られている。
そのうちのひとつがメソッド。メソッドの中の2つの種類が POST と GET。
method="POST"
と書かないとフォームから送られるデータが POST として送信できない。