search

FormidableLabs / next-urql

Convenience utilities for using urql with NextJS.
MIT License
56 stars 7 forks source link

Demonstrate usage of getInitialProps in _app.js. #40

Closed parkerziegler closed 4 years ago

parkerziegler commented 4 years ago

A smol boi demonstrating usage of getInitialProps on an _app.js component with next-urql. This is to clear up some questions on #35.

While al urql queries will get picked up and run by react-ssr-prepass on the initial server render, there is a trick if you have blocking data requirements in a Page component that implements getInitialProps and is wrapped by _app.js. Basically, to ensure that Page's getInitialProps is ran, you have to call NextApp.getInitialProps: https://nextjs.org/docs/advanced-features/custom-app

We do have this in our second example, with the Home component having its own getInitialProps method. In order to have this function run, we need to add in this call to NextApp.getInitialProps.

cc/ @jgoux does this help? Your urql queries should still run fine in v0.3.0 if you're using useQuery or the Query component. This only applies if you're implementing getInitialProps in your Page components.

jgoux commented 4 years ago

@parkerziegler I think I wasn't clear sorry. I'm not using getInitialProps at all. Not in my _app.js and not in my pages. I'm just wrapping my _app with withUrqlClient and that's it. But since 0.3.0 and without touching my code, SSR stopped working. Maybe I'm just misunderstanding, I'll try to apply this change and report back!

parkerziegler commented 4 years ago

@jgoux thanks! If that's the case then we may have a bug. I can't repro in our local examples, granted those are quite trivial compared to a production app. If you can provide a CodeSandbox that minimally reproduces the issue that'd be super helpful!