CodeGrid

株式会社ピクセルグリッド

ピクセルグリッドで執筆・開発・運営をする、フロントエンドに関わる人々のためのオンラインメディアCodeGrid。2022年にJamstackで構築された構成から大きく変えず、Astro + Svelte + Hygraph + Cloudflare PagesでSSRを利用してユーザーごとにコンテンツを出し分ける高速なメディアサイトとしてリニューアルしました。

https://www.codegrid.net/
  • Webサービス
  • メディアサイト

ホスティングサービス上でAstroによるSSR

CodeGridは、Cloudflare Pagesでホスティングされ、AstroによるSSRを採用しています。SSRにより、既読状況やお気に入りなど、ユーザーごとに表示を変えないといけないコンテンツも高速に表示されるメディアサイトに仕上げました。

ヘッドレスCMSとしてHygraphを採用

記事のデータをGraphQLで扱うため、HygraphをヘッドレスCMSとして採用しています。ヘッドレスCMSの管理画面で記事やカテゴリを管理でき、このサイト以外でも記事情報を使いやすくなっています。

Algoliaによる検索

CodeGridでは、Algoliaを検索エンジンとして採用しています。記事のデータをAlgoliaにインデックスし、検索を高速に行うことができます。

Webサイトのスペック

ビルド速度

合計101秒

ビルドログ

  • 環境の初期化 3s
  • gitリポジトリのクローン 2s
  • サイトのビルド 85s
  • デプロイ 11s

採用サービス、ライブラリ

Astro Svelte Algolia Hygraph Cloudflare Pages Cloudflare Workers Cloudflare Workers KV GitHub

開発メンバー

  • プロダクトオーナー：中村 享介
  • ディレクター：坂巻 翔大郎
  • エンジニア：坂巻 翔大郎、宇野 陽太、杉浦 有右嗣
  • UIデザイナー：小原 司、近藤 彩

新しいWeb技術で成功させたいプロジェクトなら、技術選定の前に気軽にお問い合わせよりご相談ください。

お問い合わせ