# flaskで作るweb application入門 Day1　 - 7/31　早大本庄プログラミング合宿　1日目 講義資料 - MywebでHTML等をやった方はその続き的な立ち位置になります。 - HTML/CSSも書きます。 [Flask quickstart](https://flask.palletsprojects.com/en/1.0.x/quickstart/) ## setup ``` # windowsならanacondaの仮想環境、Mac\Linuxならターミナル・コマンドラインをお勧めします。 $ pip install flask ``` ## webサーバとは何か? 企業などがずっと動かし続けている巨大なPCのようなもの。 プログラムを動作させ続けて、何か来るのを「待って」いる。 ユーザから「リクエスト」と呼ばれる情報を受け取り、処理した結果を返す。 処理した結果を表示するアプリケーションをwebブラウザと呼ぶ。 ## Hello world! ユーザからは何も情報を受け取らず、Hello world と表示するプログラム。 ``` # hello_flask.py from flask import Flask app = Flask(__name__) @app.route('/') def hello(): return 'Hello, World!' ``` Linux コマンド ``` export FLASK_APP=hello_flask.py flask run or python -m flask run ``` Windowsの場合(exportをsetに変えるだけ) ``` set FLASK_APP=hello_flask.py set FLASK_ENV=development flask run ``` Windows + powershell の場合 ``` $env:FLASK_APP = "flask_test.py" flask run ``` で、http://127.0.0.1:5000 を開く。 127.0.0.1 はサーバのIPアドレス(自分自身は127.0.0.1)。 5000はサーバのポート番号。 今は自分のパソコンをサーバにしてアクセスしている。 ## 簡単な概要説明 ``` app = Flask(__name__) ``` Flaskという型のオブジェクトを生成する。 ``` @app.route('/') ``` webを表示するURLを指定する。'/'の場合は、ipアドレスorドメインとport番号のみを指定すればよい。 ## URL Routing webのURLを何にするか決める。 > これが楽なので、合宿ではflaskにした。ファイル構造やurl指定がDjangoだと難しいと感じる人もいるため。 ``` # hello_flask.py を以下のように書き換え @app.route('/') def index(): return 'Index Page' @app.route('/hello') def hello(): return 'Hello, World' ``` ## URLからユーザのリクエストを受け取る 以下のURLの"ri_0x145"部分はリクエスト。たまにURL部分を見ると意味が分かる文字列になっていることがありませんか? https://twitter.com/ri_0x145 1. twitter.comは "ri_0x145"というリクエストを受け取る。 1. 文字列"ri_0x145"を変数に代入する。 1. ユーザ"ri_0x145"の情報を格納しているDatabaseから情報をとってくる。 1. フォーマットに当てはめて表示。 ``` from flask import escape @app.route('/user/<username>') def show_user_profile(username): # show the user profile for that user return 'Hello User %s !' % escape(username) ``` http://127.0.0.1:5000/user/ryoiijima 等と入力してみる。 ## (復習) HTML ここから先は、HTMLを利用してwebページを表示する。 通常のHTMLファイル。 ``` % hello.html <html> <header><title>This is title</title></header> <body> Hello world! </body> </html> ``` 表示される値が固定。 ## Renderingとは - htmlの中に変数を用意して、ユーザから受け取った値を表示すること。 - 変数入りのhtmlをテンプレートという。flaskでは、Jinja2というテンプレートフォーマットを使用している。 - [Jinja2 Template Documentation](http://jinja.pocoo.org/docs/2.10/templates/) - ユーザから受け取った値によって表示が変化すること:「動的」 - いつも同じwebページを表示すること: 「静的」 [阿部寛のホームページ(静的)](http://abehiroshi.la.coocan.jp/) [twitter(動的)](https://twitter.com) <= webフレームワークで作ろうとするもの ### Linuxコマンドでの作業 ``` mkdir application cd application mkdir templates ``` applicationフォルダ内に \_\_init__.py 作成. ``` # __init__.py from flask import render_template from flask import Flask app = Flask(__name__) @app.route('/') def hello(): return 'Hello, World!' @app.route('/hello/') @app.route('/hello/<name>') def hello(name=None): return render_template('hello.html', name=name) ``` templatesフォルダ内に hello.html 作成。 ``` <!doctype html> <title>Hello from Flask</title> {% if name %} <h1>Hello {{ name }}!</h1> {% else %} <h1>Hello, World!</h1> {% endif %} ``` `{% %}` 内にプログラムを記述する。 `{{}}` は受け取った変数の名前を入力。