【Sanityフル活用】Modular Web Design

ウェブサイト構築におけるフレキシブルかつ迅速なデータ構成方法「Modularモジュラー」式について今回は紹介。ページ内のコンテンツをはじめ、あらゆる「moduleモジュール」要素の組み替えによってドキュメントを設計する、という至ってシンプルな考え方である。ページ内コンテンツ以外にも、サイト内のリンクをまとめた「navigation」や、モジュール内にさらにモジュールを入れ子にするなど、活用方法は無限大にある。再利用またはテンプレ化可能なデータはなるべく定型化することで、データベースがメンテナンス及びスケールアップしやすくなるという大きなメリットがある。

CMSでの活用法🔗

例として、度々宣伝させてもらっているNext.js + Sanity Starter TemplateのSanityの管理画面では、いたるところでモジュールを使用してデータベースを構築しいる。Sanity内ではschemaスキーマを作成・登録し、ドキュメントに挿入することでデータを自由に引用することができる。

この他にも、「Person」データタイプ（または、それから派生した「Employee」・「Author」タイプなど）があったとして、「Person list」モジュールを作成することで、ページにセクションを挿入することができる。

Sanityでは、データを引用する「Reference」機能も備えられていて、簡単にモジュールブロックを開発できるようになっている。