― GitHubからデプロイまで ―
この記事では、KU-BizTech の基盤を使って、自分のWebアプリを公開する準備を説明します。
手順は少し多いですが、
順番通りに進めれば必ず公開できますので、落ち着いて進めてください。
KU-BizTechで何が起きているか（全体像）
KU-BizTechでは、次のような流れでWebアプリが公開されます。
- 自分のPCのルートディレクトリにmyBizTechフォルダを用意します
- 教員が Webアプリ用の雛形（テンプレート） を用意します
- 学生はそれを 自分専用のGitHubリポジトリ として受け取ります
- 自分のPCで編集します
- GitHubに変更を送信（push）します
- 自動的にWebアプリとして公開されます
つまり、
GitHubに push すること = Webに公開すること
という仕組みです。
① 自分のPCにmyBizTechフォルダを作ります（最初だけ）
1. ターミナルを開きます
- macOS：ターミナル
- Windows：PowerShell
2. 作業用フォルダを作成します
自分のPCの ルートディレクトリ に、
myBizTech というフォルダを作ります。
mkdir myBizTech
myBizTech というフォルダに移動します。
cd myBizTech
pythonのflaskライブラリをインストールしておきます。
pip install flask
② GitHubClassroomの Assignment のURLを開く
授業で配布される GitHubClassroomのURL をクリックしてください。
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
URLはWebclassで連絡されます
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
- GitHubにログインしていない場合は、先にログインしてください
- URLを開くと 「Accept this assignment」 と表示されます
もし、このような画面がでたら「Autorize GitHub Classroom」を押してください
表示されたら、Accept this assignment をクリックしてください。
もしかしたら、メールが届くので、パソコンで開いて「Accept invitaion」をクリックしてください
③ 自分専用のWebアプリ用リポジトリが作られます
1. 自分のGitHubを開く
Acceptすると、自分のGitHubに次のようなリポジトリが自動で作成されます。
表示されたURLをクリックします。
KU-XBP / app●●●●-xxxxxx
-
app●●●●-xxxxxxの●●●●部分は年など、xxxxxxは学生のgitnameです - これが あなたのWebアプリのソースコード置き場 です
このリポジトリの名前は絶対に変えないでください！！！！
2.URLをコピー
画面右上の 「Code」ボタン を押し、
HTTPSのURL をコピーしてください。
③ 自分のPCにアプリをコピー（clone）します
1. ターミナルを開きます
- macOS：ターミナル
- Windows：PowerShell
2. myBizTechに移動
myBizTech というフォルダに移動します。
cd myBizTech
3. アプリをコピー（clone）します
git clone ②でコピーしたURL
④ VS Codeでアプリを編集します
myBizTechフォルダを開いてみましょう。
myBizTechフォルダの中には、次のようなフォルダ、ファイルがあります。
app●●●●-xxxxxx/
├─ app.py
├─ requirements.txt
├─ README.md
├─ templates/
│ └─ index.html
└─ static/
├─ favicon.ico
└─ css/
└─ style.css
app.py
-Webアプリ全体の動きを決めるメインのファイルです。
templates/
画面（HTML）を入れるフォルダです。
static/
画像・CSSなど、見た目に関するファイルを入れるフォルダです。
教員が環境を整える
教員がみなさんのgithubのリポジトリ情報をもとに環境を整え、URLを発行するので、ここで一旦おしまい。
何回も言います。絶対にリポジトリの名前は絶対に変えないでください！！！！