Gatsby を使って新しく備忘録ブログを作成した - part 2

📅 August 25, 2019

⏱️2 min read

Gatsbyで作成した静的サイトを、Netlifyでホスティングします。 Githubからデプロイするのが推奨されているので、 それで行きたいと思います。

Netfliyでサイトを作成する

  • 【New site from Git】 を選択して、 Githubを選択。
  • gatsbyのソースコードを管理しているリポジトリを選択して、連携する。
  • ダッシュボードから、Settings → Build & Deploy → Build Environment Variablesと進み、以下の環境変数を設定。
ACCESS_TOKEN
SPACE_ID
GOOGLE_ANALYTICS // optional

ACCESS_TOKENおよびSPACE_IDがないと、ビルドに失敗します。

Contentfulのコンテンツを更新したら、再ビルドする

  • Netlifyのダッシュボードから、Settings → Build & Deploy → Build hooksと進んで、新しくbuild hook用のURLを作成する
  • Contentfulのダッシュボードから、Space Settings → Webhooksと進み、先程取得したwebhook URLを設定する
  • デフォルトだと画像などのメディアファイルの更新でもwebhookがトリガーされてしまうので、以下のように変更する

2019-08-25-15-27-21

これで、Contentfulでポストなどのコンテンツを更新したら、改めてビルドされるようになります!

Netlify Formを設定する

gatsby-starter-gcnテンプレートは、 すでにNetlify Formが設定済み。

通知機能は自分で設定する必要があるので、Setting → Formから、notificationsを設定する。