入門Laravelチュートリアル (11) ToDoアプリをHerokuにデプロイする

この連載記事では、Laravel を使用した Web アプリケーションの開発方法を紹介します。実際に（お決まりの？）ToDo アプリを開発する手順を通して Web 開発のエッセンスを学んでいただけるように書いていきます。取り扱う Laravel のバージョンは現時点で最新の 5.7 です。

電子書籍版も公開しています。

最後の第11章では、前章までで作成したアプリケーションをインターネットに公開する方法を紹介します。Heroku というクラウドサービスを利用すれば無料で簡単に公開することができます。

Heroku とは

Heroku はクラウドサービスの中でも PaaS（Platform as a Service）と呼ばれるジャンルに属します。「Platform as a Service」とは「プラットフォーム」つまりアプリケーションの実行環境をサービスとして提供する、という意味です。

Web アプリケーションをインターネットに公開したい！と思ったとき、実行環境の構築は結構面倒な作業です。まずはサーバーを用意した上で、プログラミング言語の処理系、Web サーバー、データベース、必要なライブラリやフレームワークをインストールし、それぞれが個別にかつ連携して動作するように適切に設定しなければいけません。

PaaS である Heroku はその作業をすべて吸収してくれるサービスです。コマンド一発でクラウド上に実行環境を作成して Git からソースコードをアップロードすれば、必要な構成が自動的にセットアップされ、パブリックな URL にアプリケーションが公開されます。

個人開発やプロトタイプ開発など小規模プロジェクトのメリットは、ベーシックな構成のインフラ構築に工数を割かなくて済む点でしょう。中規模以上のプロジェクトでもサーバーの追加が容易に行える（構築し直さなくていい）というメリットがあります。

ちなみにクラウドサービスとして有名な AWS は IaaS（Infrastructure as a Service）と呼ばれます（いまやサービスメニューが拡大して PaaS 的なサービスも持っていますが）。インフラをサービスとして提供する、つまりインフラは提供するからその中に何を入れてどう使うかは任せますよ、ということですね。

PaaS と IaaS の違いは自由度・カスタマイズ性です。IaaS は言わば箱だけ用意するということなので、その箱の中は開発者の自由です。PaaS は箱の中身まで詰めて提供してくれます。複雑・特殊な構成を求めるか、迅速性・容易性を求めるか...などで選択が変わってくるでしょう。

準備

アカウントを作成する

まずは以下のページから Heroku のアカウントを作成しましょう。
クレジットカード情報も必要なく、無料でサインアップできます。

https://signup.heroku.com/login

Heroku CLI

次に以下のリンクから Heroku CLI というコマンドラインツールをインストールします。

https://devcenter.heroku.com/articles/heroku-cli#download-and-install

アプリケーションの公開など、ターミナルから Heroku の操作をする専用コマンドです。

Heroku に新規アプリを作成する

Heroku に新しいアプリケーション動作環境を作成します。

ここから、先ほどインストールした Heroku CLI を使っていきます。まずログインしてください。

$ heroku login

heroku: Press any key to open up the browser to login or q to exit:

q 以外のキーを押すとブラウザが開きます。作成したアカウント情報を入力しましょう。正常にログインできたらターミナルに戻ってください。

create コマンドで新しいアプリケーション動作環境を作成します。

$ heroku create

Creating app... done, ⬢ afternoon-dawn-77644
https://afternoon-dawn-77644.herokuapp.com/ | https://git.heroku.com/afternoon-dawn-77644.git

最終的に上記のように「done」というメッセージとランダムに決まるアプリケーション名、公開先の URL が出力されれば OK です。

アドオンを追加する

ここまでで PHP アプリが動作する Web サーバーはできたと考えてください。簡単ですね。ただ、このチュートリアルで作ってきたアプリケーション（そして世の中の大半のアプリ）は、Web サーバーだけでは動作しません。データベースも必要です。

Heroku ではデータベースはアドオンという形で提供しています。パーツを組み合わせるように簡単に Web サーバーとデータベースを繋ぎこむことができます。

PostgreSQL

Heroku CLI からでもアドオンを追加できますが、ダッシュボード画面も触ってみましょう。画面からログインすると、以下のように作成したアプリが並んだダッシュボード画面にアクセスできます。先ほど作成したアプリケーションが表示されていますか？

先ほど作成したアプリ名を選んでさらに「Resources」タブを選択します。アドオンの管理はこの画面で行います。検索窓で「postgres」と入力すると候補が出てきますので「Heroku Postgres」を選んでください。

確認ダイアログが表示されますので、プランが「Hobby Dev - Free」であることを確認して「Provision」をクリックします。

ダイアログが閉じて Add-ons 検索窓の下に「Heroku Postgres」が追加されていれば OK です。

ここまででデータベースは用意されましたが、Laravel アプリから接続しに行くためには設定の追加が必要です。パソコン上の開発環境では .env に接続情報を記述しましたが、.env は接続パスワードなどセンシティブな情報を記述するため、ふつう Git の管理下には置きません。Git の管理下には置かないということは Heroku にもアップロードできないのですが、Heroku では .env に記述していた内容を別途設定するための画面や機能が用意されています。

アドオン Heroku Postgres を追加した時点で接続情報は設定されているので、コマンドラインから見てみましょう。

$ heroku config:get DATABASE_URL

postgres://xxxxx:yyyyy@ec2-zz-zz-zzz-zz.compute-1.amazonaws.com:5432/abcd1234

DATABASE_URL の設定内容を出力しています。Laravel は DATABASE_URL という項目名では理解できないので、DB_USERNAME や DB_PASSWORD などにバラして設定してやる必要があります。

DATABASE_URL で表される接続 URL は以下の形式になっています。

postgres://DB_USERNAME:DB_PASSWORD@DB_HOST:5432/DB_DATABASE

それぞれ config:set コマンドで設定します。DB_CONNECTION は pgsql に設定してください。

$ heroku config:set DB_CONNECTION=pgsql
$ heroku config:set DB_HOST=ec2-zz-zz-zzz-zz.compute-1.amazonaws.com
$ heroku config:set DB_DATABASE=abcd1234
$ heroku config:set DB_USERNAME=xxxxx
$ heroku config:set DB_PASSWORD=yyyyy

SendGrid

PostgreSQL と同じ要領で、今度はメールサーバを用意します。開発時はテストとして Mailtrap を使っていましたが、本当にメールを送信できる環境を整えます。

アドオンの検索窓で「sendgrid」で検索して「SendGrid」を選択してください。こちらも無料プランがありますので、「Starter」プランを利用しましょう。

SendGrid アドオンを追加できたら Laravel がメールサーバーと通信するための設定を行います。

$ heroku config:set MAIL_HOST=smtp.sendgrid.net
$ heroku config:set MAIL_USERNAME=$(heroku config:get SENDGRID_USERNAME)
$ heroku config:set MAIL_PASSWORD=$(heroku config:get SENDGRID_PASSWORD)

ここまでで準備は完了です。
アプリケーションをアップロードしてインターネットに公開しましょう。

デプロイ

Procfile を作成する

まず Procfile という Heroku 向けの設定ファイルを作成します。

$ touch ./Procfile

以下の内容を記述してください。

web: vendor/bin/heroku-php-apache2 public/

Procfile　はアップロードしたアプリケーションを動作させるためにどのような環境を用意するかを指定しています。言語やフレームワークによって特定の内容を記述するので、場合に応じて「Heroku Procfile フレームワーク名」などで検索すると記述内容を調べられるでしょう。

アップロード

Heroku へのアップロードは Git を利用しますので、先にアプリケーションコードを Git の管理下に置いてから、heroku create したときに設定された heroku リモートリポジトリにプッシュすると自動的にそのコードがアプリケーション実行環境にも送信され、配置されます。

$ git init
$ git add .
$ git commit -m "first commit"
$ git push heroku master

APP_KEY

アプリケーションをアップロードできたら、まずは APP_KEY の設定を行います。セキュリティ関連の機能で暗号化に使ったりと重要な設定項目で、これがないと Laravel は動いてくれません。

$ heroku config:set APP_KEY=$(php artisan --no-ansi key:generate --show)

composer create-project コマンドで Laravel プロジェクトを新規作成するときに自動的に設定されるのですが、今回は新規作成ではなく既存のコードを持ってきているだけなので手動で設定してやる必要があります。

マイグレーション

最後にマイグレーションを実行します。データベースの状態はマイグレーションファイルで管理しているので、本番公開のときもマイグレーションコマンド一発でテーブルが構築できます。

heroku 環境でコマンドを実行するには、heroku run コマンドを使用します。

$ heroku run "php artisan migrate"

Running php artisan migrate on ⬢ afternoon-dawn-77644... up, run.2845 (Free)
**************************************
*     Application In Production!     *
**************************************

 Do you really wish to run this command? (yes/no) [no]:
 > yes

Migration table created successfully.
Migrating: 2014_10_12_000000_create_users_table
Migrated:  2014_10_12_000000_create_users_table
Migrating: 2014_10_12_100000_create_password_resets_table
Migrated:  2014_10_12_100000_create_password_resets_table
Migrating: 2018_11_25_121216_create_folders_table
Migrated:  2018_11_25_121216_create_folders_table
Migrating: 2018_11_25_155051_create_tasks_table
Migrated:  2018_11_25_155051_create_tasks_table
Migrating: 2018_12_02_165556_add_user_id_to_folders
Migrated:  2018_12_02_165556_add_user_id_to_folders

開発環境ではない環境でマイグレーションを実行すると途中で本当にやっていいか訊かれますので「yes」を入力しましょう。

ブラウザで開く

これで公開作業は完了です

heroku open コマンドでアプリケーションがブラウザに開かれます。

$ heroku open

いろいろな機能が使えるか確認してみましょう！
データの登録はできていますか？メールは受信できているでしょうか？

アプリケーションを更新したときは

heroku リポジトリにプッシュしたコードが実行環境に再配置される仕組みです。
最初にアップロードしたときと同様に、まずは git でコミットしてプッシュすれば OK です。

$ git add .
$ git commit -m "コミットメッセージ"
$ git push heroku master

第11章はこれでおしまいです。
ここまでのソースコードはリポジトリ（chapter11 ブランチ）を参照してください。

全11回のチュートリアルで Laravel アプリケーションの開発から公開までを紹介してきましたが、いかがでしたでしょうか。Laravel にはまだまだ紹介していない機能がたくさんありますので、もっと知りたい・開発してみたいと思うきっかけになれば幸いです。

連載記事

• 入門Laravelチュートリアル (1) イントロダクション
• 入門Laravelチュートリアル (2) ToDoアプリケーションの設計
• 入門Laravelチュートリアル (3) ToDoアプリのフォルダ一覧表示機能を作る
• 入門Laravelチュートリアル (4) ToDoアプリのタスク一覧表示機能を作る
• 入門Laravelチュートリアル (5) ToDoアプリのフォルダ作成機能を作る
• 入門Laravelチュートリアル (6) ToDoアプリのタスク作成機能を作る
• 入門Laravelチュートリアル (7) ToDoアプリのタスク編集機能を作る
• 入門Laravelチュートリアル (8) ToDoアプリの認証機能を作る
• 入門Laravelチュートリアル (9) ToDoアプリの認証機能を作る パート2
• 入門Laravelチュートリアル (10) エラーハンドリング
• 入門Laravelチュートリアル (11) ToDoアプリをHerokuにデプロイする