参考にした資料
この記事はゼロから始めるWEBプログラミング入門を参考にしながら行いました。
環境
Windows10
Paas
heroku/7.47.0 win32-x64 node-v12.16.2
Git
git version 2.27.0.windows.1
Windows Terminal
1.3.2651.0
プログラミング言語
Java
Webフレームワーク
Spring framework
ここでやること(できること)
デプロイを実行してWebページを表示させられるようになる
Herokuとは？
- 無料かつ簡単にWEB公開ができるすぐれもの
- 開発者はプログラム作ってGitにcommitしてpushするだけ
- それ以外のことはHerokuが自動的にやってくれる
単純に公開するだけだったら、初心者でもすぐにできると思います。(事前準備などが終わっていたこともありますが実際に初心者の僕自身でも、10分くらいでデプロイできました)
実際に公開するWebページはこんな感じです↓
テキストのみの簡素なページ
事前準備として
- Heroku会員登録
- Heroku CLIのインストール(Gitも一緒に)
が必要です。
自分はすでに終わっていたので、ここでの紹介は省きますが必要な方はこちらからご覧ください。
Heroku会員登録
Heroku CLIのインストール(Gitも一緒に)
ソースのダウンロード
Spring frameworkのWEBアプリを Heroku で使用できるようにしたソースを Github で作成してくださっているので、ありがたく拝借します。(ありがとうございます。)
Windows PowerShellを開く
Windowsマークを押して「windows terminal」を検索して、PowerShellを開きます。(検索は「ter」でも引っかかった)
もしくは、「cmd」と入力してコマンドプロンプトから操作することも可能です。
ソースをダウンロードするフォルダに移動
PS C:\Users\xxxx> cd desktop
自分の場合は、初期位置がxxxx(自身のユーザ名)なので、そこからcdコマンドを使ってデスクトップに移動し、デスクトップ内にダウンロードしました。
ソースをダウンロード(クローン)
Githubに作成してあるソースを git clone コマンドを使って取得します。
PS C:\Users\xxxx\desktop> git clone https://github.com/sbc-f/web.git
ソースが置いてあるGithubのURL↓
https://github.com/sbc-f/web.git
Herokuで作成したプロジェクトの管理画面を開く
事前に作成しておいたプロジェクトがあるのでそれを使います。
（参考にしたページには Heroku のプロジェクト新規作成から丁寧に書かれているので必要な方はそちらをご覧ください）
ダッシュボードからアプリを選択
「Settings」をタップ
「Heroku Git URL」をコピーする（あとで使う）
*デプロイ後の画面をスクショしたので、「Framework」と「Slug size」の項目が選択されていますが、デプロイ前はこれらの項目は空白です。
いよいよデプロイ
Gitコマンドでリモートを追加します。
(追加には、リモート名とHeroku Git URLが必要です。)
- リモート名 : 任意の名称
PS C:\Users\xxxx\desktop> cd web
リモート名「web」に移動する
PS C:\Users\xxxx\desktop\web> git remote add web https://git.heroku.com/scbc-testdb.git
さっきコピーした「Heroku Git URL」を貼り付けて、リモートを追加する
Heroku にデプロイ
(リモートにPushすることで、Herokuが自動的にビルドからデプロイまでやってくれる。 Pushにはリモート名とブランチ名を指定します)
- リモート名 : web (Pushするリモートを指定)
- ブランチ ： master (最初に作られるブランチ)
PS C:\Users\xxxx\desktop\web> git remote add web
※ nautii様より、コマンド記述ミスのご指摘をコメントでいただきました。ご丁寧にありがとうございました！！
正しくは下記↓
PS C:\Users\xxxx\desktop\web> git push web master
作成されたアプリの確認
「Open app」をタップすると、デプロイされたWebページを確認することができます。
下記のように表示されたらデプロイは成功です。
お疲れさまでした。
よく使うHerokuコマンド一覧
| コマンド | 説明 | 使用例 |
|---|---|---|
| heroku -v | バージョン確認 | - |
| heroku login | ログイン | - |
| heroku create[アプリケーション名] | アプリケーション作成 | heroku create scbc-testdb |
| heroku info | アプリケーションの情報を見る | - |
| heroku logs | ログを見る | - |
| heroku ps | プロセスを見る | - |
| heroku run bash | Heroku環境でbashを使用 | - |