gatsbyjs/gatsby

これは何？

主な機能

• 01source pluginを介して、Markdown、ヘッドレスCMS、REST APIやGraphQL APIからデータを取り込みます。
• 02すべてのデータを統一されたGraphQLインターフェースで利用できます。
• 03ページごとに、静的生成、遅延静的生成、サーバーサイドレンダリングをサポートします。
• 04コード分割、画像の最適化、遅延読み込みを自動化します。
• 05CDNでホスティングできる静的ファイルを生成します。

ユースケース

• ヘッドレスCMSを利用した、コンテンツ量の多いブログやマーケティングサイトの構築。
• 静的サイト並みのパフォーマンスが求められるECサイトやユーザーダッシュボードの作成。
• サーバーコストを最小限に抑えながら、CDNでサイトをホスティング。

クイックスタート

1. 1

   新しいプロジェクトを初期化する

   npm init gatsby
2. 2

   新しいサイトのディレクトリに移動して、開発モードを開始する

   cd my-gatsby-site/ npm run develop
3. 3

   http://localhost:8000 を開き、src/pages/index.js を編集する

トピック

よくある質問

gatsby とは？

CMS、Markdown、APIのデータをGraphQL経由で取り込み、高速なWebサイトやアプリを構築できるReactベースのフレームワーク。 Gatsbyは、Webサイトやアプリを構築するためのReactフレームワークです。source pluginを使って、Markdownファイル、ContentfulやWordPressなどのヘッドレスCMS、REST APIやGraphQL APIといったソースからデータを読み込み、すべてのデータを単一のGraphQLインターフェースで利用できるようにします。

gatsby は無料で使えますか？ライセンスは？

gatsby は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

gatsby は今もメンテナンスされていますか？

活発にメンテナンス中。gatsby の最終コミットは 2026年10月20日 です。

gatsby は何に使えますか？

ヘッドレスCMSを利用した、コンテンツ量の多いブログやマーケティングサイトの構築。 静的サイト並みのパフォーマンスが求められるECサイトやユーザーダッシュボードの作成。 サーバーコストを最小限に抑えながら、CDNでサイトをホスティング。

gatsby のインストール方法は？

新しいプロジェクトを初期化する: npm init gatsby 新しいサイトのディレクトリに移動して、開発モードを開始する: cd my-gatsby-site/ npm run develop http://localhost:8000 を開き、src/pages/index.js を編集する

gatsby はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/gatsbyjs/gatsby