よちよちpython

独習 python/Qpython/Pydroid3/termux/Linux

【WSL/Anaconda/Flask】仮想環境の作成とFlaskのインストール、簡単なWebアプリ作成

2022年 寅年。元旦。
明けましておめでとうございます。今年もどうぞよろしくお願いします。m( _ _ )m

新年最初の投稿。
今回は、簡単なWebアプリを作成します。その前に、Anacondaで新規に仮想環境を作成し、そこへFlaskをインストールします。



実行環境



仮想環境の作成とFlaskのインストール

WSLの起動後から書きます。
通常、ターミナルを立ち上げるとAnacondaは自動でデフォルトの仮想環境「base」にactivateするかと思います。
pythonのバージョンを確認します。

(base) $ python -V
Python 3.8.10

バージョン3.8が入っていました。

仮想環境は、

  • python=3.9 指定で、
  • 仮想環境名:flask-py39 に、
  • Flaskを同時にインストール

しようと思います。

(base) $ conda create -n flask-py39 python=3.9 flask


以下のものが自動でインストールされました。

certifi-2021.10.8    | 151 KB    | ############################################################################# | 100%
python-3.9.7         | 18.6 MB   | ############################################################################# | 100%
pip-21.2.4           | 1.8 MB    | ############################################################################# | 100%
setuptools-58.0.4    | 790 KB    | ############################################################################# | 100%
jinja2-3.0.2         | 110 KB    | ############################################################################# | 100%
markupsafe-2.0.1     | 22 KB     | ############################################################################# | 100%
flask-2.0.2          | 78 KB     | ############################################################################# | 100%
tzdata-2021e         | 112 KB    | ############################################################################# | 100%

新規仮想環境「flask-py39」にはpython3.9.7が新たにダウンロード・インストールされ、flaskほか依存ライブラリもインストールされたようです。



作成した仮想環境にactivate

# 仮想環境を有効化
(base) $ conda activate flask-py39

# ↓ プロンプトの仮想環境の表示が「base」から「flask-py39」に変わる
(flask-py39) $



仮想環境一覧を見る

(flask-py39) $ conda info -e
base                     /home/user/anaconda3
flask-py39            *  /home/user/anaconda3/envs/flask-py39

「flask-py39」という仮想環境名が追加され、「* アスタリスク」は現在activate中であることを示しています。



仮想環境にインストール済みのpythonライブラリ一覧を見る

(flask-py39) $ conda list 

いま作ったばかりの仮想環境に python3.9とflask をインストールしただけですが、何やらたくさん表示されます。

# packages in environment at /home/user/anaconda3/envs/flask-py39:
#
# Name                    Version                   Build  Channel
_libgcc_mutex             0.1                        main
_openmp_mutex             4.5                       1_gnu
ca-certificates           2021.10.26           h06a4308_2
certifi                   2021.10.8        py39h06a4308_0
click                     8.0.3              pyhd3eb1b0_0
dataclasses               0.8                pyh6d0b6a4_7
flask                     2.0.2              pyhd3eb1b0_0
itsdangerous              2.0.1              pyhd3eb1b0_0
jinja2                    3.0.2              pyhd3eb1b0_0
ld_impl_linux-64          2.35.1               h7274673_9
libffi                    3.3                  he6710b0_2
libgcc-ng                 9.3.0               h5101ec6_17
libgomp                   9.3.0               h5101ec6_17
libstdcxx-ng              9.3.0               hd4cf53a_17
markupsafe                2.0.1            py39h27cfd23_0
ncurses                   6.3                  h7f8727e_2
openssl                   1.1.1l               h7f8727e_0
pip                       21.2.4           py39h06a4308_0
python                    3.9.7                h12debd9_1
readline                  8.1                  h27cfd23_0
setuptools                58.0.4           py39h06a4308_0
sqlite                    3.37.0               hc218d9a_0
tk                        8.6.11               h1ccaba5_0
tzdata                    2021e                hda174b7_0
werkzeug                  2.0.2              pyhd3eb1b0_0
wheel                     0.37.0             pyhd3eb1b0_1
xz                        5.2.5                h7b6447c_0
zlib                      1.2.11               h7f8727e_4

仮想環境削除コマンド

仮想環境を削除するには

$ conda remove -n 仮想環境名 --all

もし、さっき作った仮想環境名「flask-py39」を削除すれば、今回インストールしたpython3.9やflaskを含めた環境 flask-py39 が消え、元々の仮想環境「base」だけが残ります。

Webアプリを作成する

VSCodeで作成します。

プロジェクト用フォルダを作成

まずはフォルダ名「flask_sample」を作ります。

# フォルダ作成
(flask-py39) $ mkdir flask_sample

# そこへ移動
(flask-py39) $ cd flask_sample

# VSCodeを起動
(flask-py39) $ code .

VSCodeが立ち上がります。



「Hellow World」一番簡単なFlaskのWebアプリ

Pythonファイルだけで完結する一番簡単なWebアプリを作成します。
現在のフォルダ内に適当な名前でpyファイルをつくります。「app.py」で行きます。

from flask import Flask

app = Flask(__name__)

@app.route('/')
def index():
    return "Hello Flask !!"

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



pyファイルを実行します。

# pythonでファイルを実行
(flask-py39) @flask_sample $ python app.py

これでFlaskのサーバが立ち上がっています。ターミナルにそれらしいことが出ていると思う。

サーバを止める時は ターミナルでショートカット Ctrl +c を入力。



では、ブラウザを起動して、ローカルホストのポート番号5000番にアクセスします。デフォルトでこうなっています。
ブラウザのURL窓に「127.0.0.1:5000」か「http://127.0.0.1:5000/」「localhost:5000」と入力しアクセスする(ネット接続不要)。



app.py の

@app.route('/')
def index():
    return "Hello Flask !!"

の部分で、return で返すように指示した「Hello Flask !!」がブラウザに表示されている。

f:id:chayarokurokuro:20220101195627j:plain
Hello Flask



表示する内容を書き換えてみる

表示する中身を変えると表示が変わるか、app.pyを以下のように書き換えます。(3か所)

from flask import Flask

app = Flask(__name__)

@app.route('/')
def index():

    # ↓ 書き換え
    html_text = """
          <h1>はじめに</h1>
          <p>htmlで書き換えました。</p>
  """

    #        ↓ 書き換え
    return html_text

if __name__=='__main__':
    #        ↓ 追加
    app.run(debug=True)

一度ターミナルで Ctrl + c を押してサーバを止め、再びpython app.pyとコマンドを実行してサーバを動かす。ブラウザを「F5」キー等で更新すると・・・。



f:id:chayarokurokuro:20220101195732j:plain
書き換えてブラウザを更新すると



実行部分でdebug=Trueと書き換えると、ファイルを書き換えた傍からブラウザの表示にそれが反映するようになる。書かないとブラウザを更新しても反映されませんで、毎回サーバを再起動しなくちゃならない。



関数のリターンをhtml文に書き換えましたが、中身が巨大になるとpyファイルの大半をhtmlが埋め尽くしてしまい読みにくくなる。そこでhtmlファイルとして別に分けることにより管理しやすくする方法がとられます。render_templateというのを使いますが、それは次回にします。



以上です。

【追記】
実行環境が異なる場合にFlaskアプリ実行時エラーが出るかも。メモを貼っておきます。
【Anaconda】Flask実行時に"colorama"がNoModuleエラー - よちよちpython