オーダーメイドコース
icon
icon

Webサービスをすぐに動かせる!HerokuでRailsアプリを公開する方法【初心者向け】

Webサービスをすぐに公開できるツール「Heroku」を使って公開手順を紹介。プログラミング初心者向けに、Ruby on Railsで開発したアプリケーションをHerokuで公開する方法を解説しています。無料のフリープランを使って説明。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元:GMOリサーチ株式会社 調査期間:2021年8月12日~8月16日  調査対象:2020年8月以降にプログラミングスクールを受講した18~80歳の男女1,000名  調査手法:インターネット調査

Webサービスを自分の開発環境で開発できたら、いよいよ公開ということになります。この際レンタルサーバーを借りたり、AWSを使ったりすることもできますが、もっと手軽に公開してみたいということもあるでしょう。

そこで今回は、Heroku(ヘロク)を使ってRuby on Railsで開発したアプリケーションを公開する方法をご紹介します。サーバーなどの知識がない初心者でも、手順に沿って操作をすれば簡単に公開することが可能です。この記事を参考にHerokuの使い方を覚えていきましょう。

 

本記事は、オンラインブートキャンプのHerokuのカリキュラムをもとに執筆しています。

 

目次

  1. Herokuとは
  2. Herokuのアカウント登録方法
  3. 事前準備:Railsアプリケーションを作成する
  4. Herokuで公開する

 

Herokuとは

Heroku(ヘロク)とはPaaS(Platform as a Service)と呼ばれるサービスで、アプリケーションを実行するためのプラットフォームです。開発したWebアプリケーションを比較的簡単に公開することができます。また、独自ドメインを割り当てて、Herokuでサービスを運用することも可能です。

Herokuではアプリケーションの実行環境やデータベースなどを提供してくれるため、アプリの開発に集中することができます。

4つのプランがあり、今回は無料のフリープランを使います。

 

[PR] プログラミングで挫折しない学習方法を動画で公開中

Herokuのアカウント登録方法

Herokuを使う準備としてアカウントを登録しましょう。Herokuのアカウント登録ページにアクセスしてください。

アンケートとして使うプログラミング言語が聞かれます。今回はサンプルとしてRuby on Railsを使うので、Rubyを選択しました。

「Create Free Account」をクリックして次に進みましょう。

heroku_01

 

ここで登録したメールアドレスにメールが届きます。メールのリンクをクリックするとパスワード入力画面へ遷移するので、パスワードを決めて次に進んでください。

heroku_02

 

「Welcome to Heroku」と表示されればアカウント登録が完了です。

heroku_03

アカウント登録は特別な操作はなく簡単ですね。

 

事前準備:Railsアプリケーションを作成する

アカウントが登録できたら、事前準備としてRuby on Railsのアプリケーションを用意しましょう。今回はサンプルとして、heroku_first_sampleというファイルを作成しました。

今回はアプリケーション開発について細かく解説しませんが、Ruby on Railsの開発環境を用意する、または、Cloud9で開発するなどの方法で自分で用意しましょう。

 

まずは適当な場所にrailsのプロジェクトファイルを作成します。

$ mkdir sample
$ cd sample
$ rails new heroku_first_sample

 

続いて簡単なビューを生成するためにControllerを作成していきます。

$ rails generate controller sample index

 

ここで一度ローカルサーバーを立ち上げてみましょう。

$ rails s

 

この状態でローカルホストにアクセスし、テンプレートが表示されればOKです。 heroku_04

よりアプリケーションらしく動作させるよう、少しだけ手を加えていきます。

 

テンプレートの書き換え

「Sample#index」のままだとアプリケーションということがわかりずらいので、テンプレートを修正していきましょう。app/views/sample/index.html.erbを編集します。こうすることで、「Welcome to Heroku Application!」と表示されるようになります。

変更前:

<h1>Sample#index</h1>
<p>Find me in app/views/sample/index.html.erb</p>

変更後:

<h1>Welcome to Heroku Application!</h1>

 

ルートの変更

同じくルートも書き換えておきます。TOPページにアクセスした際にアプリケーションが表示されるようにするためです。config/routes.rbを編集します。

変更前:

Rails.application.routes.draw do
get 'sample/index'

変更後:

Rails.application.routes.draw do
root 'sample#index'

これで「Welcome to Heroku Application!」と表示できるようになったはずです。

 

Herokuで公開する

準備ができたらHerokuで公開していきましょう。

 

Railsの環境設定

Railsでは環境ごとにアプリケーションの設定を行うことが可能です。それぞれの設定はconfig/environments/(環境名).rbで設定されています。

※ rails s で起動した場合はdevelopmentモードで起動するようになっています。

環境名 目的
production 本番環境用
development 開発用
test テスト用

 

production環境に必要な設定

本番環境として公開するには設定が必要になります。

 

Gemfileの設定

Rubyで使われるライブラリはGemと呼ばれる形式のパッケージになっています。多くのライブラリがGem形式で公開されており、RubyGems.orgやGitHubでGemを探すことができます。なお、RailsもGemの一つとして公開されています。

Railsアプリケーションの新規作成のとき(rails newコマンドを実行したとき)に、あらかじめGemfileが作成され、自動的にbundle installコマンドが実行され、必要なGemパッケージがインストールされています。

 

また、自分で必要なライブラリなどを追加することも可能です。その際にはgem(Gemパッケージ名)の記述を追加し、bundle installコマンドを実行する必要があります。今回は、Herokuにデプロイ(開発したソフトウェアを利用できるように実際の運用環境に展開すること)を行うとproduction環境で動作するように設定します。

Ruby on RailsではデフォルトでSQLiteのデータベースを使用していますが、Heroku上では使用することができません。そのため、Herokuの推奨DBであるPostgreSQLというDBを使えるようにアプリケーションの設定を変更する必要があります。

 

Gemfileを開き下記のように編集してください。

変更前:

gem 'sqlite3'

変更後:

gem 'sqlite3', group: :development
# 本番ではpostgressを使用する
gem 'pg', group: :production

groupを分けることで、developmentモードではSQLiteを、productionモードではPostgreSQLを使うようにしていきます。

Gemfileを更新したら、下記のコマンドを利用して関連するgemをインストールしましょう。

$ bundle install

 

データベースの設定

PostgreSQLを使う準備はできましたが、その他にproduction環境のデータベースを設定する必要があります。そこで、config/database.ymlの中身を見てみましょう。testやdevelopmentなど環境ごとの設定が書いてあることがわかるはずです。

productionの項目を下記のように変更しましょう。

production:
 <<: *default
 adapter: postgresql
 encoding: unicode
 pool: 5

この際、ymlファイルのインデントは半角スペース2つで行い、全角空白でインデントしないように注意してください。

これで、adapterの項目をpostgresqlを設定することにより、production環境ではデータベースをPostgreSQLに変更することができるようになりました。

 

Herokuのアプリケーション作成

Heroku上にアプリケーションを配置するには、Herokuでアプリケーションを作成し、gitでHerokuが用意したGitリポジトリに対してプッシュする必要があります。

 

Herokuにアプリケーションを作成する

heroku createコマンドを使ってHerokuにアプリケーションを作成します。

$ heroku create (Herokuアプリケーション名)

入力時にHerokuのメールアドレスとパスワードを求められるので入力してください。

なお、(Herokuアプリケーション名)の部分はHerokuの他のアプリケーションと重複することができません。 例えば「(Herokuアカウント名)-message-board」など、ユニークな名前を指定してください。

 

Herokuにアプリケーションをデプロイする

Herokuにアプリケーションが作成できると、gitのリモートリポジトリが1つherokuという名前で登録されます(Gitについてよくわからない場合はGitHubの使い方をご覧ください)。Herokuのgitリポジトリのmasterブランチへpushすることにより、Heroku上で自分が作ったRailsアプリケーションを動かすことができます。

下記のコマンドを実行してHerokuへアプリケーションをデプロイしてください。

$ git push heroku master

現在の作業しているブランチが masterでない場合には、以下のように現在の作業ブランチから Heroku の master ブランチへpushします。

$ git push heroku 現在のブランチ名:master

 

Herokuでマイグレーションを実行する

Heroku上でデータベースを初期化していないので、このままHeroku上のWebアプリケーションにアクセスするとエラーが発生してしまいます。そこでheroku runコマンドを用いることにより、Heroku上でRakeコマンドが使えるようにします。

下記のコマンドを実行しましょう。

$ heroku run rake db:migrate

Heroku上でマイグレーションが実行できれば、成功です。

 

Herokuへのデプロイのトラブルシューティング

デプロイの際にエラーメッセージ(“remote: !” で始まる行)が表示される場合には、以下の3点を確認してみましょう。

  • Gemfileで必要なGemが正しく指定できているか
  • confif/database.yml の変更が正しくできているか
  • 修正後に正しくGitリポジトリへの追加が行えているか(git logコマンドで確認することができます)

 

Heroku上のWebアプリケーションにアクセスする

ここまでの操作でHerokuにデプロイが完了して、データベースの準備もできている状況です。下記のURLにアクセスして、動作確認を行ってください。(Herokuアプリケーション名)の部分は、heroku createコマンドを実行する際に指定したアプリケーション名です。

http://(Herokuアプリケーション名).herokuapp.com

ローカル環境で動作していたものと同じアプリケーションを見ることができれば正常に動いていることになります。

heroku_05

さいごに

Herokuのフリープランではアクセスが30分間ない場合は、アプリがスリープしてRailsが起動していない状態になります。また、1日6時間以上はスリープさせる必要があります(スリープ状態になっても再びアクセスすればRailsは起動します)。

そのため、常時起動が必要な場合はHobbyプラン(有料)などを検討しましょう。

heroku料金プラン

 

今回の記事は以上です。

ぜひ自分で使ってみてください。

[お知らせ]TechAcademyでは、最短4週間でオリジナルWebサービスが開発できるオンラインブートキャンプを開催しています。作ったサービスはHerokuで公開します。