GCPのComputeEngine上にPython3系+flask環境を構築する

# はじめに

GCPのロードバランサーの動作を確認したく、ComputeEngineでウェブアプリを立てることにしました。
もともとはロードバランサーの検証作業が目的だったのですが、その過程の作業もちゃんと記録しておいた方がいいなと思い、今回これを記事にすることにしました。

---

内容としてはタイトルの通りで「ComputeEngineを使ってPython3系+flask環境でウェブアプリを構築する」というものです。
GCP初心者の方は参考になるかと思いますので、よかったら読ん進めてみてください:thumbsup:

---

# ComputeEngine構築
ComputeEngineの環境構築は簡単ですね。
ボタンをポチポチすれば簡単にLinuxサーバが立っちゃいます。

#### 1. VMインスタンス作成
GCPコンソールのここからComputeEngineのVMマシンを作ります。
<img width="585" alt="Shot 2.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/be1c515b-d56b-0575-7068-07cf55952767.png">

---

こちら↓はインスタンス設定の参考例です。
<img width="430" alt="Shot.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/b0b273ab-2e05-ac4a-86ec-6a276133f1c9.png">

ポイントは『HTTPトラフィックを許可する』にチェックをいれることですね。
Webサーバ（flask）を立てるので、これをチェックしないと外からの動作確認ができません。
<img width="424" alt="Shot 1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/f0651976-d43d-d74a-3896-d9d153442f8c.png">

後は『作成』ボタンを押して数分待てばVMが起動します。

---

#### 2. 動作確認（VMインスタンス起動）
ちゃんと起動したかどうかSSHしてみましょう。
<img width="679" alt="Shot 3.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/03463b3a-425e-bd20-b040-95e1f530428c.png">

はい、無事に起動しました:smile:
<img width="903" alt="Shot 4.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/75d444d2-78f7-b6f0-fed5-3e9e93b61dbc.png">


---

# Python3系の準備

VMが無事立ち上がったので、次はPython環境を整えていきます。

#### 1. aptアップデート
まずはaptのアップデートを。

```
sudo apt update
```

<img width="810" alt="Shot 6.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/10ff497f-4341-371b-9750-9a776463d732.png">

---

#### 2. Pythonのバージョン確認

立てたVMはデフォルトでPython2系がインストールされています。
<img width="508" alt="Shot 5.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/1e828db1-f685-720c-fdce-b79324bf03f8.png">

今回のDebian9パッケージではPython3系もインストールされています。
<img width="499" alt="Shot 7.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/e70f4e14-9a77-debb-edea-3151136d9e98.png">

ただpip3はインストールされていないので、こちらを準備する必要があります。

---

#### 3. pip3のインストール

次のコマンドでpip3が使えるようにします。

```
sudo apt install python3-pip
```
<img width="1012" alt="Shot 8.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/b6d6f93f-4631-39ba-ac3e-4f1466978577.png">

これでpip3が使えるようになりました。
次はpip3でflaskをインストールしていきます。

---


# flaskインストール

```
pip3 install flask
```

pip3を使ったflaskをインストールします。簡単です。
<img width="903" alt="Shot 9.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/4c467042-b656-b378-cf11-02477cbc320f.png">

これでflaskが使えるようになりました。
動作確認してみましょう。


---

# 動作確認

動作確認のためのflaskを使ったPythonスクリプトを用意しましょう。

#### 1. Pythonスクリプト作成

まず、下記のコマンドからnano（テキストエディタ）でファイルを作成します。

```
nano main.py
```

エディタが開いたら、下記のスクリプトをコピペします。

```python:main.py
from flask import Flask
app = Flask(__name__)

@app.route('/')
def hello_world():
    return 'Hello, Flask World!!'

if __name__ == '__main__':
    app.run(debug=False, host='127.0.0.1', port=5000)
```

こんな感じです↓
<img width="852" alt="Shot 11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/defc5c41-b4dd-8fb2-bbc9-e88199eaf749.png">

コピペできたら、

+ Control+O
+ Enter
+ Control+X

の順に入力してnanoエディタを終了します。

---

#### 2. flask動作確認

下記のコマンドで作成したスクリプトを起動します。

```
python3 main.py
```

下記のような画面になっていればOKです。
flaskが動作しています。

<img width="852" alt="Shot 12.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/6e4a3ffc-71aa-9902-c6cb-6b862851e2d1.png">

ここまでで一応動作確認はできていますが、念の為curlコマンドでウェブアプリの応答を確認してみましょう。
もう一つ別のSSH接続をして、下記のコマンドを入力して応答を確認します。

```
curl 127.0.0.1:5000
```

ポート番号は5000で作っていますので、上記のコマンドでcurlを打ちます。

<img width="830" alt="Shot 13.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556132/8285382a-eddb-8c67-8185-c4227f6e64a3.png">

ちゃんと「Hello world」と言う文字列が応答されましたので、ウェブアプリが動作していることが確認できます。

---

# おわりに

いかがでしたでしょうか？
いずれの作業もさほど難しくありませんので、慣れてしまえばComputeEngineの立ち上げからflaskウェブアプリケーションの起動まで、数分でできちゃいます！
よかったら挑戦してみてください:relaxed: