---
# System prepended metadata

title: Flask入門講座

---

# Flask入門講座
## 環境構築
- [Python](https://www.python.org/)をインストール
- Flaskをインストール (ターミナルで`pip isntall flask`を実行)
- PyMySQLをインストール (ターミナルで`pip install pymysql`を実行)
- [このページ](https://webkaru.net/mysql/install-windows/)を参考にMySQLをインストール


## 導入
Flaskはエイプリルフール生まれのPython向け軽量フレームワークである。
本講座はWebアプリの最低限の仕組みがわかり、Pythonが多少は書ける(基本的文法はわかる）前提で行う。
Flaskはバックエンド(サーバーサイド）を記述し、フロントエンドはjinja2というテンプレートエンジンを利用することが多い。


## 1.Hello World
とりあえず他の言語よろしくHello Worldを表示してみる。
```python
from flask import Flask
app = Flask(__name__)


@app.route('/')
def main():
    return "Hello World"


if __name__ == "__main__":
    app.run(debug=True)
```
このコードを実行するでサーバーが起動される。
[localhost](localhost:5000)にアクセスするとHello Worldが表示されているのがわかる。
具体的にコードを読んでいく。
1行目では必要なmoduleを読み込んでいる(これからどんどん増えていくが、`import *`は推奨しない）。
2行目ではFlaskインスタンスを作成している。(このインスタンスがサーバーの本体になる）
3行目のように`@app.route(String)`デコレータによってルーティングを行う。
デコレータ内のリンクにアクセスするとその下にあるfunctionが実行される。
`app.run()`によってappはサーバーとして起動される。

## 2.HTML表示
ただ文字を表示するだけでは当たり前だが、Webページとしては成立しない。
そこで文字の代わりにHTMLファイルを返すようにする。
Flaskは実行するPythonファイルと同じカレントディレクトリ下にある`template/`のhtmlを返すAPIがある。
例　hello_world.htmlを返す
```python
from flask import Flask,render_template
app = Flask(__name__)


@app.route('/')
def main():
    return render_template('hello_world.html')


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

### 演習
以下のようなルーティングとなるコードをかけ。
```
/:main.html
/register:register.html
/table:table.html
```
<br></br>
※例えば、次のように記述することでURLに変数をもたせることができる。
```python
@app.route('/user_page/<username>')
def UserPage(username):
	return render_tamplate('user_page.html',username=username)
```

## 3.データ送受信
今のままだと、[阿部寛のホームページ](http://abehiroshi.la.coocan.jp/)のようなstaticなページしか表示できない。

まずはユーザーがサーバーにデータを送信出来るようにする。
フォームによるPOSTメソッドで行う。
```HTML
<form action="#" method="POST">
	<input type="text" name="hoge">
</form>
```
例えば、上のようなformのデータ(/sample,sample.html)をflaskで受け取るには
```python
@app.route('/sample',methods=["POST","GET"])
def getForm():
	if request.method=="POST":
		hoge = request.form['hoge']
	return render_template('sample.html')
```
のようになる。
### 演習
2章で作ったコードに追記して、`/register`からユーザー登録を受け付けるようにせよ。
具体的には、事前にkeyに`username`と`grade`をもつ`dict`の配列を作っておいて、登録するたびにこの配列に受け取ったデータのユーザーを追加していく。(追加後に表示等して確認する）
<br></br>



次に動的にHTMLを生成できるようにする。
Jinja2というPython向けのテンプレートエンジンを利用してHTMLにサーバーサイドのデータを反映させる。
Jinja2は`{% %}`で囲うことでPyhtonの文をHTMLで書くことが`{{}}`で囲うことでサーバー側で与えたデータを受け取ることが出来る。
例:
```HTML
<h2>{{param1}}</h2>
{%if flag%}
<h4>{{param2**3}}</h2>
{%endif%}
```
```python
@app.route('/')
def main():
	 return render_template('main.html',param1="title",flag=True,param2=4)
```

### 演習
Pythonファイル、`table.html`に追記することで`/table`にユーザーのリストが表示されるようにせよ。

## 4.データベースを操作
今までユーザーをpython内の変数で管理していたが、これでは起動するたびにリセットされてしまったり他のアプリケーションからアクセスがしにくい。
そのためユーザー一覧をデータベースで管理することにする。
データベースはMySQL、アクセスにはPythonのmoduleであるPyMySQLを利用する。
```python
import pymysql.cursors
conn = pymysql.connect(
	#some information
	)
with conn.cursor() as cursor:
	ins = "SQL Statement"
	cursor.execute(ins)
	# もしinsがデータを求める文なら
	result = cursor.fetchone()
	# もしデータ改変なら
	cursor.commit()
```

### 演習
`/table`をデータベース参照によるデータで構築し、`/register`の登録でデータベースにユーザーが登録されるようにせよ。