Netlify CMSを使っている環境で、CMSでのコンテンツ作成とCMSを介さないコンテンツ作成を同時に行っている際に気をつけたいこと
こんにちは、Gaji-Labo アシスタントエンジニアの石垣です。
今回は GatsbyJS + Netlify CMS の環境で、Netlify CMS を使用してのコンテンツ作成と、CMSを介さずファイルを直接編集してのコンテンツ作成を同時に行っている際に気をつけたいことについてまとめたいと思います。
Netlify CMSの仕様について
Netlify CMSはGatsbyJSなどの静的サイトジェネレーターと組み合わせて使用するHeadless CMSの1つです。Netlify CMSについてはこちらの記事「Gaji-LaboのコーポレートサイトはNetlify CMSを使っています」もご覧ください。
通常、静的サイトジェネレーターは Markdown ファイルなどを追加してコンテンツを作成しますが、Netlify CMSを使用すると直接ファイルを触ることなくコンテンツを作成することができます。
Netlify CMS上でコンテンツを作成・更新すると、連携したGitHubのリポジトリに作業が自動的に push されるという形で反映されます。
その作業内容自体は単に Markdown ファイルの作成・修正を行っているだけなので、CMS上で行ったことと同等の作業を直接ファイルを編集することで行うことも出来ます。
Markdown を書くことに慣れており、Git 操作に長けた人であればCMSを使うより直接更新した方が早い時があるかもしれません。
しかし、Netlify CMSを使った更新と直接ファイルを編集しての更新を併用して行っている場合、気をつけなければいけない点が数点あります。
注意点
直接 Markdown ファイルを追加した場合、 CMSの config.yml で設定した branch にアップしないとCMSで確認ができない
Netlify CMS は以下のように、config.yml で指定した branch 上を基準に動いています。
backend:
name: git-gateway
branch: master # ここで指定した branch がCMSの Production branch になるこの branch にファイルが存在しないとCMSに認識されず、CMS上で確認することができません。
そのため、作業を該当 branch にマージするなどして、ファイルをこの branch に存在させる必要があります。
CMSが自動作成したPRに直接作業を追加し、更にCMSで変更を加えると、force-push されて直接追加した方の作業が消える
Editional Workflow 機能を使っている際、CMSでコンテンツを下書き保存するとPRが自動で作成されます。
作られたPRの branch に移動すればその branch 上で更に作業を行うこともできますが、作業追加後に更にCMSで変更を加え、保存するとPRに force-push が自動的に行われ、直接追加した方の作業が消えてしまうという仕様があります。
そのため、CMSにより自動作成されたPRと、直接ファイルを編集して作成したPRは完全に切り分けるのが無難です。
直接 Markdown を編集した時にCMSの編集画面に古い入力がキャッシュで残っていることがある
CMS上に既に上がっている Markdown ファイルを編集した際、Production Branch に反映した後でも編集画面に古い入力がキャッシュで残っていることがあります。
少し時間を置くと解消されますが、これはブラウザのキャッシュではなく、CMSの方で保持しているデータが残ってしまっているようです。
まとめ
今回は Netlify CMS を使っていて、なおかつCMSを介さない直接編集も行っている時に気をつけたいことについてまとめました。参考にしていただけると嬉しいです。
Gaji-Labo は Jamstack 開発の知見があります
高パフォーマンス、表示が早く、SEO についての不安も少ない Jamstack。
フロントエンド開発の専門家として、技術選定からサーバーサイド開発側との調整まで対応します。
「Jamstack にしたいが、社内調整ができるか不安」
「Jamstack 開発がわかるエンジニアがいない」
Jamstack に関わるお困りごとに対して、メリット／デメリットの判断からお手伝いできます。
まずは一度お気軽に Gaji-Labo にご相談ください。
オンラインでのヒアリングとフルリモートでのプロセス支援にも対応しています。
フロントエンドの相談をする！
