diff --git a/examples/with-apollo/README.md b/examples/with-apollo/README.md index 0ddf01d541c82..ee43e5454a31e 100644 --- a/examples/with-apollo/README.md +++ b/examples/with-apollo/README.md @@ -1,5 +1,7 @@ # Apollo Example + ## Demo + https://next-with-apollo.now.sh ## How to use @@ -11,21 +13,22 @@ curl https://codeload.github.com/zeit/next.js/tar.gz/master | tar -xz --strip=2 cd with-apollo ``` -Install it and run +Install it and run: ```bash npm install npm run dev ``` -Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download)) +Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download)): ```bash now ``` ## The idea behind the example -Apollo is a GraphQL client that allows you to easily query the exact data you need from a GraphQL server. In addition to fetching and mutating data, Apollo analyzes your queries and their results to construct a client-side cache of your data, which is kept up to date as further queries and mutations are run, fetching more results from the server. + +[Apollo](http://dev.apollodata.com) is a GraphQL client that allows you to easily query the exact data you need from a GraphQL server. In addition to fetching and mutating data, Apollo analyzes your queries and their results to construct a client-side cache of your data, which is kept up to date as further queries and mutations are run, fetching more results from the server. In this simple example, we integrate Apollo seamlessly with Next by wrapping our *pages* inside a [higher-order component (HOC)](https://facebook.github.io/react/docs/higher-order-components.html). Using the HOC pattern we're able to pass down a central store of query result data created by Apollo into our React component hierarchy defined inside each page of our Next application. diff --git a/examples/with-apollo/components/PostList.js b/examples/with-apollo/components/PostList.js index 6a24740edc742..161dc4c94496a 100644 --- a/examples/with-apollo/components/PostList.js +++ b/examples/with-apollo/components/PostList.js @@ -1,5 +1,4 @@ -import gql from 'graphql-tag' -import { graphql } from 'react-apollo' +import { gql, graphql } from 'react-apollo' import PostUpvoter from './PostUpvoter' const POSTS_PER_PAGE = 10 diff --git a/examples/with-apollo/components/PostUpvoter.js b/examples/with-apollo/components/PostUpvoter.js index 97647637f9767..36cfdfcdf1425 100644 --- a/examples/with-apollo/components/PostUpvoter.js +++ b/examples/with-apollo/components/PostUpvoter.js @@ -1,6 +1,5 @@ import React from 'react' -import gql from 'graphql-tag' -import { graphql } from 'react-apollo' +import { gql, graphql } from 'react-apollo' function PostUpvoter ({ upvote, votes, id }) { return ( diff --git a/examples/with-apollo/components/Submit.js b/examples/with-apollo/components/Submit.js index ff2e04598e079..5a780c7eeb3f2 100644 --- a/examples/with-apollo/components/Submit.js +++ b/examples/with-apollo/components/Submit.js @@ -1,5 +1,4 @@ -import gql from 'graphql-tag' -import { graphql } from 'react-apollo' +import { gql, graphql } from 'react-apollo' function Submit ({ createPost }) { function handleSubmit (e) { diff --git a/examples/with-apollo/lib/initClient.js b/examples/with-apollo/lib/initClient.js index 6fc5217400eb2..6f43f5020e859 100644 --- a/examples/with-apollo/lib/initClient.js +++ b/examples/with-apollo/lib/initClient.js @@ -1,4 +1,4 @@ -import ApolloClient, { createNetworkInterface } from 'apollo-client' +import { ApolloClient, createNetworkInterface } from 'react-apollo' let apolloClient = null diff --git a/examples/with-apollo/lib/withData.js b/examples/with-apollo/lib/withData.js index 134a2339f7789..cdb0ddd3e6997 100644 --- a/examples/with-apollo/lib/withData.js +++ b/examples/with-apollo/lib/withData.js @@ -1,6 +1,6 @@ -import { ApolloProvider, getDataFromTree } from 'react-apollo' -import React from 'react' import 'isomorphic-fetch' +import React from 'react' +import { ApolloProvider, getDataFromTree } from 'react-apollo' import { initClient } from './initClient' import { initStore } from './initStore' diff --git a/examples/with-apollo/package.json b/examples/with-apollo/package.json index 4b42d210e2bcb..2cde75fc3d33c 100644 --- a/examples/with-apollo/package.json +++ b/examples/with-apollo/package.json @@ -1,22 +1,17 @@ { "name": "with-apollo", - "version": "1.0.0", + "version": "1.0.1", "scripts": { "dev": "next", "build": "next build", "start": "next start" }, "dependencies": { - "apollo-client": "^0.7.3", - "graphql": "^0.8.2", - "graphql-tag": "^1.2.3", + "graphql": "^0.9.1", "next": "^2.0.0-beta", "react": "^15.4.2", - "react-apollo": "^0.8.1", - "react-dom": "^15.4.2", - "react-redux": "^5.0.2", - "redux": "^3.6.0", - "redux-thunk": "^2.1.0" + "react-apollo": "^1.0.0-rc.2", + "redux": "^3.6.0" }, "author": "", "license": "ISC"