flaskを軽く復習する

# flask webアプリケーション

## 1. 基本文法
```
from flask import Flask, render_template
import random

app = Flask(__name__)


@app.route('/')
def index():
    return "hello python"



if __name__ == "__main__":
    app.run(host="0.0.0.0")
```
![](https://i.imgur.com/3yVzvGN.png)


## 2. ルーティング
```
from flask import Flask, render_template
import random

app = Flask(__name__)


@app.route('/')
def index():
    return "hello python"

@app.route('/room')
def room():
    return "room"



if __name__ == "__main__":
    app.run(host="0.0.0.0")
```
![](https://i.imgur.com/DtunvHl.png)

## 3. テンプレートを使用する
jinja2を使用
- HTMLにpythonコードの書き込みを使用できる。
```
@app.route('/')
def index():
    return render_template("index.html")
```
テンプレートにデータを渡すには以下のように記述
```
return render_template("index.html", name_value = name)
```
テンプレート側ではname_value変数でデータを取り出す。
```
<!DOCTYPE html>
<html lang="ja">
        <head>
                <meta charset=utf-8" />
                <title>Tvice ~roomでチャットしよう~</title>
        </head>
        <body>
                <p>hello python{{ name_value }}</p>
                <p>hello paiza</p>
        </body>
</html>
```

## 4. 複雑な処理をしよう
### リスト
```
@app.route('/')
def index():
    name = "Flask"
    play = ["kami", "kami1", "kami2"]
    return render_template("index.html", name_value = name, play=play)
]
```

#### リスト表示
```
<!DOCTYPE html>
<html lang="ja">
        <head>
                <meta charset=utf-8" />
                <title>Tvice ~roomでチャットしよう~</title>
        </head>
        <body>
                <h1>Hello {{ name_value }}</h1>
                <p>Hello paiza!</p>
                {% for playy in play: %}
                        <p>{{ playy + "はモンスターと戦った" }}</p>
                {% endfor %}
        </body>
</html>

```

## テンプレートの共通部分を分割しよう
template.html
```
<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="utf-8">
        <title>Flask - paiza</title>
        <style>body {padding: 10px;}</style>
    </head>
    <body>
        <p>共通テンプレート</p>
        {% block content %}
        {% endblock %}
    </body>
</html>
```

index.html
```
{% extends "layout.html" %}
{% block content %}
    <h1>Hello {{ name_value }}</h1>
    <p>Hello paiza!</p>
    {% for player in players: %}
        <p>{{ player + "はモンスターを戦った" }}</p>
    {% endfor %}
{% endblock %}
```

## フォームの処理

```
from flask import Flask, render_template
app = Flask(__name__)

@app.route("/")
def show():
    message = "hello world"
    return render_template("form.html", message = message)
```
```=python
{% extends "layout.html" %}
{% block content %}
<h1>フォーム</h1>
<p>{{ message }}</p>
<form action="/result" method="post">
    <label for="article">投稿</label>
    <input type="text" name="article">
    <p></p>
    <label for="name">名前</label>
    <input type="text" name="name">
    <button type="submit">送信する</button>
</form>
{% endblock %}
```

``{% extends "layout.html" %}`は、共通テンプレートの作成

### フォームの作成
データを受け取り処理する所

```=python
from flask import Flask, request, render_template
app = Flask(__name__)

@app.route("/")
def show():
    message = "Hello World"
    return render_template("form.html", message = message)

@app.route("/result", methods=["POST"])
def result():
    message = "This is paiza"
    article = request.form["article"]
    name = request.form["name"]
    return render_template("form.html", message = message, article = article, name = name)
```

```=html
{% extends "layout.html" %}
{% block content %}
<h1>フォーム</h1>
<p>{{ message }}</p>
<form action="/result" method="post">
    <label for="article">投稿</label>
    <input type="text" name="article">
    <p></p>
    <label for="name">名前</label>
    <input type="text" name="name">
    <button type="submit">送信する</button>
</form>
<p>{{ article }} {{ name }}</p>
{% endblock %}
```

## 参考サイト
- https://www.python.ambitious-engineer.com/archives/1630
- https://tech-diary.net/flask-introduction/#index_id4
- https://paiza.jp/works/flask/primer