Generating JSON file with Gatsby
April 17, 2018 at 7:30pmGenerating JSON file with Gatsby
April 17, 2018 at 7:30pmWhat is the best way to generate JSON files with Gatsby? I would like to make some of the Gatsby data available as a simple API in the form of JSON files generated along with the Gatsby app. Are there any examples on how to do this?
April 17, 2018 at 8:18pm
You could create these in your site's gatsby-node.js file. Implement `onPostBuild` and query for the data you need and then write them out to JSON files in the `public` folder e.g.
https://www.gatsbyjs.org/docs/node-apis/#onPostBuildexports.onPostBuild = ({ graphql }) = {graphql(QUERY).then(result => processAndWriteJSONFiles(result))}
January 28, 2019 at 1:57am
The idiomatic way to do this with Gatsby is to use the
StaticQuery
component, which can expose source data loaded via Gatsby source plugins to your components. I have successfully used this approach for dynamically rendered pages that pull data with references to StaticQuery
loaded data. See https://www.gatsbyjs.org/docs/static-query/ for more information on the StaticQuery
component.January 28, 2019 at 8:42am
There is also a plugin that creates JSON feeds. Haven't tried it. Don't know if it suits your need. Just mentioning it. ;)
https://www.gatsbyjs.org/packages/gatsby-plugin-feed-generator/
July 9, 2020 at 8:23pm
The idiomatic way to do this with Gatsby is to use the
StaticQuery
component, which can expose source data loaded via Gatsby source plugins to your components. I have successfully used this approach for dynamically rendered pages that pull data with references to StaticQuery
loaded data. See https://www.gatsbyjs.org/docs/static-query/ for more information on the StaticQuery
component.Realizing I'm late to the party here, but doesn't static-query only reference site data in the
gatsby-config
file?October 21, 2020 at 7:32pm
Realizing I'm late to the party here, but doesn't static-query only reference site data in the
gatsby-config
file?I'm even later to the party :-) The question is different. It's about generating static JSON files and expose them like a simple API. Let's say your Site is about products. You generate many static pages like
/products/a-nice-table/
and /products/a-cheep-chair/
. Additionally, you want to expose these product data as a simple JSON API. Visitors could retrieve the data as JSON like this /products/a-nice-table.json
and /products/a-cheep-chair.json
With
StaticQuery
You can do almost the same as with Query
but you can't use parameters/variables in the query.