概要

Python 入門サイトをひとつ終えた。
次は何をしようかな?
インターネットで誰からでも閲覧できる、ウェブサイトを1個作ってみよう。
無料で!

そういうことになった。「ウェブサイトを作る」ってとこにフォーカスしたいので、サイトの内容については欲を出さず、「あ」って表示するだけにする。

フォルダを作る

フォルダを作って project-a と名付ける。

これは何をしているのか

今回ファイルとかを置くフォルダを作成。プロジェクト「あ」。

コンソールでごちゃごちゃやる

project-a フォルダの中でコンソールを開いて、以下のようにごちゃごちゃやる。

# Python が入ってることの確認。
$ python -V
Python 3.6.8
# (2019-10-28 追記)確認というか、これはこの Python のバージョンを表示するコマンド。
# バージョンが表示できるのならインストールされているだろう、というコト。

# pipenv をごちゃごちゃやる。
$ pip install pipenv
$ pipenv install
$ pipenv shell
# (2019-10-28 追記)pip というプログラムに、 pipenv というパッケージのインストールをお願いしている。
# pipenv さんがしてくれるのは、現在のフォルダにだけ独立してパッケージをインストールすること。

これは何をしているのか

project-a フォルダの中で Python の独立した仮想環境を作っている。

引き続きコンソールでごちゃごちゃやる

# 今回の件に必要なライブラリをインストール。
$ pipenv install flask gunicorn
# (2019-10-28 追記)上述したように、 pipenv さんがパッケージをインストールしてくれる。
# pipenv install のあとに半角スペース区切りで install したいパッケージを並べて書ける。

これは何をしているのか

Python でウェブアプリライブラリ flask をインストール。 Heroku で動作させるために必要なライブラリ gunicorn をインストール。

py ファイルを3つ作る

ひとつめ

my_flask_script.py というファイル名で作る。このファイル名は何でも構わない。内容は以下をコピペしよう。

# (2019-10-28 追記)
# これから作る main というフォルダの __init__.py ファイルの中から app という変数をインポートしている。
from main import app

app.run(debug=True)

ふたつめ

これは、 main というフォルダを作ってその中に作る。ファイル名は __init__.py。内容は以下をコピペしよう。

# (2019-10-28 追記)
# 一方こちらはフォルダではなく、さきほど install した flask というパッケージから Flask という変数をインポートしている。
from flask import Flask

app = Flask(__name__)

# (2019-10-28 追記)
# この main というフォルダの中にあとで作成する views.py をインポートしている。
import main.views

みっつめ

これも、 main フォルダの中に作る。ファイル名は views.py。内容は以下をコピペしよう。

import flask
from main import app

# (2019-10-28 追記)
# このあとこのスクリプトはウェブページとして https://your.website みたいな URL で公開されることになるのだけれど、
# そのとき https://your.website/ の URL がアクセスされたとき @app.routes('/') のついた関数の中身が実行される。
# おなじように @app.routes('/python') の関数を作れば https://your.website/python という URL が作成できる。
@app.route('/')
def top_page():
    # (2019-10-28 追記)return しているものの中身が、ウェブページに表示されることになる。
    return 'あ'

これは何をしているのか

ウェブアプリライブラリ flask を利用して、ウェブページを表示するためのスクリプトを用意している。この状態で my_flask_script.py を実行すると、 http://localhost:5000 にアクセスすることができる。「あ」と表示されているはずだ。一度見たら Ctrl+c で実行を停止すること。

けれどこの状態では、自分のぱそこで閲覧できるだけだ。インターネットでは見れない。

Heroku というサイトでアカウントを作る

Heroku | Login

このページでアカウントを作る。

これは何をしているのか

今回つくったウェブアプリは、 Heroku というサービスが提供してくれている無料のサーバにアップロードする。その Heroku を利用するためのアカウントをここでは作成している。

いろいろとインストールする

The Heroku CLI
Git
- Windows は git for windows。
- Mac は Git でもいいし Homebrew で入れてもいいし。

これは何をしているのか

先程、「無料のサーバにアップロードする」と言ったけれど、それを行うためのツールをインストールしている。

またコンソールでごちゃごちゃやる

# (2019-10-28 追記)pipenv さんが install してくれたパッケージの詳細を、
# requirements.txt というファイルに記述する。
$ pipenv run pip freeze > requirements.txt

# (2019-10-28 追記)作った my_flask_script ファイルを実行してねヨロシク、
# っていう指示書 Procfile を作成。
$ echo web: gunicorn my_flask_script:app --log-file - > Procfile

これは何をしているのか

つくったウェブアプリを Heroku のサーバで動かすためのファイルをふたつ作成している。

まだまだコンソールでごちゃごちゃやる

$ git init
$ git add --all
$ git commit -m "「あ」って表示する。"

ここで、 Heroku でにおけるこのアプリの名前を適当に考えないといけない。 project-a にしたいところなんだけれど、 Heroku の中で一意の名前でないといけない。ここでは適当に project-a12345 ということにしてみる。適宜書き換えてコマンドを実行すること。

# これを打ったあと、 Heroku サイトでの認証が挟まれるかもしれない。
$ heroku create project-a12345

$ git push heroku master

これは何をしているのか

つくったウェブアプリを Heroku サーバへアップロードしています。

作業はこれでおしまい

もうインターネットで開けるようになっているはず。

# このコマンドでブラウザからつくったウェブアプリを開ける。
$ heroku open

このコマンドを打つと https://project-a12345.herokuapp.com/ が開き、インターネット空間に我々の**「あ」**が堂々と表示されているのがわかるでしょう。友達のケータイからも「あ」が見えるのがわかるはずです。

このあと

たとえば先程つくった main/views.py ファイルの return 'あ' の部分を変更すれば、画面に表示されるものを変えることができます。もちろん変えただけだと Heroku にアップロードされていないので、以下コマンドを実行してアップロードします。

$ git add --all
$ git commit -m "「あ」を「い」に変えた。"
$ git push heroku master

もっと色々やりたいなら、こんな手順を踏めばよいかなと思います。

python flask [やりたいこと] でググる。
project-a を改造する。
Heroku にアップしたくなったら、上述コマンドでまたアップロードする。