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

Pythonは機械学習やAI、スクレイピング、RTA、IoTたくさんのところで使われていて、習得もしやすく言語の教材はたくさんあるのにWEBアプリの教材ってそんなに多くない

せっかく便利な機能や分析できるようにしたならブラウザで見れたり、操作、データを入力したいですよね。
と言うことで、Flaskでアプリ作ってより役に立つものを世の中に出していきましょう！

内容ですが、以前Djangoで簡単なアプリ作りました。同じようなアプリをFlaskで作ろうと思います。

この記事と同じく全５回くらいで作成していこうと思います。

Pythonで作るFlaskアプリ記事一覧

	内容
part1	簡単なページ作成　← ココ
part2	HTMLテンプレート表示
part3	"画像" "CSS" "Javascript"実装
part4	フォーム送信
part5	データベースの値取得・更新

ソースコード

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

FlaskとDjango

よく比較されるこの二つです。

Django

✅ 大規模に開発する予定ある、バックエンドエンジニアとしてWEBアプリ開発を仕事にするなら
✅ 認証・セキュリティがデフォルトでそれなりに備わってる。
✅ Djangoの方が情報多い(日本語)ので機能をどんどん付け足したいなら
✅ ORMがデフォルトでくっついてる(データベース使いやすい)
✅ 汎用的な構成のWEBアプリ作りやすい
✅ 管理画面標準搭載。簡単なコード数行で画面ぽちぽちしながらデータベースにデータ追加・編集できる

Flask

✅ 軽量でそこそこ速い。処理最低限なのでカスタムしやすい(ルールほぼないので自由に書ける)
✅ 個人や小規模の開発、機械学習、AIがメインの人なら
✅ Pythonの書き方やルール勉強のため
✅ 覚えることが少ない。Python知ってればOK

くらいで考えればいいかなと思ってます。

違いを言うなら

Djangoは良くも悪くも最初から機能ありすぎてFlaskより覚えることが多く自由には書けない
Flaskは超最低限の機能でシンプル覚えること少なくて自由に書ける。ただし、便利機能は自分で書いたり追加で導入する必要がある。

Flaskは初心者の場合ならPythonの勉強、WEBアプリも作成してみたい場合に。中上級者でも時代的にもマイクロフレームワークは流れにあっているので良いと思います。

Djangoは、ルールに従わないといけないところはありますが、機能が豊富なのでWEBアプリ作るために知っておくべきことがよくわからなくても、作り方に従って作っていけばそれなりの質のWEBアプリを作れるようになります。

業務アプリ作る場合ならDjango。簡単なアプリをサクッと作りたいならFlask
業務レベルでがっつり見た目にも凝った開発なら、
モダンなフロントのフレームワーク使ってFlask, FastAPI, Django restframework(基本はDjangoでAPI作成するの便利にした拡張版みたいなもの)使うことになると思います。

その他のフレームワーク

Pythonのフレームワークだと最近FastAPIも人気です。Flaskと同じような軽量なのに名前通り処理が速く、最近の開発スタイルに適合しやすい工夫もあります。

モダンなフロントのフレームワークのReactとかVue.jsなどを使うためにPython使いたいならFastAPIは良いです。
ただ、そうでないなら今のところFlaskの情報多いので一つ作れるようになってからFastAPIに乗り換えるくらいでいいと思います。

0. 環境準備

仮想環境は今回pipenvを使用します。ちょうど入っていただけなのでanacondaでもvirtualenvでもOKです。
インストールするならbrew install pipenv or pip install pipenv実行してください。

以降何かをインストールするときは pipenv installを使用します。他の仮想環境ならpip installですので適時読み替えてください。

flaskと言うディレクトリ作ってその中に作っていこうと思います。もちろん適時変えてOKです。

$ mkdir flask
$ cd flask
$ pipenv shell
$ pipenv install flask

以下のバージョン作りました。

Python 3.9.7
Flask 2.0.2 (Released 2021-10-04)

詳しく見たい人は英語ですが公式ページ確認してください。

mkdirでフォルダ作成、touchでファイル作成です。今後使いますが別にコマンドで作成しなくてももちろんOKです。

1. 超簡単なアプリ試す

正確さとか最初はどうでもいいのでとりあえず動くものを作って、一つずつ積み重ねてブラッシュアップしていくのがプログラミングの極意だと思っているので、最初は超簡単なブラウザに好きな文字を表示させるだけのアプリ作ります。
flaskディレクトリの中にtestappディレクトリ作って__init__.py, views.pyをその中に作成します。

$ mkdir testapp
$ cd testapp
$ touch __init__.py
$ touch views.py

1.1. init.py

__init__.pyに以下のように記述します。

/Users/dev/flask/testapp/__init__.py

from flask import Flask

app = Flask(__name__)

import testapp.views

/Users/dev/flask/testapp/views.py

from testapp import app

@app.route('/')
def index():
    return 'Hellow World!'

views.pyに書いたappは__init__.pyで記述したFlask(__name__)でFlaskの機能を使うためのものです。
あとで試してみればわかってくると思いますが@app.route('/')なので、http://127.0.0.1:5000/つまりルートにアクセスしたときに表示するページの処理です。

1.2. 起動ファイル作成

プロジェクトの直下に起動用のファイルを作成。別にserver.pyと言う名前である必要はないですがサーバー起動するように使うので今回はこのような名前にしました。

$ touch /Users/dev/flask/server.py

testappの中(アプリの中)に作らないように。

/Users/dev/flask/server.py

from testapp import app

if __name__ == '__main__':
    app.run(debug=True)

server.pyがあるディレクトリにて以下のコマンド実行。ディレクトリは自分の環境に合わせてください。

$ pwd
/Users/dev/flask/
$ python server.py
 * Serving Flask app 'testapp' (lazy loading)
 * Environment: production
   WARNING: This is a development server. Do not use it in a production deployment.
   Use a production WSGI server instead.
 * Debug mode: on
 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
 * Restarting with stat
 * Debugger is active!
 * Debugger PIN: 105-954-295

http://127.0.0.1:5000/

ここにアクセスすればいいっすよ。と言うこと。

views.pyに書いた文字が表示されたらOKです。

Flaskでファイルを何個か作りましたが、ファイル名やディレクトリも自由に作れます。Djangoと違い最低限の機能・ルールのみなので自由にディレクトリやファイル名・構造で作れます。

1.2. 他のページを作ってみる

試しに他のページも作ってみましょう。

/Users/dev/flask/testapp/views.py

@app.route('/test')
def other1():
    return "テストページです！"

http://127.0.0.1:5000/test

/testを足してます。アクセスしたら文字が表示されます。

文字が変わりました。/testにアクセスするとother1関数を使う。で、その関数は「テストページです！」と返却するだけの処理をしているのでこのようなページになります。

2. configファイルに設定をまとめる

Flaskの開発では必須ではないですが、アプリで使う設定は専用のファイルにまとめておくほうが良いです。
今のところ設定はDEBUGモードでサーバーを起動するかの設定しかないです。でも今後も追加する可能性あるので作成しておきましょう。今回はアプリの中にconfig.pyという設定ファイルを作ろうと思います。

$ touch config.py

１行だけ追加します。

/Users/dev/flask/testapp/config.py

DEBUG = True

設定を記述したので元々書いてあったserver.pyの記述削除

/Users/dev/flask/server.py

from testapp import app

if __name__ == '__main__':
    app.run()

設定なので、アプリ開始する前に読み込んでもらう必要あります。__init__.pyに記述を追加します。

/Users/dev/flask/testapp/__init__.py

from flask import Flask

app = Flask(__name__)
app.config.from_object('testapp.config') # 追加

import testapp.views

Pythonで作るFlaskアプリ記事一覧

	内容
part1	簡単なページ作成　← ココ
part2	HTMLテンプレート表示
part3	"画像" "CSS" "Javascript"実装
part4	フォーム送信
part5	データベースの値取得・更新

ソースコード

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