DJango_info の履歴(No.19)

インストールとプロジェクトの初期化、アプリの初期化
django ビルトイン管理ツール（= manage.py)
URL ディスパッチャー（パスコンバーターによるリインテリジェントな　URL ルーティング機構)
Model (データー構造の定義）
View（ビジネスロジックの実装）
Template（Look & Feel の規定）
django/channels (websocket 実装)
vscode を使ったデバッグ
参考 URL

インストールとプロジェクトの初期化、アプリの初期化†

インストール†

[local] munakata:~/source/python/vlman$ pip3 install django
[local] munakata:~/source/python/vlman$ python3 -m django --version
2.2.2

↑

PYTHONPATH の指定†

vscode 上の lint が Django のパッケージが見つけられないというワーニングを出すことを抑止するために明示的に指定
PYTHONPATH には pip show django を実行して location で指定されたパスを設定する
PYTHONPATH 自体は vscode の設定ファイル（プロジェクトディレクトリ）/.vscode/settings.json 内に記載するのが良さそう

↑

プロジェクトとアプリの初期化†

[local] munakata:~/source/python/vlman$ django-admin startproject vlmanui
[local] munakata:~/source/python/vlman/vlmanui$ django-admin startapp file_viewer

↑

管理用ユーザーの登録†

[local] munakata:~/source/python/vlman/vlmanui$ python3 manage.py createsuperuser
Username (leave blank to use 'munakata'): 
Email address: magu775@gmail.com
Password: 
Password (again): 
Superuser created successfully.

↑

timezone とロケールの設定 (settings.py)†

LANGUAGE_CODE = 'ja'
TIME_ZONE = 'Asia/Tokyo'

↑

インストール完了時のディレクトリー構造†

プロジェクトの下にアプリケーションを追加していく構造

[local] munakata:~/source/python/vlman$ tree
.
├── video_top
│   ├── sample_A.mp4 
├── vlman.py
├── vlmandb.sqbpro
├── vlmandb.sqlite3
├── file_viewer  <--------- application definition
│   ├── __init__.py
│   ├── admin.py
│   ├── apps.py
│   ├── migrations
│   │   └── __init__.py
│   ├── models.py  <----------- database access definition
│   ├── tests.py
│   └── views.py <--------- look & feel definition
└── vlmanui <------------ total system settings
    ├── manage.py
    └── vlmanui
        ├── __init__.py
        ├── settings.py  <---------- application directory
        ├── urls.py  <------------ URL entry point definition
        └── wsgi.py

↑

django ビルトイン管理ツール（= manage.py)†

ビルトイン Web サーバーの起動

[local] munakata:~/source/python/vlman/vlmanui$ python3 manage.py runserver 8000

↑

URL ディスパッチャー（パスコンバーターによるリインテリジェントな　URL ルーティング機構)†

path('abc/', include('(プロジェクト名).urls', name = 'reverse serch name')

http://aaa.com/abc/ の場合 abc/ の部分だけ記載する
include で各アプリの urls.py を読み込ませる

rpath(r'^abc*$', include('application name.urls'), name='reverse name')

正規表現を使ってパス変換する場合には rpath を使うと python の正規表現（re．）の構文が使える
name で逆引き（ URL をハードコードしないで済むように名前で参照させるために必要）

（プロジェクトルート）／（プロジェクト名）／urls.py <----- 自動で作成される
- プロジェクト全体のルーティング設定を書く
（プロジェクトルート）／（アプリケーションルート）／urls.py <----- 手動で作成する必要あり
- 各アプリケーション毎のルーティング（＝view との対応関係）

↑

Model (データー構造の定義）†

↑

Django における DB の扱い方（SQL 文は一切使わなくても良い）†

DjangoではORM（オブジェクト関係マッピング）を使ってデータベースを操作
DjangoのORMの実装は ActiveRecord パターンを採用
- モデルを設計すればマイグレーション機能でDB定義を自動作成する。
- SQLの記述は不要。モデルマネージャ経由でクエリを実行するとレコードをモデルのインスタンスとして扱える。
- クエリは人間に読みやすく命名されたマネージャメソッドの連鎖として表現する

↑

Django 外で作成した DB を利用するには制約がある場合も†

DJANGO で利用するデーターベースは model の中で予め紐付けて定義する必要がある
モデルフィールド設定テンプレート

DJANGO からデーターベースを操作する場合には、専用に用意された記述を用いる。ほぼ SQL 文を書くことは無い
- データベース操作まとめ

↑

model と DB の同期処理（＝migration)†

モデル変更時には以下のコマンドでデータベースに更新を反映する
- python3 manage.py makemigrations (アプリケーション名)
- python3 manage.py migrate

[local] munakata:~/source/python/vlman/vlmanui$ python3 manage.py makemigrations
Migrations for 'fview':
  fview/migrations/0001_initial.py
    - Create model Filedir

[local] munakata:~/source/python/vlman/vlmanui$ python3 manage.py migrate
Operations to perform:
  Apply all migrations: admin, auth, contenttypes, fview, sessions
Running migrations:
  Applying contenttypes.0001_initial... OK
  Applying auth.0001_initial... OK
  Applying admin.0001_initial... OK
  Applying admin.0002_logentry_remove_auto_add... OK
  Applying admin.0003_logentry_add_action_flag_choices... OK
  Applying contenttypes.0002_remove_content_type_name... OK
  Applying auth.0002_alter_permission_name_max_length... OK
  Applying auth.0003_alter_user_email_max_length... OK
  Applying auth.0004_alter_user_username_opts... OK
  Applying auth.0005_alter_user_last_login_null... OK
  Applying auth.0006_require_contenttypes_0002... OK
  Applying auth.0007_alter_validators_add_error_messages... OK
  Applying auth.0008_alter_user_username_max_length... OK
  Applying auth.0009_alter_user_last_name_max_length... OK
  Applying auth.0010_alter_group_name_max_length... OK
  Applying auth.0011_update_proxy_permissions... OK
  Applying fview.0001_initial... OK
  Applying sessions.0001_initial... OK

migration のリセット

アプリケーションディレクトリーにある migrations というフォルダーを削除

キャッシュデータのクリア

(vman) munakata@muna-E450:~/code/python/vman/vmanhmi$ python manage.py shell
Python 3.6.8 (default, Jan 14 2019, 11:02:34) 
[GCC 8.0.1 20180414 (experimental) [trunk revision 259383]] on linux
Type "help", "copyright", "credits" or "license" for more information.
(InteractiveConsole)
>>> from django.core.cache import cache
>>> cache.clear()

データーベースの中の django_migrations というテーブルから、該当アプリケーションのレコードを削除する

sqlite> select * from django_migrations;   <------- 該当アプリの変更履歴が記録されている
sqlite> delete from django_migrations where app='fview (=アプリ名)';
sqlite>.exit
(vman) munakata@muna-E450:~/code/python/vman/vmanhmi$ python manage.py makemigrations
(vman) munakata@muna-E450:~/code/python/vman/vmanhmi$ python manage.py migrate

manage.py showmigrations で該当アプリのマイグレーション履歴が消えている事を確認

manage.py makemigrations (アプリ名）で明示的にアプリ名を指定して migrations ファイルを生成
```
(vman) munakata@muna-E450:~/code/python/vman/vmanhmi$ python manage.py makemigrations fview
```

それでも migrate 処理がエラーになる場合には fake migrate を実行する

(vman) munakata@muna-E450:~/code/python/vman/vmanhmi$ python manage.py migrate --fake fview zero
(vman) munakata@muna-E450:~/code/python/vman/vmanhmi$ python manage.py migrate fview

(参考) manage.py migrateをおかしな感じにやってしまった

↑

pylint の Class '(クラス名)' has no 'objects' member エラー対策†

pip install pylint-django
vscode の設定 → ユーザー設定 (setting.json) に以下を記述
```
"python.linting.pylintArgs": [
     "--load-plugins=pylint_django"
],
```

↑

Django キャッシュクリア（データーベース更新時など）†

from django.core.cache import cache

cache.clear()

munakata@muna-E450:~/code/python/vman/vmanhmi$ python manage.py shell
Python 3.6.8 (default, Jan 14 2019, 11:02:34) 
[GCC 8.0.1 20180414 (experimental) [trunk revision 259383]] on linux
Type "help", "copyright", "credits" or "license" for more information.
(InteractiveConsole)
>>> from django.core.cache import cache
>>> cache.clear()

↑

View（ビジネスロジックの実装）†

Djangoのビューは以下の条件を満たす必要がある
- request オブジェクトを(第一引数として)受け取る
- callable であること
- response オブジェクトを返す

view には各アプリケーション内でデーターベース内のデータの操作（CRUD=新規作成、リード、更新、削除）を行うためのロジック（＝関数）を規定する
python の関数として定義する方法
python の Class として定義し、（クラス名）.as_view() でクラスをビュー関数化する方法　<--- こちらが推奨

↑

Template（Look & Feel の規定）†

↑

bootstrap4 の導入†

1) bootstrap

2) jquery

munakata@muna-E450:~/code/python/vman/vmanhmi$ tree
(project root)
├── fview (application root)
│   (snip)
│   ├── static  <------ 各アプリの下に専用の css/js を配置する
│   │   └── fview
│   │       ├── css
│   │       │   ├── bootstrap.min.css
│   │       │   └── bootstrap.min.css.map
│   │       └── js
│   │           ├── bootstrap.bundle.min.js
│   │           ├── bootstrap.bundle.min.js.map
│   │           ├── jquery-3.4.1.min.js
│   │           └── jquery-3.4.1.min.map

3) django-bootstrap4 のインストール
```
pip3 install django-bootstrap4
```

munakata@muna-E450:~/code/python/vman/vmanhmi$ pip install django-bootstrap4
Collecting django-bootstrap4
  Downloading https://files.pythonhosted.org/packages/02/5a/485d61f6dafa4e4d001a7880b04f40f04fe485a54b2756b0536ed2052342/django-bootstrap4- 0.0.8.tar.gz
Building wheels for collected packages: django-bootstrap4
  Running setup.py bdist_wheel for django-bootstrap4 ... done
  Stored in directory: /home/munakata/.cache/pip/wheels/f6/58/7f/fcdbcc8c631cc8f775cb8b9349ded99aff7a3f5b28e0f40ef3
Successfully built django-bootstrap4
Installing collected packages: django-bootstrap4
Successfully installed django-bootstrap4-0.0.8

bootstrap4 ボタン [#tc3adc6f]

↑

font-awesome †

my kit ID = f70a45d16f

<script src="https://kit.fontawesome.com/f70a45d16f.js"></script>

インストール

munakata@muna-E450:~/code/python/vman/vmanhmi$ pip install pipenv
munakata@muna-E450:~/code/python/vman/vmanhmi$ pipenv install django-fontawesome-5

(参考URL) django-fontawesome-5 1.0.16

↑

choice に対応した専用フォーム（ラジオボタン、ドロップダウンリストなど）†

Djangoフォームを使ってみよう

↑

url タグ（別画面へのリンク）= {% url '{namespace}:{name}' %}†

namespace = プロジェクト全体の urls.py に指定された名前

name = アプリケーションの urls.py に指定された名前

<a href="{% url 'fview:list_view' %}" class="btn btn-primary btn-sm my-3">ファイル一覧に戻る</a>

↑

url タグでページ遷移する時に引数を渡す方法†

第三引数に引数名、外側に該当する変数名を書く
```
<a href={% url 'app:table' table.id %}>{{ table.name }}</a>
```

Django - URLに引数を指定してページ遷移する

↑

<a タグを使って別ページへのリンクを指定するときには view で規定したメソッド名を使う†

下記の例では fview:detail_view は view 内でメソッド関数として定義した detail_view を呼び出している

   <a scope="row" href="{% url 'fview:detail_view' fid=vfile.file_ID %}" class="btn btn-outline-primary btn-sm">{{ vfile.file_ID }}</a>

アプリケーションの urls.py で name= で規定した名前が URL の逆引きに利用される
ここでは urls.py 内で規定した name と view 内のメソッド名が同じ、どちらを参照しているのかわからない！駄目実装だな

↑

画面遷移を伴わないイベントによるデータ操作†

template に POST 処理を書いて view で受け取る

<form action="" method="POST">
    {% csrf_token %}
    <button type="submit" class="btn btn-outline-success btn-sm">お気に入りに登録</button>
</form>

Djangoで、フォームの内容を保持する（セッションを使う方法)

↑

{% csrf_token %} = クロスサイトリクエストフォージェリ(CSRF) 対策†

POST 処理がエラーとして誤検出されないようにする目的で追加する必要がある

↑

画像の取扱い†

DJANGO は Instagram に使われているくらいなので写真のデーターベース検索に関する機能が充実しているが、ポイントはデータベースには実際の写真データは登録しないが DJANGO の操作としては DB に登録するように見せて実際にはファイル名、Media_Root からのパス名だけを DB に入れる仕組みを使っていること。このため DJANGO の view を使って写真を登録しないと写真が認識（＝検索）出来ない

画像を扱うには pillow というライブラリが必要

munakata@muna-E450:~/code/python/vmanhmi/fview/templates/fview$ pip install pillow
Collecting pillow
  Using cached https://files.pythonhosted.org/packages/d2/c2/f84b1e57416755e967236468dcfb0fad7fd911f707185efc4ba8834a1a94/Pillow-6.0.0-cp36-cp36m-manylinux1_x86_64.whl
Installing collected packages: pillow
Successfully installed pillow-6.0.0

プロジェクトルートディレクトリに media ディレクトリーを作成

settings.py に以下の行を追加

# media file for "pillow"
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'

ルート URL ルーティングファイル (urls.py) に以下の行を追加

# To support media directory path finding
from . import settings
from django.contrib.staticfiles.urls import static
from django.contrib.staticfiles.urls import staticfiles_urlpatterns

urlpatterns += staticfiles_urlpatterns()
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

model に画像を扱うための設定を追加（upload_toを’documents’にしておくことで、/media/documentsに画像が保存される）
```
class Document(models.Model):
    description = models.CharField(max_length=255, blank=True)
    photo = models.ImageField(upload_to='documents/', default='defo')
    uploaded_at = models.DateTimeField(auto_now_add=True)
```
ImageField 型を宣言することが重要な意味を持つ
- データが画像データであるかの validity check が行われる
- 更に実際の画像データ（バイナリー）はデーターベースには登録せず、実際のファイルの場所へのリンク情報を登録する

参考 URL

↑

画面分割 = boostrap4 のグリッドシステム†

container 領域内を水平方向に 12分割された領域に画面を分解可能　（例. 8 + 4 = 12)

<div class="container">
    <div class="row">
        <div class="col-lg-8">
            <div class="row">
                <div class="col-xs-6"></div>
                <div class="col-xs-6"></div>
                <div class="col-xs-6"></div>
                <div class="col-xs-6"></div>
            </div>
        </div>
        <div class="col-lg-4"></div>
    </div>
</div>

Bootstrapのグリッドシステムの使い方を初心者に向けておさらいする

↑

django/channels (websocket 実装)†