Gatsby

Updated: 11 November 2023

https://www.gatsbyjs.com/docs/tutorial/getting-started

• A page (React) Component contains all the UI elements for a specific page of a site.
• Gatsby automatically creates pages for React components that are the default export of files in the src/pages directory.
• A Gatsby plugin adds additional features to a Gatsby site. It is a standalone npm package.
• Gatsby plugin library https://www.gatsbyjs.com/plugins

Data Layer

• Source plugins pull data from their original location into the Gatsby GraphQL data layer.
• Use the GraphiQL endpoint (localhost:8000/___graphql) to explore data in the data layer and design GraphQL queries.
• Write GraphQL queries to pull data out of the data layer and into React components.
• To pull data into a “building block” component, use the useStaticQuery hook.
• To pull data into a page component, use a page query.

Updated: 02 November 2023

Install via npm

npm install -g gatsby-cli
gatsby --version
gatsby --help

Create a new project from a template

gatsby new root_path_here https://github.com/gatsbyjs/gatsby-starter-default

Run the development server

gatsby develop

Browse to:
http://localhost:8000
http://localhost:8000/___graphql