6804039e94
* npx create → npm init * Fix inconsistent instructions * Update amp-first * Update with-graphql-react * with-firebase-cloud-messaging * Update with-higher-order-component * change create-next-app url * Update create-next-app instruction * Update instructions to use npm instead of npx * Move "the idea behind the example" to top * Rename * Rename * Update contributing.md with a README template |
||
---|---|---|
.. | ||
components | ||
lib | ||
pages | ||
server | ||
.babelrc | ||
.env | ||
.gitignore | ||
next.config.js | ||
package.json | ||
README.md |
Relay Modern Server Express Example
Relay Modern is a new version of Relay designed from the ground up to be easier to use, more extensible and, most of all, able to improve performance on mobile devices. Relay Modern accomplishes this with static queries and ahead-of-time code generation.
In this simple example, we integrate Relay Modern seamlessly with Next by wrapping our pages inside a higher-order component (HOC). Using the HOC pattern we're able to pass down a query result data created by Relay into our React component hierarchy defined inside each page of our Next application. The HOC takes options
argument that allows to specify a query
that will be executed on the server when a page is being loaded.
This example implements a simple graphql server using express, showing a custom graphql server integrated to next.js and relay modern.
How to use
Using create-next-app
Execute create-next-app
with npm or Yarn to bootstrap the example:
npm init next-app --example with-relay-modern-server-express with-relay-modern-server-express-app
# or
yarn create next-app --example with-relay-modern-server-express with-relay-modern-server-express-app
Download manually
Download the example or clone the repo:
curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-relay-modern-server-express
cd with-relay-modern-server-express
Install it:
npm install
# or
yarn
Run the project (it runs automatically the Relay ahead-of-time compilation)
npm run dev
# or
yarn dev
Deploy it to the cloud with now (download):
now