4
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

@smiler5617

DjangoでWebアプリ開発環境の構築（その②）

4
Last updated at Posted at 2021-08-01

はじめに

Webシステム開発をPythonでするために、新たにDjangoを学んでいる。
前回の記事では、インストールや起動の仕方など簡単なところをまとめたので、今回はその続きとして素材ファイルの配置やDB連携などについてまとめておく。

実行環境

【ローカルPC環境-OS】
　　・Windows 10 Pro　

【ソフト・パッケージ情報】
　　・Python3.9系 + Django3.2

手順

前提として、【DjangoでWebアプリ開発環境の構築（その①）】の記事より、以下を完了していること。

  • 仮想環境を作成してDjangoをインストール
  • Djangoの起動
  • サンプルアプリの起動

本記事では、以下の使い方を整理する。
１．STATICファイルの配置
２．DB連携
３．管理者画面からのDB操作

１．STATICファイルの配置

CSSやイメージファイルなどを配置しておく場所と、そのファイルなどの呼び出し方

上位の【プロジェクト名】フォルダの直下に、以下の様にフォルダを作成し、適当なjpgファイルを格納

  • manage.py
  • 【プロジェクト名】フォルダ
  • 【test_app】フォルダ 　※python manage.py startapp で作成した任意なアプリ名
  • 【html_template】フォルダ
  • 【static_files】 ← 今回作成したフォルダ
    • 【images】 ← 今回作成したフォルダ
      • sample_image.jpg　← 今回適当に置いたファイル
[プロジェクト名]\settings.py
# 省略--------------------------

# Build paths inside the project like this: BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
TEMP_DIR = os.path.join(BASE_DIR, 'temp'))
STATIC_DIR = os.path.join(BASE_DIR, 'static_files'))     # 前回記事（その①）からの追記部分

# 省略---------------------------

STATIC_URL = '/static/'
STATICFILES_DIRS = [         # 前回記事（その①）からの追記部分
    STATIC_DIR,
]

アクセス確認

　python manage.py runserverでDjangoを起動後、ブラウザで以下のURLにアクセスして画像が表示されればOK。
　　・http://localhost:8000/static/images/sample_image.jpg

試しにindex.htmlに埋め込み

tempフォルダのindex.html に以下の様に追記。

index.html
<!DOCTYPE html>
{% load static %}    <!-- 前回記事（その①）からの追記部分 -->
<html>
    <head>
        <meta charset="utf-8">
        <title>テストタイトル</title>
    </head>

    <body>
        <h1>見出し１</h1>
        {{ temp_str }}
        <br>
        <img src="{% static "images/sample_image.jpg" %}"  alt="イマージファイルが存在しません！">    <!-- 前回記事（その①）からの追記部分 -->

    </body>
</html>

アクセス確認

　python manage.py runserverでDjangoを起動後、ブラウザで以下のURLにアクセスして画像が表示されればOK。
　　・http://localhost:8000/
　　　※画像へのパスが間違っている場合、altに設定の値が表示される。

CSSなどの場合も同様に、以下の流れでできる。
　・static_filesの直下にcssフォルダを作成
　・cssフォルダ内に適当なcssファイルを作成
　・index.html に以下の様な行を追記。
　　　<link rel="stylesheet" href="{% static "css/【イメージファイル名】" %}">

２．DB連携

DjangoでDBとの連携を試したい場合、デフォルトではPythonに標準で組み込まれているSQLiteが設定されている。
接続先DBを別のものに切り替える設定は後述するとして、SQLiteを使ったDB連携を試してみる。

【アプリ名】/models.pyを編集する。

　※DBの設計を models.py で行っているイメージ。

test_app/models.py
from django.db import models

# Create your models here.
class Member(models.Model):
    member_name = models.CharField(max_length=256, verbose_name="ユーザーリスト", unique=True)
    sex = models.CharField(max_length=1)

    def __str__(self):
        return self.member_name


class SiteAccessCount(models.Model):
    site = models.URLField(unique=True)
    count = models.IntegerField()
    date = models.DateField()

    def __str__(self):
        return str(self.date)    # DATE型なのでキャストしている。


class Bloginfo(models.Model):
    blog_id = models.IntegerField()
    blog_title = models.CharField(max_length=256)
    name = models.ForeignKey(Member, on_delete=models.CASCADE)
    url = models.ForeignKey(SiteAccessCount, on_delete=models.CASCADE)

    def __str__(self):
        return self.blog_title

SQLに置き換えて考えると、以下の様なイメージで良さそう。
　class　⇒　テーブル
　class内の変数　⇒　テーブル内のカラム定義
　class内のdef ＿str＿　⇒　テーブルを参照した時の返り値（別のテーブルから参照したい場合、分かりやすくなる）

Modelsの使い方はこちらの記事が参考になった。
　https://qiita.com/kotayanagi/items/3cfadae951c407ac044a

DBのマイグレーション

python manage.py makemigrations temp_app コマンドより、モデルの移行情報を作成する。　⇒　<【アプリ名】/migrations/> 内に作成される。

python manage.py migrate コマンドより、上記のモデル以降情報を元にDBモデルを構築する ⇒　初回の場合 db.sqlite3 というファイルができる。ここにテーブル設定やデータが格納されていると想定。

　※djangoのマイグレーションについて補足
　　https://note.crohaco.net/2018/django-migration/
　　https://hodalog.com/how-to-reset-migrations/

adminサイトにDBモデルの登録

test_app/admin.py
from django.contrib import admin

# 以下追記部分
from first_app.models import Member, SiteAccessCount, Bloginfo

# Register your models here.
admin.site.register(Member)
admin.site.register(SiteAccessCount)
admin.site.register(Bloginfo)

adminサイトに入るためのスーパーユーザー作成

python manage.py createsuperuser

その後、ユーザー名、Email、パスワードなどを対話式に設定する。

python manage.py runserver で再度起動した状態で、ブラウザで下記のURLに接続して認証を通過できればOK！
　・http://localhost:8000/admin

Qiita-no048_img01.jpg

３．管理者画面からのDB操作

管理者画面からテーブルをいじってみる。
試しに Memberテーブル にユーザーを追加してみる。
Qiita-no048_img02.jpg

Qiita-no048_img03.jpg

Qiita-no048_img04.jpg

上記の様な感じで、GUIベースで色々と操作ができる。

上の段の Groups と Users はDBのアカウントやグループ。
管理者画面に入れるアカウントを増やす場合などは、ここに追加する感じ。
Qiita-no048_img05.jpg

＜おまけ＞ DB連携先の切り替え設定

今回の記事ではデフォルト設定のSQLiteを使ったが、連携先のDBを変える場合は、setting.pyを以下の様に編集する。
　※下記の設定は、事前にローカルにPostgreSQLを入れてDBを作成している

[プロジェクト名]\settings.py
DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.postgresql_psycopg2',
        'NAME': 'DB_NAME',
        'USER': 'USER_NAME',
        'PASSWORD': 'PASSWORD',
        'HOST': 'localhost',
        'PORT': 'ポート番号',
    }
}

また、テストデータの作成に Faker というライブラリが便利そうなので、メモとして残しておく。
https://faker.readthedocs.io/en/master/

4
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
4
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?