Next.JS: How to make ALL requests server-side
I found a solution by wrapping Next.JS in Express!
I have pushed a simple example project to GitHub here
The repo has a nice README as well as comments in the code that detail what's going on.
Quick rundown:
- Wrap Next.JS in an express server. Explicitly render pages by calling
nextApp.render(...)
which happens implicitly in standard Next.JS apps. See server.js - Use express routing. Make server-side requests prior to rendering the pages with
nextApp.render(...)
. See server.js. - Use standard anchor tags to ensure that pages requests hit the express server. See index.js
nextApp.render
provides passed values to the page in the context (ctx
) parameter ofgetInitialProps
. You can make these values available in the pagesthis.props
by returning them ingetInitialProps
. See stars.js
Suggestions and improvements welcome!