作ったサイト用のファイルをWEBで公開するには、クラウドサービスの中でも一般的な「Heroku」を使うと便利です。
企業などに見せるポートフォリオもHerokuを使って公開することが当たり前のようになっています。
備忘録として、コマンドを使った場合の手順をシンプルに書いていきます。
PCはWindows10です。
1.準備
①Herokuでアカウント登録
・Cloud Application Platform|Heroku
②Herokuをコマンドで扱うためHeroku CLIをダウンロード&インストール
・The Heroku CLI
③コマンド起動
・Windows‥「Windowsキー+R」
2.コマンド操作
ログイン~コミット
①Herokuにログイン
$ heroku login
Herokuのサイトが出てくるのでログインをクリック
②初期状態でコミット
$ cd フォルダ名
$ git init
$ git add .
$ git commit -m "コメント"
ex) git commit -m "first commit"
※意味
・cd‥移動
・git init‥ローカルリポジトリ作成 & Gitバージョン管理下に置く
・git commit‥コミットする
プッシュ
①アプリを作成
$ heroku create アプリ名
②プッシュ(アップロード)
$ git push heroku master
③公開したサイトをブラウザで開く
$ heroku open
※URL
https://Herokuアプリ名.herokuapp.com/
ファイル変更
ファイルの中身を変更した場合、以下のコマンドで反映させる
$ git add .
$ git commit -m "コメント"
$ git push heroku master
3.エラー
事前設定
①「warning: LF will be replaced by CRLF in ~(ファイル名)」
・Windowsでコマンド操作をする場合に初めに設定しないと出るエラーらしい
・Git が改行コードを CRLF へ変更しようとして起こるエラー
⇒ 改行コードを CRLF へ変更しなくするには以下のコマンド
$ git config --global core.autoCRLF false
※参考記事
・「Git for Windowsでautocrlfの設定を間違えちゃった時の対応」(Qiita)
②Herokuにログインできない
・$ heroku login を実行しようとしたところ、以下の表示が出てエラーになる。
Warning: Cannot open browser.
heroku: Waiting for login… ⣽
⇒ $ heroku login --interactive
Herokuに登録したメールアドレスとパスワードを聞かれるので入力
※参考記事
・「heroku ログインエラー」(Qiita)
コマンド操作
①Herokuのプッシュ先をsshに変更してしまった
git remote -v heroku で確認してみたら以下のようになっていました。
heroku ssh://git@heroku.com/####.git (fetch)
heroku ssh://git@heroku.com/####.git (push)
Gitのプッシュ先をhttpsに変更する必要があるそうです。
⇒ $ git config --global --remove-section url.ssh://git@heroku.com/
※参考記事
・「gitでherokuのpush先をsshからhttpsに変更できません。」(teratail)
4.まとめ
一言
実際はこの記事だけでできるほど単純ではなく、ブログ記事などをたくさん読みました。
初めは試行錯誤しながらでも、徐々に分かるようになっていくと思います。
詳しいことが分かり次第、追加していきます。
参考記事
・「Herokuを使ってサクッと無料で静的サイトを公開」
(Refills)
・「Heroku入門(Webアプリの作成とデプロイ)」
(WEB備忘録)
・「HerokuでPHPを動かそう!開発からデプロイまでの手順を解説【初心者向け】」
(yurugramming!! )
・「HerokuでPHPをデプロイする」
(Qiita)
※terateil(テラテイル)
・プログラミングの技術的な内容を質問できるサイト
・完全無料で初歩的な質問でも気軽にエンジニアに聞ける
お勧めプログラミングスクール
◎TechAcademy
・オンライン完結のプログラミングスクール
・メンターの質が高く、質問への回答が早い
・オンライン教材はコース終了後も永久に見れる
・『はじめてのプログラミングコース』
・『オンラインブートキャンプ PHP/Laravelコース』
・『未経験からエンジニアを目指すTechAcademy Pro』
◎ポテパンキャンプ
・就職決まれば全額キャッシュバック
・格安で実践的なRuby研修を受けられる
・就職直結の良質なポートフォリオを作れる
・『3ヶ月10万円で受講できる転職特化型Ruby実践研修【ポテパンキャンプ】』
◎TECH::EXPERT
・多くの卒業生がエンジニアとして就職に成功している実績あり
・プログラミング基礎~個人開発・ポートフォリオ制作まで短期間でマスター
・プログラミングスクール大手のためIT企業から求人が多数あり
・『TECH::CAMPの即戦力エンジニア養成プログラム【TECH::EXPERT】』