カテゴリー
サインイン 新規登録

間違いや改善の指摘

内容の技術的な誤り・誤字脱字やミスのご報告・解説やトピックの追記/改善のご要望は教材をさらに良くしていく上でとても貴重なご意見になります。

少しでも気になった点があれば、ご遠慮なく投稿いただけると幸いです🙏

実際には誤りではなく勘違いであっても、ご報告いただけることで教材のブラッシュアップにつながります。

質問ポリシー①

教材受講者みなさんのスムーズな問題解決のために、心がけていただきたいことがあります。

教材の内容に関する質問を投稿しましょう

教材の内容に関係のない質問や教材とは異なる環境・バージョンで進めている場合のエラーなど、教材に関係しない質問は推奨していないため回答できない場合がございます。

その場合、teratailなどの外部サイトを利用して質問することをおすすめします。教材の誤字脱字や追記・改善の要望は「文章の間違いや改善点の指摘」からお願いします。

6-1

Herokuを使ってサービスを世の中に公開しよう (macOS)

この章ではローカルで開発したWebアプリケーションをHerokuを使って公開します。Herokuを使うことでHerokuのドメインが当てられるため、自分のPC以外からも見ることが可能になります。

実際に作ったサービスを友達に見せて自慢しましょう!

本パートの目標物

このパートではHerokuを使って、Railsアプリケーションを公開するところまで実装します。

image

目標物を作成するまでの流れ

  1. The Heroku CLIの設定
  2. Herokuにログイン
  3. Herokuにデプロイ

では実際に進めていきましょう。

Heroku とは

HerokuとはWebアプリケーションを簡単に全世界に公開できるクラウドプラットフォームです。

参考)HEROKU とは

以下のURLからHerokuのユーザー登録を行います。ユーザー登録は無料です。

https://signup.heroku.com/jp

登録後、以下のような画面が表示されることを確認してください。

image

1. The Heroku CLIの設定

The Heroku CLIをインストールすることで、Herokuのコマンドが使えるようになります。

下記のリンクからOSを指定してダウンロードしてインストールを完了させてください。

https://devcenter.heroku.com/articles/heroku-cli

2. Herokuにログイン

The Heroku CLIをインストールしたので、ターミナル上でHerokuのコマンドが使えるようになりました。

早速ターミナルからHerokuにログインしましょう。

Herokuへアップロードしたいアプリのディレクトリへ移動し、「heroku loginコマンド」を実行してください。

loginコマンド実行後、herokuに登録したメールアドレスとパスワードの入力が必要です。

Copied!
$ cd kanban # kanbanの部分を自分の作ったアプリ名にします $ heroku login # herokuにログインする Enter your Heroku credentials: Email:

メールアドレスとパスワードの入力が完了すると以下のように表示されます。

Copied!
Logged in as 入力したメールアドレス

上記の様に表示されていればログイン完了です。

3. Herokuにデプロイ

HerokuではPostgreSQLデータベースを使います。

なので、PostgreSQLをインストールしていきます。

以下のコマンドをターミナルで実行してください。(既にインストールされている方はインストールしなくて大丈夫です。)

Copied!
$ brew install postgresql

インストールが完了したら、本番 (production) 環境にpg gemをインストールしてRailsがPostgreSQLと通信できるようにします。

以下のコードをGemfileの最下部に追加してください。

Copied!
kanban └── Gemfile
Gemfile
1
Copied!
gem 'pg', group: :production # この1行を追加

また、HerokuではSQLiteがサポートされていないため、sqlite3 gemが本番環境に導入されないようにします。

Gemfileのsqlite3の箇所を以下のように編集してください。

Copied!
kanban └── Gemfile
Gemfile
1
Copied!
gem 'sqlite3', '~>1.4', group: :development # group: :developmentの記述を追加

group: :developmentはdevelopment環境でインストールするという意味になります。

pg gemは本番用のgemでローカル環境にはインストールしないようにします。その場合、bundle install--without productionを追加します。このフラグを追加することで、pg gemはローカル環境には反映されないようになります。それでは以下のコマンドを実行してください。

Copied!
$ bundle install --without production

次に「heroku create アプリ名」コマンドでheroku上にアプリケーションを作成します。
以下のコマンドを実行してください。

Copied!
$ heroku create

上記のコマンドを実行すると、以下のような結果が表示されます。

Copied!
Creating app... done, ⬢ kanban https://kanban.herokuapp.com/ | https://git.heroku.com/kanban.git

https://~~.herokuapp.com/が上記のコマンドで作成されたサブドメインです。

この時点でブラウザに表示可能ですが、今はまだ何もありません。デプロイしてWebページを表示させましょう。

RailsアプリケーションをHerokuにデプロイするには、まずGitを使ってHerokuにリポジトリをプッシュします。

Copied!
$ git add . $ git commit -m "initial commit" $ git push heroku master

上手く行くと、下記のようにremote: Verifying deploy... done.と表示されます。

Copied!
. . . remote: Verifying deploy... done. To https://git.heroku.com/.git * [new branch] master -> master

gitをまだインストールしていないもしくは、理解出来ていないという方は以下サイトがおすすめです。

参考)サルでもわかるGit入門

次に以下コマンドでmigrationを実行します。ローカル環境で行なっていたrails db:migrateのコマンドを本番環境でも行うというイメージです。

Copied!
$ heroku run rails db:migrate

上記のコマンドを実行したら、以下のコマンドを実行してWebページを表示させましょう。

Copied!
$ heroku open

下記の画像のように、サインインページが表示されれば、うまく動作しています。

image

以上で本教材は終了です。

Railsを使って、どのようにWebアプリケーションを作っていくか大まかな流れは把握できたかと思います。

よりRailsを理解するには本教材をもう1回進めたり、今回作成したアプリケーションをアレンジしてみましょう。アレンジするにはもともと書いてあるコードを理解しないとできないことなので、コードを書き換えることでより理解が深まります。また、アレンジするだけでなく、追加機能を実装するのもおすすめです。

お疲れさまでした!

現在のパート (10)
全パート (121)
みんなで助け合おう!
現在のパートのディスカッション 全10件
6-1
波多野諒 2021-10-23
The Heroku CLIをインストールできない。

発生している問題

The Heroku CLIをインストールしたところエラーが発生した。

エラー画面をスクショで添付してください

(ドラッグ & ドロップで添付できます)

Error: Cannot install in Homebrew on ARM processor in Intel default prefix (/usr/local)!
Please create a new installation in /opt/homebrew using one of the
"Alternative Installs" from:
https://docs.brew.sh/Installation
You can migrate your previously installed formula list with:
brew bundle dump

このようなエラーでした。

試したこと

問題に対して試したことを記載してください。

補足情報(フレームワークのバージョン・OS)

Rails 6.1・Mac OS

6-1
kyohhh 2021-05-19
herokuデプロイ時にエラー発生

発生している問題

git push heroku masterコマンドでHeorkuにpushしてもデプロイできない。

エラー画面をスクショで添付

試したこと

エラーログに、ActionController::RoutingError (No route matches [GET] "/"):と出ていたので

上記、2点を確認後、
再度、git push heroku masterコマンドをしましたが状況は変わりませんでした。

お忙しいとは思いますが、ご対応宜しくおねがいします。

補足情報(フレームワークのバージョン・OS)

Rails 6・Mac OS big sur11.3

6-1
退会ユーザー 2021-03-10
質問です

はじめまして
エラーの詳細と解決法がわかりませんでした
解決方法を教えていただけますでしょうか

発生している問題

git push heroku masterが失敗する
Failed to install gems via Bundler.と表示されます

エラー画面をスクショで添付してください

スクリーンショット 2021-03-10 17.14.10.png

試したこと

問題に対して試したことを記載してください。

補足情報(フレームワークのバージョン・OS)

Rails 5.1・Mac OS

6-1
クロ 2020-12-15
デプロイについて

初めまして!
内容が丁寧で、とても分かりやすく、初心者なので本当に勉強になりました!

こちらの教材を参考にして(アレンジして)、オリジナルのコンセプトのアプリを作り、デプロイさせて頂きたいのですが、大丈夫なのでしょうか?

(ポートフォリオにしたいです)

お忙しいかとは思いますが、ご返信頂けたら幸いです!

6-1
坂大和輝 2020-10-27
質問です。

お世話になっております。
<3. Herokuにデプロイ>のgit push heroku masterを実行した際に下記のエラーが発生致しました。
error: src refspec master does not match any
error: failed to push some refs to 'https://git.heroku.com/aqueous-hamlet-19256.git'

スクリーンショット
https://techpit-market-prod.s3.amazonaws.com/uploads/question_attachment/file/1275/403616e8-b5d0-4e55-be2b-95c156206ddf.png

エラー文を検索したところ、内容が不一致部分があるとの事ですので、変更中のファイルを確認致しました。

お忙しいところ恐れ入りますが、ご確認頂けますと幸いです。