Jun 2, 2026 · Frontend Stacks · 1min read

Gatsby Local Development Guide

Build React static sites with Gatsby, utilizing a GraphQL data layer, and develop locally on the default localhost:8000.

Gatsby is a static site generator (SSG) based on React, which pulls data from various sources such as Markdown, CMS, and APIs through GraphQL, generating high-performance static pages suitable for blogs, marketing sites, and content aggregation sites.

Quick Start

npm init gatsby
cd my-gatsby-site
npm run develop

Or use the CLI:

npx gatsby new my-gatsby-site https://github.com/gatsbyjs/gatsby-starter-default
cd my-gatsby-site
npm run develop

Default localhost Access

Purpose	Address
Development Server	http://localhost:8000
GraphQL Explorer	http://localhost:8000/___graphql
Preview Production Build	http://localhost:9000 (`npm run serve`)

To change the port: gatsby develop -p 8080.

Common Commands

Command	Description
`npm run develop`	Start the development server
`npm run build`	Generate static site in `public/`
`npm run serve`	Preview the production build
`npm run clean`	Clear cache and build artifacts

Data and Plugins

Integrate file systems, WordPress, Contentful, etc., through gatsby-source-* plugins
Query data at the GraphQL layer during build time, with page components receiving props
A rich ecosystem of gatsby-plugin-* (image optimization, SEO, sitemap, etc.)

Summary

Gatsby local development defaults to http://localhost:8000. The GraphQL data layer is suitable for content-driven React static sites, which can be deployed to a CDN or Pages.