yotigory 前回は、手動でデータをダウンロード・公開していましたが、Webhook を使って自動化できます！
Webhookとは、あるアプリケーションにイベント（きっかけ）が発生すると、指定されたアプリケーションに向けて「お知らせ」を送る仕組みです。次に処理を行なってほしい走者にバトンを渡すイメージです。
Shifter は、新しいアーティファクトが完了（デプロイが完了）すると、指定されたアプリケーションに向けて、「お知らせ」を送ります。
「お知らせ」の中身は、サイトID、アーティファクトID、データをダウンロードするための URL になります。
今回やること
Shifter で作った静的サイトを別サーバー（Netlify）に公開します。
これで、Shifter でデプロイするだけで、別サーバーにデータが公開されます。
必要なアカウント
- Shifter （Tier 2 以上のプランが必要です）
- GitHub
- Netlify
やってみましょう！
「お知らせ」を受けた Netlify にしてほしいことを設定する
Netlify に Shifter からのデータを公開するための設定は、すでに公式の Shifter GitHubリポジトリにありますので、これを使います。
Github にログイン後、下記URL にアクセスして、Fork （自分の Github アカウントに複製）します。
↓このまま特に変更することはなく「Create fork」をクリックします。
↓はい、これで 自分の Github アカウントに複製できましたー！
このフォークしたプログラムに、なにが記載されているのかと言いますと、「お知らせ」を受け取った後に Netlify がやることが命令として記載されています。
- Webhook で送信されたダウンロード URL からデータをダウンロード。
- ファイルを展開。
- 指定のディレクトリに公開。
次に、 Netlifyにサイトを作成して、Git（命令） と連携させます。
Netlify にログインして、「Add new site」 をクリックし、サイトを作成します。
↓[GitHub]を指定して、認証を許可します。
↓認証すると、Git のレポジトリがリスト表示されます。
↓Git の設定画面が開くので、ここで「webhook-artifact-created」を選択。
↓表示されました！これを選択します！！
↓特に変更することはないと思いますが、枠のところはこんな感じです。
最後に「Deploy site」をクリックします。
↓エラーが表示されますが、これは正しいエラーです。
設定が終わり「Deploy site」をクリックしたことで、Netlify がデプロイを開始します。
ですが、まだ Shifter から「お知らせ(ダウンロードURL)」を受け取っていません。
なので今はエラーで問題ありません。次に進みましょう！
最後に Webhook URL を Shifter に設定して、仕組みを完了しましょう。
これは「お知らせ」をどこに送るかを指定するものです。
「お知らせ」を受け取る側の Netlify の管理画面で設定・取得します。
先ほど作ったサイトの設定画面を開きます。
↓サイドバー「Build & deploy」を選択して、画面をスクロール。
「Build hooks」の「Add build hook」をクリックします。
↓「Build hook name」にわかりやすい名前をつけます。そして「Save」。
↓「Webhook URL」が発行されますので、これをコピーしておきます。
Shifter の管理画面に戻って Webhook を設定します！
Shifter Webhooks を使うためには、プランはTier 2以上を選択する必要があります。
サイドバー設定のサイト設定ページで「公開サイトへの自動デプロイ」をオフにしてください。
オフにしていないと、Shifter 上でサイトが公開されてしまいます。
では、Shifter Webhooks の設定をします。
「開発環境」＞「Webhooks」の画面にある「新しい Webhooks を追加する」をクリック。
↓イベントタイプ、メソッド、URL（Netlify で取得してコピーした Webhook URL）を入力します。
↓追加されると、リストとして表示されます。
これで、準備はオッケーです！できました！
デプロイして Webhook の実行を確認してみましょう！
では、Shifter でサイトを更新して、管理画面から「デプロイする」をクリックしましょう。
待ちます…
ぼんやり待っててもいいんですが、ここはちょっと時間がかかるので、このまま放置しとくのがいいかも。
デプロイが完了するとメールでお知らせが届きますので、それから確認してみましょう。
Webhook の確認の仕方
↓デプロイが完了すると、Webhook が実行され、Shifter の管理画面に履歴が表示されます。
公開は、Netlify 側で確認をしましょう
↓「Deploys」のところ！Published となっていますね！！！
↓サイト表示も確認してみましょうー！見えてますねー！
ちょっと長かったですが、一度やってしまえばあとは楽々運用ができるので、やった価値ありです！
補足情報
公式ドキュメント：Webhook を手動で再実行できるようになりました
↓こちらの記事にも、今回と同じ内容が記載されています。こっちの方がすっきりしてるかも（好みで参照してくださいw