はじめに
フロントエンドエンジニアが認証周りの学習のために、あまり手間をかけずにWebアプリケーション環境を構築したかった
どうやらPythonのFlaskというフレームワークが良いらしい
目標
- Flaskでローカルwebサーバ環境の構築
- 作成済みフロントエンド開発環境のbuild資材と連携
- Flask webサーバ起動時のルートでbuild資材をブラウザ表示する
- （※認証周りは次回）
Flaskとは
- Python用マイクロフレームワーク
- 非常に軽量
- カスタマイズ性が高い
- 利用用途としてはBotなどの簡単なアプリやAPIサーバなどに使用されることが多い
- Flaskは軽量 <=> Djangoは大規模サービス向き
ローカル環境構築
Python実行環境の構築は省略
今回はpyenvでPython3.5.2をインストールし使用
資材階層
proj
├── app // Flask webサーバ用モジュール
├── front // フロントエンド開発資材
├── public // フロントエンドBuild資材
└── main.py // webサーバ起動タスク
Flaskセットアップ
今回の目標到達までは、思っていたよりずっと簡単だった
1. pip install Flask
Python3でも標準で使えるパッケージ管理ツール
まずはFlaskパッケージをインストール
カレントディレクトリはprojで
$ pip install Flask
2. Flask実行タスクを記述
用意するタスク
- webサーバ立ち上げ
- フロントエンドbuild資材(public/index.html)をルート表示する
main.py
# -*- coding: utf-8 -*-
import os
from app.index import app
if __name__ == '__main__':
app.run(host=os.getenv('APP_ADDRESS', 'localhost'), port=8000)
main.pyではwebサーバの立ち上げのみ
そのほかの機能・設定はapp/index.pyに取りまとめてみる
app/index.py
# -*- coding: utf-8 -*-
import os
from flask import Flask
from app import static
app = Flask(__name__)
app.register_blueprint(static.app)
@app.route('/')
def index():
return static.app.send_static_file('index.html')
app/index.pyでは、HelloWorld程度最小限の設定を記述
@app.route('/')デコレータをつけて、ルート表示した際に何を返すかを実装している
app/static.py
# -*- coding: utf-8 -*-
from flask import Blueprint
app = Blueprint('public', __name__, static_url_path='', static_folder='../public')
app/static.pyではpublic/配下をルート表示するための設定を記述
static.pyから見て相対パスでpublic/階層を記述してみた
3. webサーバ起動
$ python main.py
* Serving Flask app "app.index" (lazy loading)
* Environment: production
WARNING: Do not use the development server in a production environment.
Use a production WSGI server instead.
* Debug mode: off
* Running on http://localhost:8000/ (Press CTRL+C to quit)
（WARINING出てるけど後回し、、、）
起動したようなので http://localhost:8000/ で確認
期待通り、public/index.htmlがブラウザに表示された
余談: Dockerにのせてみた
Docker構築は前記事の通り
Dockerfile
FROM python:3.5.2
RUN pip install Flask
COPY main.py .
COPY ./app/ ./app
COPY ./public/ ./public
CMD ["python", "main.py"]
今後の展開
ここまでは想定以上にスムーズにできた、
次回はflask環境にjwtやベーシック認証などを実装していこうと思う