それでは下記の記事の続きをやっていこう！
👇前回は”Djangoの概要と環境構築”について学習してきました。
この記事ではDjangoとは？から始まりメリット&デメリットを把握した上で、開発に必要な環境構築の方法まで学べる内容にしました。
【Django1】Djangoの概要と環境構築
今回は、さっそくDjangoを使ってアプリケーションを作成していきます！
初心者目線で細かいところまでしっかり解説していくつもりですので、このブログからたくさん吸収しちゃってください。
ではさっそくやっていこう😎
まずはウルトラ簡単な、Webページに”Hello World”と表示させるということをやっていきたいと思います👇
え、それだけ？簡単じゃん！ と思った人も多いでしょう、しかし意外と最初は理解するのが大変だったりします。。なのでこれをできるようになればDjangoというフレームワークに関して最初の方は理解できたと言えると思います。まずここまでしっかり理解することで自身が作りたいアプリケーションへの応用ができるようになってきますので、しっかり学んでいきましょう✊
Contents
startprojectでDjangoフレームワークのファイル群を作成
✅ Djangoフレームワークが準備してくれているファイル群を生成する
✅ Djangoに標準装備されているパッケージやモジュールを使える状態にする
仮想環境でのstartproject
👇前回の記事で作った仮想環境内で、Djangoファイル群を作成します
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
# 今回は'~/django_tutorial'ディレクトリに'pyenv'という仮想環境を作りました。 # 起動させていきます。 [~] $ source ~/django_tutorial/pyenv/bin/activate # 'django_tutorial'に移動 (pyenv)[~] $ cd django_tutorial # 'django_tutorial'というDjangoファイル群を作成 (pyenv)[~/django_tutorial] $ django-admin startproject django_tutorial # 生成した'django_tutorial'のファイル構成を確認 (pyenv)[~<meta charset="utf-8">/django_tutorial] $ tree django_tutorial django_tutorial ├── django_tutorial │ ├── __init__.py │ ├── asgi.py │ ├── settings.py │ ├── urls.py │ └── wsgi.py └── manage.py |
“~/django_pjt/hello_pjt”にDjangoのファイルが生成されているのが確認できました。
Dockerでのstartproject
👇Dockerfile、docker-compose.ymlから環境を構築します(Dockerfile, docker-compose.ymlの例はこちら)
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<docker-compose.ymlの編集(一時的)> # docker-compose version version: '3' services: # Django application web: build: . volumes: - ./:/work/ network_mode: "host" environment: - DISPLAY=$DISPLAY privileged: true tty: true stdin_open: true # command: python3 ./django_tutorial/manage.py runserver 0.0.0.0:8000 # ←コメントアウト |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<Command> [~/Desktop] $ mkdir django_tutorial && cd django_tutorial [~/Desktop/django_tutorial] $ touch Dockerfile && docker-compose.yml [~/Desktop/django_tutorial] $ ls docker-compose.yml Dockerfile # =====Dokcerfile, docker-conmpose.ymlを編集==== # DockerfileからDocker imageを作成 [~/Desktop/django_tutorial] $ docker-compose build # imageとコンテナが作成されているか確認 [~/Desktop/django_tutorial] $ docker-compose ps Name Command State Ports ----------------------------------------------------------------------- django_tutorial_web_1 /usr/local/bin/nvidia_entr ... Exit 2 # 環境内に入る [~/Desktop/django_tutorial] $ docker-compose up -d [~/Desktop/django_tutorial] $ docker-compose exec web bash root@syatai02:/work# |
👇Djangoファイル群を作成します
|
1 2 3 4 5 6 7 8 9 10 |
# Djangoファイル群をDocker環境内に作成 root@username:/work# django-admin startproject django_tutorial root@username:/work# ls Dockerfile django_tutorial docker-compose.yml # データベース作成を実行 root@username:/work# cd django_tutorial root@username:/work/django_tutorial# python3 manage.py migrate root@username:/work/django_tutorial# ls db.sqlite3 django_tutorial manage.py # db.sqlite3というDjangoの標準が作成される |
以上でDocker環境内にDjangoのファイル群生成と環境構築ができました👏
次にrunseverオプションでローカルにアプリを起動させてみます👇
runserverでDjangoアプリを起動
✅ Webサーバーを簡単に立ち上げることができる
✅ ローカルホスト(自身の手元のPC)のみでWebにアクセスすることを可能にする
✅ Webブラウザで自身が実装したコードがどのように反映されているか確認することができる
仮想環境でのrunserver
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
# manage.pyがあるディレクトリに移動 (pyenv)[~/django_pjt] $ cd hello_pjt # manage.pyがあるか確認 (pyenv)[~/django_pjt/hello_pjt] $ ls hello_pjt manage.py # サーバーを起動 (pyenv)[~/django_pjt/hello_pjt] $ python3 manage.py runserver # 実行結果 Watching for file changes with StatReloader Performing system checks... System check identified no issues (0 silenced). You have 18 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions. Run 'python manage.py migrate' to apply them. July 27, 2021 - 14:28:44 Django version 3.2.5, using settings 'hello_pjt.settings' Starting development server at http://127.0.0.1:8000/ Quit the server with CONTROL-C. |
runserverコマンドを実行すると”http://127.0.0.1:8000/“のURL(localhostという)でサーバーが立ち上がったのが分かる。
Dockerでのrunserver
👇先程、docker-compose.ymlファイルでコメントアウトした部分を解除し、docker-composeコマンドでrunserverが走るようにしていきます
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<docker-compose.ymlの編集> # docker-compose version version: '3' services: # Django application web: build: . volumes: - ./:/work/ network_mode: "host" environment: - DISPLAY=$DISPLAY privileged: true tty: true stdin_open: true command: python3 ./django_tutorial/manage.py runserver 0.0.0.0:8000 # ←コメントアウトを解除 |
👇Djangoアプリを起動していきます
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<Command> # docker環境内に入る [~/Desktop/django_tutorial] $ docker-compose up Recreating django_tutorial_web_1 ... done Attaching to django_tutorial_web_1 web_1 | web_1 | ================ web_1 | == TensorFlow == web_1 | ================ web_1 | web_1 | NVIDIA Release 20.02-tf2 (build 9892252) web_1 | TensorFlow Version 2.1.0 web_1 | You have 18 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions. web_1 | Run 'python manage.py migrate' to apply them. web_1 | November 10, 2021 - 21:57:49 web_1 | Django version 3.2.9, using settings 'django_tutorial.settings' web_1 | Starting development server at http://0.0.0.0:8000/ web_1 | Quit the server with CONTROL-C. |
runserverコマンドを実行すると”http://0.0.0.0:8000/“のURL(localhostという)でサーバーが立ち上がったのがわかります。
このURLを使ってブラウザ上でアクセスしてみると、Djangoアプリのデフォルト画面が表示されるのを確認できました👏
startappでアプリのフォルダ群を生成
※ここからは仮想環境でもDockerでも一緒なのでまとめて書いていきます。
👇アプリケーションのフォルダ群を作成
|
1 2 3 4 5 6 7 8 9 |
<Command> # dockerで環境構築した人は以下を新しいターミナルで叩くことでbashシェルにアクセスすることができる [~/Desktop/django_tutorial] $ docker-compose exec web bash # 仮想環境で構築した方は不要 # アプリケーションのフォルダ群を作成 root@username:/work/django_tutorial# python3 manage.py startapp app root@username:/work/django_tutorial# ls app db.sqlite3 django_tutorial manage.py # appというアプリケーションのフォルダ群が生成される |
settings.pyファイルの設定
早速、Djangoのファイル群を触って開発のための準備をしていきます。
Djangoのアプリケーションの様々な設定をしているファイルになります。
ここではデフォルトで設定変更する箇所をピックアップして設定していきたいと思います。
タイムゾーンと言語の設定
デフォルトでUSになっているので、日本と日本語に変更していきます。
|
1 2 3 4 5 6 |
# <変更前> LANGUAGE_CODE = 'en-us' TIME_ZONE = 'UTC' # <変更後> LANGUAGE_CODE = 'ja' TIME_ZONE = 'Asia/Tokyo' |
アプリケーションの登録
👇『INSTALLED_APPS』にアプリケーションの構成情報を登録するために追加していきます。
ここではアプリ名を”app”としておきます。
|
1 2 3 4 5 6 7 8 9 10 |
<settings.py> INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'app.apps.AppConfig', # ←追加(app/apps.pyファイルのAppConfigクラスを指定) ] |
テンプレートの登録
『TEMPLATES』に.htmlファイルのパスを設定します。
※本来であればUIはHTML(.htmlファイル)に記載しますが、今回はviews.pyのHttpResponseメソッドの引数に直接記述するので不要です
staticディレクトリの登録
CSS,JS,imageファイルを格納しておく”staticファイル”のパスを設定します。
※今回はCSSの設定は不要です
おまけ
✅SECRET_KEY: ユーザーがパスワードを設定する際に使われる値(触らない)
✅DEBUG: 開発中⇨True、デプロイ後⇨Falseに設定。Trueの場合、ブラウザ上にエラーコードが表示される。開発中は便利だが、デプロイ後はセキュリティの観点から、必ずFalseに変更しておく。
✅ALLOWED_HOST: DjangoアプリがどのIPアドレスからの情報を受信するかを設定できる。ホストPCのみでアプリを使う場合は追記する必要がないが、別のサーバーで起動する場合はそのPCのどのIPアドレスから情報をもらうか指定する必要がある。
⚠アプリ起動の際、python3 mange.py runserverの後に’0.0.0.0:8000‘と記述すると、入力したIPでアプリ理側にアクセスすることができる。
⇨その際にはALLOWED_HOST = [‘0.0.0.0:8000’] を設定
✅ROOT_URLCONF: Djangoアプリからのリクエストを受け取った時にどのURLからviews.pyにアクセスしてレスポンスを返すかの設定(基本的には触らなくてOK)
admin.pyファイル
✅GUIでのデータベース管理画面にmodels.pyで記載したどのクラスを登録するか指定する
※今回はDBの設定は不要です
urls.pyファイル
✅ブラウザからリクエストを受け取った時にviews.pyに指示を出すための設定
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<django_tutorial/django_tutorial/urls.py> from django.contrib import admin from django.urls import path, include urlpatterns = [ path('admin/', admin.site.urls), path('', include('app.urls')) ] <django_tutorial/app/urls.py> from django.contrib import admin from django.urls import path, include from . import views urlpatterns = [ path('app/', views.helloworldview) ] |
models.pyファイル
✅DBの構成を定義する
※今回はDBの設定は不要です
views.pyファイル
✅UI(画面)にどの画面(.html)を表示させるのかを指示する
|
1 2 3 4 5 6 7 8 |
<django_tutorial/app/views.py> from django.http.response import HttpResponse from django.shortcuts import render # Create your views here. def helloworldview(request): return HttpResponse('Hello World!') # Hello World!を画面に表示させるよう記述 |
ここまで記述ができたらWebサイトを立ち上げてみましょう、ターミナルを開いて起動していきます👇
|
1 2 3 4 5 6 7 8 9 10 11 |
<Terminal> root@e6b57b8957a6:/work/django_tutorial# python3 manage.prunserver Watching for file changes with StatReloader Performing system checks... System check identified no issues (0 silenced). December 16, 2021 - 18:43:17 Django version 3.2.10, using settings 'django_tutorial.settings' Starting development server at http://127.0.0.1:8000/ # サイトにアクセス Quit the server with CONTROL-C. |
👇Webサイトに”Hello World!”を表示させることができました。
以上になります、いかがだったでしょうか？
“Hello World”を表示させるだけでも様々なファイルをいじる必要があり、初めて触った方は大変だったんじゃないでしょうか？
今回はただの文字列を表示させただけでしたが、実際に複雑なUIのアプリケーションを作る時にはやらなければならないことが沢山あります。
これから少しずつ覚えていきましょう！
今回はここまでです、ばいばい👋
コメントを残す