0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

flaskを軽く復習する

Posted at

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")

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")

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)
{% 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" %}`は、共通テンプレートの作成

フォームの作成

データを受け取り処理する所

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)
{% 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 %}

参考サイト

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?