Gatsbyはどうやって静的サイトをジェネレートしているのか

GatsbyはReactベースの静的サイトジェネレーターです。 生成される静的サイトはシングルページアプリケーションでもあるため、優れたUXをユーザーに提供できます。 GatsbyはReactの公式サイトを始め、多くのサイトで採用されています。 弊社でもいくつかのGatsby案件が進行中です 😎 また、Gatsbyのユニークな特長として、静的サイトのリソースのデータ取得にGraphQLを使っているというところがあります。 ローカルのMarkdownファイルやContentful・WordPressといった外部CMSのWebAPIをデータソースとして、GraphQLを通じて一元的に扱うことができます。 ページごとに必要なデータをGraphQLのクエリを一発投げて取るだけになるので実装がクリアになります。 例えばこのような感じです。 しかし、GraphQLを使うということはSchemaを定義