Unlock seamless workflows and faster delivery with our latest releases - Join the deep dive

Solving live preview in Gatsby without $99/mo Gatsby Cloud

17 replies
Last updated: Jun 25, 2020
Asking again, is it not possible for GROQ queries to resolve references without declaring the fields you want to return?
I need to query for a document by its ID, and return
all its fields – and resolve all its references – without knowing what they could be.
(The use case is creating a preview in Gatsby, so I need to mirror the GraphQL data, which does exactly this, but only at build time)
May 13, 2020, 6:07 AM
Correct. It’s a feature request that comes up once in a while, but it requires some design decisions, e.g. what to do with recursion.
1. Why don’t you use the preview feature in the plugin?
2. Don’t you know your content model? It may be some work, but it should be possible to “
know” where references occur in your model? We can point you in the right direction
May 13, 2020, 6:14 AM
1. Are you talking about the Gatsby Cloud preview? I’m trying to avoid $99/mo for a small business to get a preview.2. I do know the content model, I’m trying to avoid writing it once in GROQ and once in GraphQL because that’s not very DRY.
May 13, 2020, 6:23 AM
Have you looked at running your own gatsby-preview instance? https://www.gatsbyjs.org/docs/running-a-gatsby-preview-server/
May 13, 2020, 6:29 AM
If you run it on heroku I think you can get away with a $7 dyno (you need a bit of RAM)
May 13, 2020, 6:30 AM
https://render.com/pricing might also be an option
May 13, 2020, 6:30 AM
I hadn’t, will give it a look.
Sanity must’ve solved this for their own GraphQL implementation though, right?
May 13, 2020, 6:32 AM
(Getting * fields and resolving * references)
May 13, 2020, 6:33 AM
Yeah, I guess you're right - we analyze your schema and use it to compile the GROQ queries. We might open source parts of this at some point, but we're not completely there yet
May 13, 2020, 6:35 AM
But I'd look into just running your own gatsby preview. Less code, less work, probably better experience since it allows global preview (since we replace the nodes in the Gatsby datastore)
May 13, 2020, 6:36 AM
Thanks I might have a go at that.
May 13, 2020, 6:51 AM
[could even become a much sought after blog post]
May 13, 2020, 7:14 AM
Whoa.
I just got this working.
May 14, 2020, 8:13 PM
user S
Curious how you resolved this?
May 28, 2020, 1:51 AM
In the end, I didn’t. My use case was trying to use GROQ to create a live preview page in my Gatsby site, but I was able to solve this by setting up a real live preview version of the site that runs on Heroku…

https://www.simeongriggs.dev/roll-your-own-gatsby-live-preview-for-sanity
May 28, 2020, 5:40 AM
This is great! Thanks for writing the guide. Do you mind if I ask what size of site you are working on and what you ended up spending a month on Heroku? This is exactly what I need but budget is always really difficult to come by especially at the moment.
Jun 25, 2020, 8:25 AM
Also, your blog site is really nice. I like it a lot.
Jun 25, 2020, 8:40 AM
The site we used this on is very small, 30ish pages. So it works okay on a free Heroku plan. But others have said it doesn’t hold up for larger sites.
And thanks! I just threw the blog together!
Jun 25, 2020, 8:57 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?