⚙️
VercelとMicroCMSの連携方法
microCMSが公開しているチュートリアルのブログの情報だけだと少し躓いたので備忘録として残しておきます。ちなみに参考にしたサイトはこちらです。
編集する箇所へのアクセス
まずはVercelのページにアクセスして編集対象のプロジェクトにアクセスします。
次に左上メニューの「Setting」→「Environment Variables」という順にクリックします。
値を入力する
「API_KEY」と「SERVICE_DOMAIN」の２つの情報を登録していきます。
API_KEY
Keyの欄に「API_KEY」を、Valueの欄にmicroCMSのAPIプレビューで表示されるAPIキーを入力した後、Saveボタンをクリックしましょう。
SERVICE_DOMAIN
上記のサイトだとAPI_KEYについてしか触れていませんが、ドメインの情報も同様に登録していきます。Keyの欄に「SERVICE_DOMAIN」を、Valueの欄にドメイン名(※microCMSページのURLである『https://XXX.microcms.io/』のXXXに該当する)を入力した後、Saveボタンをクリックしましょう。
デプロイ・確認
自分の場合は既にデプロイしていたので、正確にはリデプロイになりますが、デプロイしてMicroCMS側に設定していた内容がデプロイ先にも反映されているか確認して下さい。
最後に
余談ではありますが、上記リンク先の「10.microCMSとVercelを連携する」は自分の場合、特に何も設定しなくてもGitHubにコミットして1・2分後に本番環境にも自動的に反映されました。(※エラーが発生した場合はVercelのページからリデプロイの必要がありますが。)ご参考までに。
Discussion