概要
- 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 というサービスが提供してくれている無料のサーバにアップロードする。その 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 にアップしたくなったら、上述コマンドでまたアップロードする。