40
49

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

[初心者向け]herokuをデプロイしよう

Last updated at Posted at 2020-04-10

herokuとは

開発したWEBアプリケーションを10分程度で全世界に公開することができ、そのままサービスを本格的に運用することも可能なホスティングサービスの事を指します。

実行と流れ

まず前提としてデプロイしたいアプリが作成済み、GitHubにアカウント登録済み、GitHubにリポジトリを作成済みという前提でお話しして行きます。今回はrailsで作成したアプリをデプロイしていきます。
流れとしては以下になります。

herokuアカウント作成→Heroku Toolbelt (CLI)のインストール→デプロイ

1.アカウント作成

herokuに登録してアカウントを作成
(1)herokuの公式サイトにアクセス
sign upボタンを押す

a.png

(2)下記の赤枠の部分を入力
a.png

(3)下記のページが出れば成功
a.png

その後メールが届くと思うので、メールからリンクをクリックしてアクセス。

(4)リンク先でパスワードを決定する。下記の画像の通り入力

a.png

(5)下の画像のページに遷移するので、画像の通りクリック。
a.png

下記のページに遷移する。
a.png

以上で、会員登録は終了。

2 Heroku Toolbelt (CLI)のインストール

(1)下記のボタンを押し、ソフトをダウンロード
以下のリンクにアクセス
https://devcenter.heroku.com/articles/heroku-cli
a.png
mac版をインストールして解凍する

(2)下記の指示通りに、インストールを完了させる
a.png
(3)下記の画像が出てきたら、続けるを押す
a.png
以下も同様に続けるを押す
a.png
(4)インストールを押す
スクリーンショット 2020-04-10 20.03.03.png
(5)PCのパスワードを入力する
a.png
(6)下記の画像が出たら、インストールは終了
a.png
3 Heorkuにターミナルからログインしてサーバーを設定しよう

#デプロイしたいアプリのディレクトリパスに移動

$ cd [移動したいディレクトリのパス]

#herokuにログイン。

$ heroku login 

注意点として事前にローカルでデプロイしたいアプリは全てコミットしてプッシュしておく必要がある。


git add .
git commit -m "コミット"
git push origin master  //masterを更新

そのあとheroku create サーバーの名前 という構成でターミナルにタイプすれば
サーバーの構築をすることができる。

#サーバー名は例

$ heroku create ○○

上記サーバーの名前がHerokuのトップ画面より確認できたら、
それではいよいよデプロイする!

デプロイとリリース後の確認

#herokuのサーバに、アップロードするためのコマンド

$ git push heroku master

#今回はPostgresqlを使ったアプリを本番リリース。DB設定

$ heroku run rake db:migrate

もし以下のエラーが出たならば

remote:  !
remote:  !     Precompiling assets failed.
remote:  !


アセットのプリコンパイルの設定でエラーが起こっていることを疑ってみて下さい。
プリコンパイルとは

アセットを事前に
1.コンパイル
2.統合
3.圧縮
4.ダイジェスト付与
する行為のことを指します。コンパイルというのはSASSやVue.js、Reactなどで書かれたコードを素のCSSやJavaScriptに変換する処理です。
Rails Ver.5だとアセットコンプラインという機能がプリコンパイルをやっていて、sporockets-railsというgemで実装されています。

エラー解消法


config/environments/production.rbの

config.assets.js_compressor = :uglifier
をコメントアウトする。

その後、
$ git push heroku master
を実行するとエラーが解消されると思います。

ターミナル上で以下のような記述があると思うので「(例)https://○○.herokuapp.com」がデプロイ後のURLになります。
remote:        https://○○.herokuapp.com/ deployed to Heroku
remote: 
remote: Verifying deploy... done.
To https://git.heroku.com/○○.git

エラー解消後は$ heroku run rake db:migrateを忘れずに実行

40
49
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
40
49

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?