Skip to content

Commit

Permalink
Clean up How Queries Work (#24256)
Browse files Browse the repository at this point in the history
* Clean up How Queries Work

* Update docs/docs/query-behind-the-scenes.md

Co-authored-by: Marcy Sutton <marcy@gatsbyjs.com>

* Update docs/docs/query-behind-the-scenes.md

Co-authored-by: Aisha Blake <aisha.g.blake@gmail.com>

* Update docs/docs/query-behind-the-scenes.md

Co-authored-by: Marcy Sutton <marcy@gatsbyjs.com>

* Update docs/docs/query-behind-the-scenes.md

* Update docs/docs/query-behind-the-scenes.md

* fix: remove trailing whitespace

Co-authored-by: Megan Sullivan <megan@gatsbyjs.com>
Co-authored-by: Marcy Sutton <marcy@gatsbyjs.com>
Co-authored-by: Aisha Blake <aisha.g.blake@gmail.com>
  • Loading branch information
4 people committed Oct 26, 2020
1 parent 10c3456 commit ed31b35
Showing 1 changed file with 5 additions and 3 deletions.
8 changes: 5 additions & 3 deletions docs/docs/query-behind-the-scenes.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,13 @@
title: How Queries Work
---

As part of Gatsby's data layer, GraphQL queries can be specified as tagged GraphQL expressions at the bottom of your component source file (e.g. [query for Gatsby frontpage](https://github.com/gatsbyjs/gatsby/blob/master/www/src/pages/index.js#L142)), StaticQueries within your components (e.g. [showcase site details](https://github.com/gatsbyjs/gatsby/blob/master/www/src/components/showcase-details.js#L96)), or fragments created by plugins (e.g. [gatsby-source-contentful](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-contentful/src/fragments.js)).
In Gatsby, GraphQL queries are specified as tagged `graphql` expressions. These can be exported in your page source files, used in the `StaticQuery` component, or used in the `useStaticQuery` hook in your React code. Plugins can also define fragments for use in queries.

Note that this process only applies to queries that are specified directly in components or templates. It doesn't apply to queries involved in the creation of dynamic pages through your site's `gatsby-node.js` file (e.g. on [Gatsby's website](https://github.com/gatsbyjs/gatsby/blob/master/www/src/utils/node/docs.js#L42)).
Note that the process outlined in this section only applies to queries that are specified in components or templates. It does _not_ apply to queries specified in a `gatsby-node.js` file which are typically used for the creation of dynamic pages. (For an example of a query in a `gatsby-node.js` file, check out the [Creating Pages](/tutorial/part-seven/#creating-pages) section from Part 7 of the Gatsby tutorial.

Almost all logic to do with queries is in [src/query](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby/src/query). There are two steps involved in a Query's life time. The first is extracting it, and the second is running it. These are separated into two bootstrap phases.
Most code to do with queries is in the [src/query](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby/src/query) directory in the Gatsby monorepo.

There are two steps involved in the lifetime of a GraphQL query in Gatsby. The first is extracting and validating it, and the second is running it.

1. [Query Extraction](/docs/query-extraction/)
2. [Query Execution](/docs/query-execution/)

0 comments on commit ed31b35

Please sign in to comment.