git pushでDocker環境をHerokuにデプロイする

### 初めてHerokuを使ったので方法をまとめました

githubに変更をpushしたら自動でHerokuにデプロイできるようにしています。
今回はLaravelですが、他言語でもBuildpackの言語や環境変数を変えて使えると思います。

# 環境
- mac OS Catalina 10.15.6
- Docker version 19.03.12
- Laravel 7.22.4
- Heroku CLI 7.42.8

# 前提

- LaravelのDocker環境（↓で作成）

    [【初心者向け】20分でLaravel開発環境を爆速構築するDockerハンズオン - Qiita](https://qiita.com/ucan-lab/items/56c9dc3cf2e6762672f4)

- フォルダ構成はこんな感じ

   ```:termianl
    .
    ├── README.md
    ├── docker
    │   ├── mysql
    │   ├── nginx
    │   └── php
    ├── docker-compose.yml
    ├── logs 
    └── src(Laravelプロジェクトフォルダ)
        ├── Procfile(後ほど作成します)
    	├── app
        ├── artisan
        ├── bootstrap
        ├── ...
   ```

- Laravelアプリは作成済み(/src配下)
- Herokuは初導入


# やり方

### 1.  Herokuに登録
https://jp.heroku.com/
![スクリーンショット 2020-08-22 23.11.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649853/2d032ae4-8d88-eb30-d9b5-9de7203e8e15.png)

### 2.  Heroku CLI インストール。その後 `heroku login` で設定
インストールコマンド 

```
　　brew tap heroku/brew && brew install heroku
```
ログインコマンド

```:terminal
   $ heroku auth:login
   Enter your Heroku credentials:
   Email: [ユーザ登録したときのメールアドレス]
   Password: [ユーザ登録したときのパスワード]
   Logged in as [ユーザ登録したときのメールアドレス]
```
これでコマンドラインで操作できるようになりました。
### 3.  アプリを作成
ここでつけた名前がURLの一部になります。

   ```:terminal
    $ heroku create [アプリケーション名]
    Creating ⬢ [アプリケーション名]... done
    https://git.heroku.com/[アプリケーション名].git
   ```

### 4. githubと連携
作成したアプリの画面から、Deplyの `Deployment method`でGithubを指定して連携します。
`Automatic Deploy`も設定してgit pushによる自動デプロイを設定します。

![スクリーンショット 2020-08-22 23.14.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649853/19bf4a85-54ec-87b5-c042-8602cfed6f5e.png)


### 5. 環境変数を設定

   Laravelの `.env`ファイルはgitignoreでバージョン管理に含めないのが普通です。
そのため `.env`に含まれる環境変数をHerokuに登録します。

   - 登録方法は2種類　
     参照：[https://devcenter.heroku.com/articles/config-vars](https://devcenter.heroku.com/articles/config-vars)
    
#### 方法1. CLI

 ```:terminal
        heroku config:set DB_CONNECTION=pgsql
 ```

   のようにしてコマンドラインで登録します。

#### 方法2. Herokuサイト

![スクリーンショット 2020-08-22 13.59.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649853/717ca64c-2f96-8a1b-9cf8-4ea73da8bb20.png)



   ここの `Config Vars`を使って登録します。

   Laravelの場合は `APP_KEY`は忘れずに登録しましょう。

### 6.  DB連携

ローカル開発ではMySQLを使っていましたが、HerokuではPostgreSQLをおすすめしています。

   フリープランは

   - MySQL　5MB(メガバイト)
   - PostgreSQL 1GB

    という雲泥の差だったのでPostgreを使います。

   - Heroku Postgresを追加する

      参考：[https://devcenter.heroku.com/articles/heroku-postgresql](https://devcenter.heroku.com/articles/heroku-postgresql)

       ```:terminal
        heroku addons:create heroku-postgresql:hobby-dev
       ```

      でPostgreSQLを紐付けます。 `hobby-dev`で無料プランを選択しています。

       もし、以下のようなエラーが出たら、

       ```:terminal
        $ heroku addons:create heroku-postgresql:hobby-dev  
         ›   Error: Missing required flag:
         ›     -a, --app APP  app to run command against
         ›   See more help with --help
       ```

       `-a`でアプリの名前を追加してあげましょう。

       ```:terminal
        heroku addons:create heroku-postgresql:hobby-dev -a アプリ名
       ```

       作成が完了すると、自動的に環境変数にこのデータベースのURLが登録されています。

       登録された環境変数は下のコマンドで確認できます。

       ```:terminal
        heroku config -a アプリの名前
       ```

       DB設定を環境変数に入れます。

       ```:terminal
        $ heroku config:set DB_CONNECTION=pgsql
        $ heroku config:set DB_HOST=[ホスト名]
        $ heroku config:set DB_PORT=[ポート]
        $ heroku config:set DB_DATABASE=[データベース名]
        $ heroku config:set DB_USERNAME=[ユーザ名]
        $ heroku config:set DB_PASSWORD=[パスワード]
       ```

### 7. Procfileを作成

   プロジェクトのルートに↓の内容で `Procfile`というファイルを作ります。

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

   これでheroku起動時にapacheサーバーが起動するようになります。

  参考：[https://devcenter.heroku.com/articles/php-support#web-servers](https://devcenter.heroku.com/articles/php-support#web-servers)

### 8.  git pushしてデプロイ！

   今回こちらの記事を参考にします。

   [Heroku buildpack to support deployment from subdirectory](https://medium.com/@timanovsky/heroku-buildpack-to-support-deployment-from-subdirectory-e743c2c838dd)


   これを使い、herokuにサブディレクトリ(/src)に置いたLaravelアプリだけをherokuに認識させます。
   これによってDocker環境の他のファイルを無視してのデプロイが可能になります。

   方法：まずこのbuildpackを導入します。

   ```:terminal
    heroku buildpacks:set https://github.com/timanovsky/subdir-heroku-buildpack
   ```

   次にHeroku公式のbuildpack(今回はPHP)を導入するように追加します。

   ```:terminal
    heroku buildpacks:add heroku/php
   ```

サイト上で見るとこんな感じです。
![スクリーンショット 2020-08-22 23.51.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/649853/e40b6080-c5ff-3529-cfa3-5b7908bdc344.png)


   環境変数でデプロイさせたいフォルダ(src)を指定します。

   ```:terminal
    heroku config:set PROJECT_PATH=src/
   ```

   最後にgit pushでデプロイされます！

   `アプリ名.herokuapp.com`にアクセスして確認しましょう。

### 9. マイグレーション＆シーディング

   ```:terminal
    heroku run "php artisan migrate" -a アプリ名
    heroku run "php artisan db:seed" -a アプリ名
   ```

以上でデプロイ完了です。
おつかれさまでした。


**参考**
[Herokuで公開してみよう](https://team-lab.github.io/skillup/step2/10-heroku.html)
次の3点を変更しています。

- githubとの連携
- 環境変数の登録方法
- git pushしてデプロイする方法