added few info on non-page components (#15198)

* added more info on Querying data. Querying data using static query docs and example added fixes #15195 * added few info on non page components removed br tags and added few info on non page components. * Added few lines on Non-page components removed br tags and added few info on non-page components. * Update building-with-components.md * Apply suggestions from code review * chore: format
gatsbyjs · Jul 20, 2019 · 4597116 · 4597116
1 parent 0fbbd28
commit 4597116
Showing 1 changed file with 5 additions and 0 deletions.
diff --git a/docs/docs/building-with-components.md b/docs/docs/building-with-components.md
@@ -167,3 +167,8 @@ These are examples of the different ways React components are used in Gatsby
 sites. To see full working examples, check out the
 [examples directory](https://github.com/gatsbyjs/gatsby/tree/master/examples) in
 the Gatsby repo.
+
+### Non-page components
+
+A Non-page component is one that's embedded inside some other component, forming a component hierarchy. An example would be a Header component that's included in multiple page components.
+Gatsby uses GraphQL to enable components to declare the data they need. Using the [StaticQuery](/docs/static-query/) component or [useStaticQuery hook](/docs/use-static-query/), you can colocate a non-page component with its data.