.NET開発者のためのブログメディア
PythonでのWebアプリ作成方法とは？Djangoを利用したWebアプリ作成方法を解説
- SE
- 初心者でも簡単にWebアプリが作れると聞いたのですが。
- PM
- テンプレートをダウンロードし、カスタマイズすれば初心者でも簡単に作れます。ここでは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アプリが作成できました。
- SE
- これならPython初心者でも簡単にアプリが作成できますね。
- PM
- 『モデルの作成、モデルのデータベースへの反映、画面表示の変更』この3つができれば、誰でもアプリ開発が可能です。
まとめ
いかがでしたでしょうか。PythonでのWebアプリ作成方法について説明しました。WebアプリのフレームワークであるDjangoを利用することで、簡単にWebアプリを作成することができます。
ぜひご自身でPythonのソースコードを書いて、理解を深めてください。
Search キーワード検索
Popular 人気の記事
-
【VB.NET入門】DataGridViewの使い方まとめ
公開: 更新:
reccomended おすすめ記事
-
【.NETが統合】.NET 5の概要と今後のリリース予定
公開: 更新:
Categories 連載一覧
Tags タグ一覧
Jobs 新着案件
-
開発エンジニア/東京都品川区/【WEB面談可】/在宅ワーク
月給29万～30万円東京都品川区(大崎駅) -
遠隔テストサービス機能改修/JavaScript/東京都港区/【WEB面談可】/テレワーク
月給45万～60万円東京都港区(六本木駅) -
病院内システムの不具合対応、保守/東京都豊島区/【WEB面談可】/テレワーク
月給30万～30万円東京都豊島区(池袋駅) -
開発/JavaScript/東京都豊島区/【WEB面談可】/テレワーク
月給50万～50万円東京都豊島区(大塚駅) -
債権債務システム追加開発/東京都文京区/【WEB面談可】/在宅勤務
月給62万～67万円東京都文京区(後楽園駅)