PythonでのWebアプリ作成方法とは?Djangoを利用したWebアプリ作成方法を解説
- システム
エンジニア - 初心者でも簡単にWebアプリが作れると聞いたのですが。
- プロジェクト
マネージャー - テンプレートをダウンロードし、カスタマイズすれば初心者でも簡単に作れます。ここではPythonでのWebアプリ作成方法を見ていきましょう。
PythonでのWebアプリ作成方法とは?
今回は、PythonでのWebアプリ作成方法について説明します。ここでは、PythonのWebアプリのフレームワークである「Django」を利用します。
Webアプリのフレームワークを利用することで、短期間でWebアプリを構築できます。Djangoの開発環境は構築済みである前提とします。
PythonでのWebアプリ作成方法に興味のある方はぜひご覧ください。
プロジェクト・アプリの作成
Djangoのプロジェクトを作成します。以下のコマンドを実行します。今回は「mysite」というプロジェクトにします。
1
|
~$ django-admin startproject mysite
|
mysiteディレクトリが作成されるので移動して、Webアプリを作成します。今回は「myuser」というWebアプリにします。
1
2
|
~$ cd mysite
~/mysite$ python3 manage.py startapp myuser
|
mysite/mysite/settings.pyというPythonのファイルにアプリ名を追記します。
1
2
3
4
5
6
7
8
9
|
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'myuser',
]
|
マイグレーション
次に、モデルを作成します。
mysite/myuser/models.pyというPythonのファイルにモデルの情報を記述します。今回はユーザ名、年齢、Emailアドレスを管理するWebアプリとします。
1
2
3
4
5
6
|
from django.db import models
class MyUser(models.Model):
username = models.CharField(max_length=50)
age = models.IntegerField()
email = models.EmailField()
|
モデルを記述したら、マイグレーションを行います。以下のコマンドを実行します。
1
2
|
~/mysite$ python3 manage.py makemigrations myuser
~/mysite$ python3 manage.py migrate
|
管理サーバ
DjangoでWebアプリを作成する場合、管理サーバも利用すると便利です。管理サーバはWeb画面からテーブルのCRUDができます。
以下のコマンドを実行し、必要な情報を入力します。
1
2
3
4
5
|
~/mysite$ python3 manage.py createsuperuser
Username (leave blank to use 'ubuntu'): admin
Email address: xxxx@xxxx.com
Password:
Password (again):
|
mysite/myuser/admin.pyというPythonのファイルに以下を記述します。
1
2
3
4
|
from django.contrib import admin
from .models import MyUser
admin.site.register(MyUser)
|
以下のコマンドでサーバを起動します。
1
|
~/mysite$ python3 manage.py runserver
|
Webブラウザから以下のURLにアクセスします。※自分の環境に合わせて記述してください。
http://${ホスト名}:8000/admin/
ルーティング
ルーティングを設定します。
mysite/mysite/urls.pyに以下を記述します。
myuserとadminのpathを設定します。空文字の場合は、myuserにリダイレクトします。
1
2
3
4
5
6
7
8
9
|
from django.urls import include, path
from django.contrib import admin
from django.views.generic import RedirectView
urlpatterns = [
path('myuser/', include('myuser.urls')),
path('admin/', admin.site.urls),
path('', RedirectView.as_view(url='/myuser/')),
]
|
また、mysite/myuser/urls.pyを新規作成します。Webアプリごとのルーティングを設定します。以降で説明するviewに対応するように記述します。
1
2
3
4
5
6
7
8
9
10
11
|
from django.urls import path
from . import views
app_name = 'myuser'
urlpatterns = [
path('', views.index, name='index'),
path('create', views.create, name='create'),
path('<int:id>/delete', views.delete, name='delete'),
]
|
viewの設定
viewを設定します。
mysite/myuser/views.pyに以下を記述します。indexでユーザ一覧を表示し、createで新規ユーザを作成、deleteでユーザを削除します。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
from django.shortcuts import render, get_object_or_404
from django.http import HttpResponseRedirect, HttpResponse
from django.urls import reverse
from .models import MyUser
from .forms import PostForm
# Create your views here.
def index(request):
posts = MyUser.objects.all()
form = PostForm()
context = {'posts': posts, 'form': form, }
return render(request, 'myuser/index.html', context)
def create(request):
form = PostForm(request.POST)
form.save(commit=True)
return HttpResponseRedirect(reverse('myuser:index'))
def delete(request, id=None):
post = get_object_or_404(MyUser, pk=id)
post.delete()
return HttpResponseRedirect(reverse('myuser:index'))
|
HTML作成
HTMLを作成します。
mysite/myuser/templates/myuser/index.htmlを新規作成します。ディレクトリも作成してください。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
{% load static %}
<!DOCTYPE html>
<html>
<head>
<title>User List</title>
<!-- CSS And JavaScript -->
<link rel="stylesheet"
href="//fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
<link rel="stylesheet"
href="//cdn.rawgit.com/necolas/normalize.css/master/normalize.css">
<link rel="stylesheet"
href="//cdn.rawgit.com/milligram/milligram/master/dist/milligram.min.css">
</head>
<body>
<div class="container">
<h1>User List</h1>
{% if error_message %}<p><strong>{{ error_message }}</strong></p>{% endif %}
<form action="{% url 'myuser:create' %}" method="post">
{% csrf_token %}
<div class="form-group">
<label for="myuser" class="col-sm-3 control-label">Name</label>
<div class="col-sm-6">
{{ form.username }}
</div>
</div>
<div class="form-group">
<label for="myuser" class="col-sm-3 control-label">Age</label>
<div class="col-sm-6">
{{ form.age }}
</div>
</div>
<div class="form-group">
<label for="myuser" class="col-sm-3 control-label">Email</label>
<div class="col-sm-6">
{{ form.email }}
</div>
</div>
<!-- Add User Button -->
<div class="form-group">
<div class="col-sm-offset-3 col-sm-6">
<button type="submit" class="btn btn-primary">
<i class="fa fa-plus"></i> Add User
</button>
</div>
</div>
</form>
<h2>Current Users</h2>
<table class="table table-striped myuser-table">
<thead>
<th>Name</th><th>age</th><th>Email</th><th> </th>
</thead>
<tbody>
{% for post in posts %}
<tr>
<td>
<div>{{ post.username }}</div>
</td>
<td>
<div>{{ post.age }}</div>
</td>
<td>
<div>{{ post.email }}</div>
</td>
<td>
<form action="{% url 'myuser:delete' post.id %}" method="post">
{% csrf_token %}
<button>Del user</button>
</form>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</body>
</html>
|
モデルフォーム
モデルフォームを作成します。
mysite/myuser/forms.pyというPythonのファイルを新規作成します。
1
2
3
4
5
6
7
8
|
from django import forms
from .models import MyUser
class PostForm(forms.ModelForm):
class Meta:
model = MyUser
fields = ('username', 'age', 'email')
|
‘username’, ‘age’, ‘email’を送信します。
動作確認
サーバを起動して、Webアプリの動作確認をします。
1
|
~/mysite$ python3 manage.py runserver
|
以下のURLにアクセスしてください。
http://${ホスト名}:8000/
自由にユーザを作成・削除してみてください。PythonでWebアプリが作成できました。
- システム
エンジニア - これならPython初心者でも簡単にアプリが作成できますね。
- プロジェクト
マネージャー - 『モデルの作成、モデルのデータベースへの反映、画面表示の変更』この3つができれば、誰でもアプリ開発が可能です。
まとめ
いかがでしたでしょうか。PythonでのWebアプリ作成方法について説明しました。WebアプリのフレームワークであるDjangoを利用することで、簡単にWebアプリを作成することができます。
ぜひご自身でPythonのソースコードを書いて、理解を深めてください。
FEnet.NETナビ・.NETコラムは株式会社オープンアップシステムが運営しています。
株式会社オープンアップシステムはこんな会社です
秋葉原オフィスには株式会社オープンアップシステムをはじめグループのIT企業が集結!
数多くのエンジニアが集まります。
-
スマホアプリから業務系システムまで
スマホアプリから業務系システムまで開発案件多数。システムエンジニア・プログラマーとしての多彩なキャリアパスがあります。
-
充実した研修制度
毎年、IT技術のトレンドや社員の要望に合わせて、カリキュラムを刷新し展開しています。社内講師の丁寧なサポートを受けながら、自分のペースで学ぶことができます。
-
資格取得を応援
スキルアップしたい社員を応援するために資格取得一時金制度を設けています。受験料(実費)と合わせて資格レベルに合わせた最大10万円の一時金も支給しています。
-
東証プライム上場企業グループ
オープンアップシステムは東証プライム上場「株式会社オープンアップグループ」のグループ企業です。
安定した経営基盤とグループ間のスムーズな連携でコロナ禍でも安定した雇用を実現させています。
株式会社オープンアップシステムに興味を持った方へ
株式会社オープンアップシステムでは、開発系エンジニア・プログラマを募集しています。
年収をアップしたい!スキルアップしたい!大手の上流案件にチャレンジしたい!
まずは話だけでも聞いてみたい場合もOK。お気軽にご登録ください。
新着案件New Job
-
開発エンジニア/東京都品川区/【WEB面談可】/在宅ワーク
月給29万~30万円東京都品川区(大崎駅) -
遠隔テストサービス機能改修/JavaScript/東京都港区/【WEB面談可】/テレワーク
月給45万~60万円東京都港区(六本木駅) -
病院内システムの不具合対応、保守/東京都豊島区/【WEB面談可】/テレワーク
月給30万~30万円東京都豊島区(池袋駅) -
開発/JavaScript/東京都豊島区/【WEB面談可】/テレワーク
月給50万~50万円東京都豊島区(大塚駅) -
債権債務システム追加開発/東京都文京区/【WEB面談可】/在宅勤務
月給62万~67万円東京都文京区(後楽園駅) -
PMO/東京都豊島区/【WEB面談可】/在宅勤務
月給55万~55万円東京都豊島区(池袋駅)