第2回 PythonAnywhereでWebサイトを作ろう・・・チュートリアル編 Step1
今回は、PythonAnywhereのチュートリアルを使って簡単なコメントを書けるサイトを作ってみます。
ログイン後の画面の右上のHelpのリンクをクリックして、ヘルプページを表示するといろいとチュートリアルとかがあるので、参考になります。
ここでは、FlaskというWebフレームワークを使ってサイトを作っていきます。ヘルプの真ん中あたりの「Flask」というカテゴリのトップに、「A beginner's guide to building a simple database-backed Flask website on PythonAnywhere」というリンクがありますのでクリックします。
開くと、以下のような英語で書かれたチュートリアルが表示されますので、説明に従って入力していきましょう。
【今回作るもの】
チュートリアルの中に画像がありますが、これが今回作るものです。テキストボックスがあると思いますが、そこにテキストを入力して緑色のボタンをクリックすると、テキストボックスの上に（画面では３行）、テキストボックスの内容が表示されるような簡単なコメント管理サイトです。
とはいっても英語なんか読めないよという人のために、要点だけまとめて日本語にしておきます。
チュートリアルでは、GITを使ったバージョンコントロールの説明もありますが、そこらへんはすっ飛ばしてます。
英語の勉強がてら順番にやっていくと、Pythonと英語の両方が一緒に勉強できるので、時間のある方は英語のチュートリアルをやってみてください。
要点は３つのステップで構成しました。
- Step 1 Hello World!的なものを作る。
- Step 2 コメントをリストを使って保存するだけのサイトを作る。
- Step 3 MySQLを使ってコメントを管理できるサイトを作る。
今回はStep1になります。Step2は、Pythonのデータ構造のリスト型の変数にコメントを保存するだけなので、リロードするとコメントが消えてしまいます。Step 3ではDBMSのMySQLを使ってコメントをきちんと保存できるようにします。
では、順番に説明してきます。
Step 1 Hello World!的なものを作る。
- ダッシュボード画面の右上のメニュー「Web」というリンクをクリックします。
【ダッシュボード】
- 「Add a new web app」をクリックすると右側に以下のように「Your web app's domain name」と出てくるので、ここは気にしないで「Next」をクリック。
- 画像は省略しますが、「Select a Python Web framework」と出てくるので「>>Flask」をクリック。続いて「» Python 3.6 (Flask 1.0.2)」をクリック。
- 次の「Quickstart new Flask project」という画面でファイルの保存先のパスが表示されているので、ここはそのままにして「Next」をクリック。
- すると、以下のようなコンフィグ画面が表示されます。「Configurartion for」の下に「Sesshu.pythonanywhere.com」というリンクが表示されているので、それをクリックするとその下のように、「Hello from flask!」という画面が表示されます。
【Web】
ここまでで、自動的にFlaskというWebフレームワークを使って、必要最低限の要素が作られました。２つ上の【Web】という画面に戻ってください。下にスクロールすると真ん中あたりに下図のような「Code」という欄があります。そこのSource Codeというところの右側の「Go to directory」というリンクをクリックしてください。
下図のような「Files」という画面が開きます。真ん中あたりに「Flask_app.py」と書かれているリンクをクリックしてください。
すると以下のようにFlask_app.pyファイルの中身が表示されます。10行目に「Hello from Flask!」と書かれていますが、これが先程の「Sesshu.pythonanywhere.com」というリンク先に表示されていた文字列です。
この文字列を適当に書き換えて見ます。例えば「Hello from 吉田雪舟」と書き換えてみましょう。
緑色の「Save」ボタンとリロード
ボタンをクリックしてから、先程の「Sesshu.pythonanywhere.com」をリロードしてみると、変更した文字列に変わっていると思います。
以上がStep1です。お疲れ様でした。
