LoginSignup
76

More than 1 year has passed since last update.

【Python Django】初心者プログラマーのWebアプリ

Last updated at Posted at 2018-06-17

人工知能○ Webアプリ情報X のPython

PythonのWebアプリケーションフレームワーク「Django」の初心者プログラマー用のwebアプリ作成チュートリアルです。

人工知能、ディープラーニング、機械学習…
興味がある人が増えていますが、せっかく画像認識機械学習、自然言語系の機械学習が完成してもアプリで使えなければ意味がないです。

機械学習では情報が豊富なPythonですが、Webアプリを作ろうとすると日本語では初心者には情報を集めるのも骨が折れるのが現状なのでこの記事を書きました。

内容が古くなったのでDjango 3で記事更新しました。 updated: 2021/09

:pushpin: Pythonで作るDjangoアプリ記事一覧

内容
part1 簡単な文字表示アプリを作る ← ココ
part2 HTMLテンプレート表示
part3 "画像" "CSS" "Javascript"実装
part4 フォーム送信
part5 データベースの値取得・更新
番外編 Django AWS デプロイ
APIサーバー編 Django REST frameworkとReact #4

他のPythonフレームワーク記事

Django以外のPythonWebフレームワークでも初心者向け記事書きました:blush:
Flask記事もよろしければ!

環境

  • Python 3.8.11
  • Django 3.2.7
  • Windows10

仮想化やインストールは詳しくは説明しません。
anaondaなどインストールして仮想環境つくってやるといいと思います。

https://www.anaconda.com/

今回はPythonのDjangoを使って簡単なWebアプリをつくります。
第一段は関数ビューで本当に基礎のWebアプリ。

Djangoをインストール

pip install django

使用するのはとりあえずDjangoだけなのでこれでOK。Anaconda使っていたらconda install djangoでも大丈夫だと思います。

Webアプリの基礎 ~とりあえずブラウザに好きな文字表示~

ソースコード

この章のコードは以下です。確認やコピペでどうぞ

アプリ作成

簡単な分かるものを組み合わせとりあえず動くものを作って積み重ねていくのがプログラミングの極意だと思っているのでブラウザで自分の好きな文字を表示させます。

Djangoのファイル入れるフォルダ作る。
C:\Users\○○○\django

コマンドプロンプトやMacならターミナルなどで作成したディレクトリで以下を実行しましょう。
プロジェクト(Djangoのアプリ使うのに必要なコード作ってくれる)が作成されます。

django-admin startproject testproject

何個かファイルが生成されます。
「testproject」はプロジェクト名です。わかりやすい名前にすればプロジェクト名は適当に決めてもいいと思います。

django-admin startproject <プロジェクト名> となっています。

さっき作ったフォルダに移動してmanage.pyでrunserver試してみましょう。
コマンドプロンプトで

cd testproject
python manage.py runserver

デフォルトで
http://127.0.0.1:8000

にブラウザに入力するとアクセス可能なので、アドレスバーに入力。

キャプチャ.JPG

こんな画面出たら成功。

例えば8080番のポートに変えたかったら python manage.py runserver 8080 でアクセスできるようになります。ほかのアプリケーションなどで使用されて動かないなどの場合にも使ってみてください。以下をアドレスバーに入れればアクセスできます。 http://127.0.0.1:8080

プロジェクト内にアプリを作成

またコマンドプロンプトに戻りアプリ作成。

python manage.py startapp <アプリ名>

今回は試しなのでwebtestappという名前でアプリを作成してみます。

python manage.py startapp webtestapp

独自のアプリ作るときは、アプリ名ですのですぐ分かるような名前にしたほうがいいと思います。

webtestappフォルダが作られてまたファイルがいくつかできました。

webtestappフォルダ内

キャプチャa.JPG

testprojectフォルダ内

キャプチャaa.JPG

testproject/testproject/settings.py
INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'webtestapp.apps.WebtestappConfig'  # 追加
]

アプリ名'webtestapp'を追加。頭のWとConfigのC最初大文字にしてます。

管理画面とか使わないなら必要ないんですが続いて、下の方にある項目も変更。
日本語設定です。

testproject/testproject/settings.py
LANGUAGE_CODE = 'ja'
TIME_ZONE = 'Asia/Tokyo'

では画面に単純にHello World!と表示させるWEBアプリを作っていきましょう。

testproject/webtestapp/views.py
from django.shortcuts import render
from django.http import HttpResponse

def index(request):
    return HttpResponse("Hello World!")

htmlファイルに「Hello World!」と書いて表示させたのと同じと思えばわかりやすいですかね。

C:\Users\○○○\django\testproject\testproject
の中のurls.py

testproject/urls.py
from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('webtestapp.urls'))
]

includeインポート足して <アプリケーション名>.urls
pathの後が空文字なので

http://127.0.0.1:8000/

にアクセスしたときにwebtestapp内のurls.pyを参照する。
ということになります。

つまり

C:\Users\○○○\django\testproject\webtestapp\urls.py
を作る必要あります。こらへん紛らわしいですね。

urls.pyが2つになるので直接このurls.pyに書いてもいいですが、どのアプリを使うか?という管理に使うファイルにしたほうが後々わかりやすいと思います。

django\testproject\webtestapp\urls.py
from django.urls import path
from . import views

app_name='webtestapp'

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

「''」空文字にアクセス。http://127.0.0.1:8000/
の場合には、さきほど編集したviews.pyのindex関数の内容を表示させています。

ついでに

django\testproject\webtestapp\urls.py
path('test', views.index, name='index'),

にすればhttp://127.0.0.1:8000/test
にアクセスしたときviews.pyのindex関数の内容を表示するということになります。

そして、views.pyのindex関数は

testproject/webtestapp/views.py
def index(request):
    return HttpResponse("Hello World!")

ただ「Hello World!」と表示させるだけ。
「request」はとりあえず書くという規則だと思ってください。

コマンドプロンプトで

python manage.py runserver

キャプチャds.JPG

path('', views.index, name='index'), なら http://127.0.0.1:8000/

path('test', views.index, name='index'),ならhttp://127.0.0.1:8000/test
にアクセスすれば文字が表示されます。

views.pyのHello World!変えれば当然文字も変わりますので試してみてください!

:pushpin: 一連の記事

内容
part1 簡単な文字表示アプリを作る ← ココ
part2 HTMLテンプレート表示
part3 "画像" "CSS" "Javascript"実装
part4 フォーム送信
part5 データベースの値取得・更新
番外編 Django AWS デプロイ
APIサーバー編 Django REST frameworkとReact #4

おわりに

この章のコードは以下です。確認やコピペでどうぞ

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
76