Django(Python)で初めてのWebアプリケーションを作る

Pythonの基本がわかっていれば、Webアプリケーションを作るのは難しくありません。

本当に？と思うかもしれませんが、簡単なWebアプリケーションを作るだけなら、作業はそれなりにありますが、１つ１つはそんなに難しくはありません。

実際に僕もDjangoを使って、Djangoサーバーと連携するiOSアプリを作りました。ちなみにこのアプリは、Django未経験だった僕が約1ヶ月で作ることができました。

あなたも同じようにやる気さえあれば、同じことができるはずです。頑張っていきましょう！

Djangoとは？

Webアプリケーションを作成するフレームワークとしてはRubyならRuby on Rails、PHPならLaravelなどが有名ですが、PythonならDjangoが一番有名です。Pythonを使ったことがある方なら、聞いたことがある人も多いのではないでしょうか。

DjangoはPythonで使えるフルスタック型のWebアプリケーションのフレームワークです。フルスタックというのは全部揃っているっていう意味です。Webアプリケーションに必要な機能を全部含んでいるってことですね。

こうしたフレームワークを使うことで、複雑で面倒な処理を書いたりする必要がなくなって、Webアプリケーションの制作がすごく楽になるというわけです。

ちなみに最近、Pythonの利用が増えているのは、いま流行りの機械学習やAIの作成がやりやすいということが大きな理由です。つまり、PythonでWebアプリケーションを作ったら、機械学習とかと連携がしやすいんですね。

こうした技術を使う予定があるのであれば、他の言語より、Pythonを覚えるのが効率がいいかと思います。

Djangoのインストール

環境構築が面倒！って方はこちらの記事も読んでみてください。3分もあればDjangoを使い始められます。

すでにPythonは環境に入っている前提でお話しします。あと、僕の使っているパソコンはmacOSなのでWindowsの説明をするのは難しいです…。

上の記事のサービスを使うとDjangoのインストールまで3分で終わるので初心者におすすめです。

まずは仮想環境を作成しましょう

仮想環境って何？と思うかもしれません。Pythonでは、パソコン全体の環境とは別に、独立した環境を作成することができます。この環境というのはインストールされているPythonパッケージが集まったものです。

開発プロジェクト毎に、他のプロジェクトから影響を受けない環境があると、依存関係がわかりやすくなりますし、変な干渉をしにくくなります。

また、仮想環境はコピーすることも簡単です。他のパソコンに持っていく場合に、この仮想環境ならこのプログラムは問題なく動くということがわかっていると、仮想環境を複製してすぐに動かすことができます。

特にWebアプリケーションでは、自分のパソコンからサーバーにインストールすることになるので、その時にどんな環境を設定したらいいかわかっていると楽ですよね。これがなかったら、どのパッケージをインストールしたらいいか悩んで、１つ１つ試しながらインストールしていくことになってしまいます。

そんなことをするのは面倒ですよね！というわけでDjangoアプリケーションを制作する時は、仮想環境で作業をすることにしましょう。

まずは、空の仮想環境を作成します。

今回、僕はskillaという名前でアプリケーションを作っていくので、skilla_venvという仮想環境を作ることにします。このskilla_venvのところをあなたの好きな仮想環境の名前に変えてコマンドライン/ターミナルから実行してください。

python3 -m venv skilla_venv

これで仮想環境が作成されました。現在のディレクトリに、先ほど入力した名前と同じフォルダが作成されているか確認してみてください。

次に、この仮想環境を使うように設定します。macOSでは、仮想環境が同じディレクトリにある状態で、以下のコマンドを実行することで、仮想環境内に入ることができます。

source skilla_venv/bin/activate

仮想環境に入っているかどうかは、ターミナルに仮想環境名が表示されるようになるのでわかりやすいです。

(skilla_venv) xxx $

ちなみにWindowsのコマンドラインから仮想環境に入る場合、以下のコマンドになるようです。

skilla_venv\Scripts\activate.bat

環境によってコマンドが変わってしまうので、うまくいかない場合は、以下のサイトを参考にしてください。

venv --- 仮想環境の作成
https://docs.python.org/ja/3/library/venv.html

これで新しいパッケージをインストールをするときには、この仮想環境にインストールされることになります。

これで事前準備は完了したので、早速Djangoでプロジェクトを作成していきましょう。

Djangoのインストール

さっそく、Djangoをインストールするところから始めていきましょう。

pip install django

このコマンドを入力するだけでインストールは完了します。非常に簡単ですね！

Djangoのプロジェクトを作成する

Djangoプロジェクトを作成するには以下のコマンドを使います。

django-admin startproject skilla

最後のskillaの部分はあなたの作りたいWebアプリケーションの名前にしてください。このコマンドを実行することで、skillaフォルダの中にDjangoフレームワークのプロジェクトが作成されます。フォルダ構成は以下のようになっているはずです。

# プロジェクトディレクトリ

skillaフォルダ
  |- __init__.py
  |- asgi.py
  |- settings.py
  |- urls.py
  |- wsgi.py
|- manage.py

ファイルがたくさん作られましたが、今は気にしなくても大丈夫です。必要になった時に、改めて説明していきます。

これでDjangoプロジェクトが作成されました。

Djangoのmanage.pyについて

Djangoでは[manage.py]というファイルでいろんなことができます。よく使うコマンドには、以下のようなものがあります。

#新しいアプリケーションを作成する
python manage.py startapp <アプリケーション名>

#開発用サーバーを立ち上げる
python manage.py runserver

#データベースの更新用ファイルを作成する
python manage.py makemigrations
#データベースの更新用ファイルを使ってデータベースを更新する
python manage.py migrate

#自動テストを実行する
python manage.py test

#プロジェクト内のアプリに管理権限を持ったユーザーを作成する
python manage.py createsuperuser

Djangoで何かする時は[manage.py]が起点になるので覚えておいてください。それぞれのコマンドについては必要になったらまた詳しく説明します。

ちなみに[python manage.py]とだけ入力すると他にどんなコマンドがあるか確認できますよ。

それではちゃんとインストールできたか確認するために、一度 Djangoの開発用サーバーを起動してみましょう。以下のコマンドを入力してください。

python manage.py runserver

このコマンドを入力すると開発用のサーバーが立ち上がります。

ちゃんとインストールできていれば、こんな感じの表示がでるはずです。このアドレスにアクセスするかhttp://localhost:8000/にアクセスすればこんな感じの初期ページが表示されます。

Djangoアプリケーションとは何か？

Djangoのプロジェクトを作成しましたが、ここにはまだアプリケーションがありません。アプリケーションというのは、Webアプリケーションの機能の単位のようなものだと、ざっくり理解してください。

ちなみに1つのアプリケーションに全ての機能を実装することも可能です。

でも、それだとファイルの1つ1つが大きくなって見にくいですし、そのアプリケーションの一部だけを、再利用したくなった時に、複雑すぎて難しくなってしまいます。

機能を細かい単位にわけておけば、他のWebアプリケーションを作りたくなった時に、必要な機能だけをコピーすることができます。すぐに機能が実装できるようになっているとすごい楽ですよね。できるだけ他のアプリケーションと独立して使えるようにしておきましょう。

Djangoアプリケーションを作成する

Djangoが動くためには最低１つのアプリケーションが必要になります。ということで以下のコマンドを使って最初のアプリケーションを作成しましょう。

#新しいアプリケーションを作成する
python manage.py startapp skills

このコマンドでskillsというアプリケーションが作成されます。フォルダ構成を確認すると以下のように変わりました。

#プロジェクトディレクトリ

skillaフォルダ
  |- __init__.py
  |- asgi.py
  |- settings.py
  |- urls.py
  |- wsgi.py
skillsフォルダ
  |- migrationsフォルダ
  |- __init__.py
    
  # アプリケーションの管理サイトを定義する
  |- admin.py
    
  # アプリケーションのコンフィグを定義する
  |- apps.py
    
  # アプリケーションのモデルを定義する
  |- models.py
    
  # アプリケーションのテストを定義する
  |- tests.py
    
  # ページの表示(view)を定義する
  |- views.py
    
manage.py

これでアプリケーションが作成されましたが、Djangoにこのアプリケーションを伝うことを伝えなければいけません。

skillaフォルダにあるsettings.pyにこのskillsアプリケーションを使用するように設定しましょう。このファイルの中に[INSTALLED_APPS]という変数があるのでそれを探します。

# settings.py

...省略...

INSTALLED_APPS = [
    ...省略...
]

...省略...

ここにskillsを設定するには、１行追加して以下のようにします。

# settings.py

...省略...

INSTALLED_APPS = [
    ...省略...
    'skills.apps.SkillsConfig',
]

...省略...

これはskillsアプリケーション内にあるapp.pyにあるSkillsConfigクラスを参照しています。

これでDjangoでskillsアプリケーションを使うようになりましたが、残念ながらskillsにはまだなんの機能もありません。

そこで一番単純な静的なページを作成するところから始めましょう。静的なページは、単純なhtmlファイルをそのまま表示するだけのシンプルなページです。

Djangoで静的なページを作成するためには、2つの要素が必要です。１つはルーティング、もう１つは何を表示するか決定するViewです。

まずはルーティングからはじめましょう。

Djangoのルーティング

Djangoのルーティングについて説明します。まずWebアプリケーションの処理というのは、ブラウザからアクセスしたアドレスによってほぼほぼ決まっています。ルーティングとは、どのアドレスで、何を表示させるか(View)をDjangoに伝えることを言います。

例えば、www.skilla.comというサイトがあったとして、www.skilla.comでどのViewを使うか、www.skilla.com/user/でどのViewを使うか、www.skilla.com/myskill/でどのViewを使うか。それぞれ指示していく感じです。

要するに、このアドレスにアクセスしたら、この処理をしてくださいって決めていくのがルーティングです。

Djangoのルーティングはプロジェクトのフォルダにある、urls.pyというファイルによって定義されています。この中にあるurlpatternsという変数にルーティング情報を追加することで、設定することができます。

ここにskillsアプリケーションのルーティング情報を追加します。

# urls.py

from django.urls import path, include

urlpatterns = [
    path('', include('skills.urls')),
    path('skills/', include('skills.urls')),
]

pathという関数が何をしているか説明するために、urlpatternsに2つのパスを追加しました。まず最初の引数で、アドレスを設定しています。つまり、Djangoアプリケーションがwww.skilla.comで動いているとしたら、そこに空の文字列わたしているので、www.skilla.comのままになります。

それでは、下のパスを使うとどうなるでしょうか？rootアドレスにskills/を足して、www.skilla.com/skills/となるわけですね。

pathの2番目の引数では、skillsアプリケーションにあるurls.pyからルーティング情報を追加するようにしています。このままプロジェクトのurls.pyにルーティング情報をそのまま書いてもいいのですが、アプリケーション毎にルーティング情報を設定するurls.pyがあるほうが、移植がしやすくなるのでこのようにしています。

ということで、skillsアプリケーションのurls.pyを参照するように設定したので、urls.pyファイルを作成して、skillsアプリケーションに追加しましょう。

# skills/urls.py

from django.urls import path
from . import views

app_name = 'skills'
urlpatterns = [
   path('', views.IndexView.as_view(), name='index'),
]

app_nameとurlpatternsという変数を追加することで、このアプリケーションのルーティングは完了です。

app_name変数ではアプリケーション名を設定しています。urlpatternsのpathだけの場合、他のアプリケーションで同じ'index'というnameのpathがあった場合、Djangoはどちらを使えばいいかわからなくなってしまいます。そんなときにapp_nameを追加情報として付与することで、このアプリケーションのindexだと正しく伝えることができるのです。(例："skills:index")

上記の理由から同じプロジェクト内では、このapp_nameが他のアプリケーションと被らない名前にしておきましょう。

(ちなみにnameが被らないようにname='skills_index'などと指定することもできますが、アプリケーション名を変更するときなどに面倒になってしまいます)

ファイル構成はこのようになりました。

skilla
|- ...省略
|- skillsフォルダ
    |- migrationsフォルダ
    |- __init__.py
    |- admin.py
    |- apps.py
    |- models.py
    |- tests.py
    |- urls.py
    |- views.py
    

このアドレスで何をするかは、path関数の2番目のパラメーターで設定しています。

# skills/urls.py

from django.urls import path
from . import views

app_name = 'skills'
urlpatterns = [
   path('', views.IndexView.as_view(), name='index'),
]

[from . import views]は同じフォルダにあるviews.pyをインポートしています。そしてviews.pyにあるIndexViewクラスをViewとして利用するように伝えています。

もちろん、このクラスはまだ作成していないので、これから作成します。

ここまでが1つ目のルーティングの作成です。

DjangoのViewの作成

さて、ようやくページに何を表示するか設定していくことができます。先ほども説明したように、表示される内容はviews.pyの中に書くことになります。

さっそくファイルを開いて編集していきましょう。

# skills/views.py

from django.views import generic

class IndexView(generic.TemplateView):
   template_name = "skills/index.html"

これだけです。[from django.views import generic]は、よく使う汎用的なViewを簡単に作ることができる関数です。generic.TemplateViewは単純なテンプレートの表示に使いやすいViewです。他にどんなViewがあるかは以下を参照してください。

django - ビルトインのクラスベースビュー API
https://docs.djangoproject.com/ja/3.1/ref/class-based-views/

テンプレートというのは、ページの雛型を事前に用意しておいて、一部分だけ変更したりして表示するファイルのことです。ピザを作る時に、まずベースとなるピザを選んで、そこからトッピングをつけたりするようなものです。このベースとなるピザがテンプレートです。

今回は静的ページを作るので、雛形から全く変わらないテンプレートになります。

DjangoのTemplateの作成

最後に、テンプレートを作成する必要があります。テンプレートはアプリケーション内のtemplatesフォルダに保存する必要があります。新しくtemplatesフォルダとindex.htmlファイルを作成しましょう。

注意点としてtemplatesフォルダの中に、さらにアプリケーション名のフォルダを作成しておくのが推奨されています。これは他のアプリケーションに同じ名前のテンプレートがあった場合に、最初に見つかった方が使われてしまうからです。そうした予期しない処理が行われてしまうのを避けるために、もう1階層フォルダを追加しておきましょう。

自分だけで作っていれば気づきやすいので、そこまで問題にはなりませんが、もし他の人が作ったアプリケーションを使いたいと思って使った時に、思わぬ問題になる可能性が出てきます。避けられそうな問題は避けておきましょう。

そのため、ファイル構成はこのようになりました。

#ディレクトリ
skilla
|- …省略
|- skillsフォルダ
    |- migrationsフォルダ
    |- templatesフォルダ
        |- skillsフォルダ
            |- index.html
    |- __init__.py
    |- admin.py
    |- apps.py
    |- models.py
    |- tests.py
    |- urls.py
    |- views.py

今回はただ表示するだけなので、index.htmlには最低限の情報だけ書いておきます。実際に使う場合は、ちゃんとしたhtmlの形式で作成してください。

それでは、index.htmlに以下を記入してください。

# skills/templates/skills/index.html
 
This is my skill application!

もはやhtmlではなく、ただのテキストファイルですが、表示できるかテストするだけならこれで充分です。

ここまでで、静的ページを表示するアプリケーションを作成することができました。

とはいえ、実際に動かしてみないと、どうなるのかわかりませんよね。というわけで、最後にdjangoの開発用サーバーを立ち上げて、index.htmlに設定した情報が正しく表示されるか確かめてみましょう。

Djangoの開発用サーバーは以下のコマンドで起動することができます。

python manage.py runserver

このコマンドを実行することであなたのパソコンにローカルサーバーが立ち上がり、現在どのような動きをするのか確認することができます。

このコマンドを実行した後、ブラウザからこのサーバーに接続してみましょう。以下のアドレスにアクセスして、[This is my skill application!]がちゃんと表示されれば成功です！

http://localhost:8000/

まとめ

ここまでで単純な静的ページを作成するアプリケーションを作成することができました。

最後に、アプリケーションを作るための流れを再確認しておきましょう。

# プロジェクト作成
django-admin startproject skilla

# skillaプロジェクトのフォルダに移動
cd skilla 
# アプリケーション作成
python manage.py startapp skills

# DjangoのINSTALLED_APPSにskillsを設定

# ルーティングの設定
  # urls.pyにpathを追加 
    # path('', include('skills.urls')),
  # skills/urls.pyにapp_nameを追加
  # skills/urls.pyのurlpatternsにpathを追加
    # path('', views.IndexView.as_view(), name='index'),

# Viewの設定
# skills/views.pyにIndexViewクラスを追加

# Templateの作成
# skills/templates/skills/index.htmlを作成

何かエラーが出たら、該当する部分をちゃんと設定したか確認して、１つ１つ問題がないか確認していきましょう。ブラウザでアクセスした際に、どこでエラーが発生しているか表示されるので、そこを読むのも大切です。

サンプルサイト

repl.itにここまで実施した内容を残しておきます。下のリンクにアクセスして、左側にあるCodeを選択すると、ファイル構成やファイルの内容を確認できます。

https://replit.com/@sonnenkorona/Django-Tutorial-first-app-creation

練習問題

1. この記事では、1ページだけ表示するアプリケーションを作成しました。このアプリケーションの別のアドレスに新しいページを追加してみましょう。

2. 下の"おまけ"のようにViewを関数で書いてみましょう。

3. 同じプロジェクトに別のアプリケーションを作成して、静的ページを表示できるようにしてみましょう。ちゃんとブラウザでアドレスを指定したらアクセスできますか？

おまけ

Viewはクラスで定義するのではなく、関数で定義することもできます。

その場合、以下のように設定します。このようにするとTemplateがなくても表示することができます。とりあえずページを作りたいだけなら、これだけでも充分です。

# views.py

from django.http import HttpResponse

def index(request):
   return HttpResponse("This is my skill application!")

この場合、urlpatternsの書き方が少し変わるので、urls.pyを少し変更する必要があります。

from django.urls import path
from . import views

app_name = 'skills'
urlpatterns = [
   path('', views.index, name='index'),
]