BuyChain は、かなり複雑な B2B サプライチェーン製品を説明しつつ、高速で更新しやすいサイトを必要としていました。私はフロントエンドの構築をリードしました。トレードオフを検討したうえで、Jamstack のアプローチ、つまり静的なフロントエンドとコンテンツを別々に管理する構成を提案し、ローンチまで一貫して担当しました。引き継ぎ後もこの選択が定着するよう、BuyChain チームには日々のコンテンツ運用の進め方を一通り案内しました。
作ったもの
- Astro フロントエンド: Astro のアイランドアーキテクチャで構築し、インタラクティブな部分だけが必要な箇所でハイドレートされ、残りは静的な HTML として配信されます。これによりページの読み込みが速く保たれます。
- Directus CMS: Directus をコンテンツ層として、その背後にある SQL スキーマも含めて構築しました。ローカライズされたページやマーケティングコンテンツはすべて一か所から動かせます。
- 静的ビルドパイプライン: コンテンツはビルド時に Directus から読み取られ、読み取り専用の静的ページになります。これにより公開サイトは CMS から切り離され、ホスティングも安価に保てます。
なぜ意味があったか
コンテンツが CMS 上にあり、サイトが静的に再ビルドされるため、BuyChain チームは開発者を待たずに新しいランディングページやバーティカルを立ち上げられます。これにより繰り返し発生していたボトルネックが解消され、ホスティングコストも低く抑えられました。