プログラミング

PythonでWebサービスが作れる?テンプレートエンジンJinjaの条件分岐

PythonでWebサービスが作れるの?
 
どうやってWebサービスをテストしたらいいの?

 
Flaskでどんなことができるの?

という悩みを解決できる記事になっています。

なぜなら、私はプログラミング言語Pythonで
Webサービスの開発をしているからです。

結論だけ言うと、

PythonならWebサービスを簡単に作れます。

この記事ではテンプレートエンジンJinjaで条件分岐をする方法を紹介します。

読み終えていただければ、

開発用サーバーで簡単なWebアプリを作る方法が分かります。

※おすすめのプログラミングスクール

せっかくプログラミングができるなら

稼げるレベルまで高めませんか?

現役エンジニアが就職サポートまでしています。

無料トライアル制度もあるのでおすすめです↓

テンプレートエンジンJinjaとは?

テンプレートエンジンJinjaとは?

テンプレートエンジンとは、ひな形(テンプレート)と

実際のデータを合成して成果となるドキュメントを出力する機能のことです。

Webアプリでは、HTMLの出力に特化しています。

FlaskではJinja2というテンプレートエンジンが採用されています。

前回はテンプレートエンジンを使って、

短いWebアプリケーションを作りました。

今回は条件分岐の使い方を紹介します。

テンプレートをCSSで作成

Webアプリケーションの配色やレイアウトを調整するために

CSSを活用します。

CSSのファイルはstaticというフォルダに入れておきます。

コードはこちら。

h1 {
    background-color: red;
    color: white;
    padding: 12px;
}
div#desc {
    padding-left: 3em;
    border: 1px solid red;
}

次にテンプレートをHTMLファイルで作成します。

テンプレートをHTMLで作成(条件分岐あり)

HTMLのファイルはtemplatesというフォルダに入れておきます。

条件分岐は{% if 条件 %}と書きます。

<html><head>
    <link rel="stylesheet"
     href="{{ url_for('static', filename='style.css')}}">
</head><body>
    <h1>{{username}}さんの紹介</h1>
    <div id="desc">
      {% if age < 20 %}
        <p>年齢は{{age}}才(未成年)です。</p>
        <p>インスタのユーザーIDは非公開です。</p>
      {% else %}
        <p>年齢は{{age}}才(未成年)です。</p>
        <p>インスタのユーザーIDは{{email}}です。</p>
      {% endif %}
    </div>
</body></html>

今回は20歳未満のユーザーだとIDを表示しないように

条件分岐を使っています。

次にPythonでメインアプリを作ります。

データをPythonで作成

コードはこちらです。

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
    #テンプレートエンジンにデータを指定
    return render_template('card-age.html',
                          username='うっちゃん',
                          age=26,
                          email='@uchy8893')

if __name__ == '__main__':
    app.run(host='0.0.0.0')

Pythonを起動させると開発用サーバーが起動します。

pythonのwebアプリの画面

リンク先にアクセスした結果がこちら。

20歳未満のユーザー

webアプリの動作画面1

20歳以上のユーザー

webアプリの動作画面2

次回は継承機能を組み込んだプログラムを作ります。

※おすすめのプログラミングスクール

せっかくプログラミングができるなら

稼げるレベルまで高めませんか?

現役エンジニアが就職サポートまでしています。

無料トライアル制度もあるのでおすすめです↓

ここまで読んでくださりありがとうございました。^^

-プログラミング
-