Update withApollo example #10451

HaNdTriX · 2020-02-07T15:56:01Z

Here is another update on the withApollo example. Using apollo with Next.js not trivial. Finding the right abstractions is the key for the community to adopt such a technologie.

Changelog

Remove Head.rewind() from HOC. ~~(next/head no longer uses legacy context).~~
Removed second initialization step of the apolloClient when rendering on the server.
Added more inline documentation.
Make ssr: false the default. Users of this HOC now need to explicitly enable datafetching using slow AppTree traversal.
Moved ApolloClient configuration into a separate file (./apolloClient.js). This simplifies the setup dramatically, since the developer doesn't need to care about the Next.js peculiarities. Implementing Server Side Auth is now much easier, since we are now able to access the NextPageContext right from createApolloClient.
Exposed new initOnContext method. Just incase a user want's to use the apolloClient inside getStaticProps or getServerProps. We can now manually install it on the NextPageContext.
Updated apollo dependencies
Reuse apolloState if created in getStaticProps

Examples

Setting up ApolloClient

import { ApolloClient } from 'apollo-client'
import { InMemoryCache } from 'apollo-cache-inmemory'
import { HttpLink } from 'apollo-link-http'
import fetch from 'isomorphic-unfetch'

export default function createApolloClient(initialState, ctx) {
  // The `ctx` (NextPageContext) will only be present on the server.
  // use it to extract auth headers (ctx.req) or similar.
  return new ApolloClient({
    ssrMode: Boolean(ctx),
    link: new HttpLink({
      uri: 'https://api.graph.cool/simple/v1/cixmkt2ul01q00122mksg82pn', // Server URL (must be absolute)
      credentials: 'same-origin', // Additional fetch() options like `credentials` or `headers`
      fetch,
    }),
    cache: new InMemoryCache().restore(initialState),
  })
}

Adding authentication

$ yarn add apollo-link-context cookie

import { ApolloClient } from 'apollo-client'
import { InMemoryCache } from 'apollo-cache-inmemory'
import { HttpLink } from 'apollo-link-http'
import { setContext } from 'apollo-link-context'
import cookie from 'cookie'
import fetch from 'isomorphic-unfetch'

export default function createApolloClient(initialState, ctx) {
  const httpLink = new HttpLink({
    uri: 'https://api.graph.cool/simple/v1/cixmkt2ul01q00122mksg82pn', // Server URL (must be absolute)
    credentials: 'same-origin', // Additional fetch() options like `credentials` or `headers`
    fetch,
  })

  const authLink = setContext((_, { headers }) => {
    // get the authentication token from local storage if it exists
    const token = getNextCookies(ctx).token
    // return the headers to the context so httpLink can read them
    return {
      headers: {
        ...headers,
        authorization: token ? `Bearer ${token}` : '',
      },
    }
  })

  return new ApolloClient({
    ssrMode: Boolean(ctx),
    link: authLink.concat(httpLink),
    cache: new InMemoryCache().restore(initialState),
  })
}

const getNextCookies = ctx => {
  const cookieStr = ctx && ctx.req 
    ? ctx.req.headers.cookie 
    : window.document.cookie
  return cookie.parse(cookieStr || '')
}

Using `withApollo` globally on `_app.js`

File: pages/_app.js

function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />
}

export default withApollo({
  // Warning: Setting `ssr:true` will disable Automatic Static Optimization
  ssr: false
})(MyApp)

Using ApolloClient inside `getStaticProps`

import { initOnContext } from '../lib/apollo'

export const getStaticProps = (ctx) => {
   initOnContext(ctx)

   ctx.apolloClient.query(...)

   return {
      props: {
         apolloState: ctx.apolloClient.cache.extract()
      }
   }
}

We can get rid of .rewind by now as the latest next/head no longer uses legacy context.

ijjk · 2020-02-07T16:02:33Z

Stats from current PR

Default Server Mode

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	11.2s	11.5s	⚠️ +301ms
nodeModulesSize	52.6 MB	52.6 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..e781.js gzip	13.8 kB	13.8 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.5 kB	67.5 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.5 kB	12.5 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62.1 kB	62.1 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Rendered Page Sizes

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
index.html gzip	1.03 kB	1.03 kB	✓
link.html gzip	1.04 kB	1.04 kB	✓
withRouter.html gzip	1.03 kB	1.03 kB	✓
Overall change	3.11 kB	3.11 kB	✓

Serverless Mode

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	12.2s	11.7s	-498ms
nodeModulesSize	52.6 MB	52.6 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..e781.js gzip	13.8 kB	13.8 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.5 kB	67.5 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.5 kB	12.5 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62.1 kB	62.1 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Serverless bundles

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_error.js gzip	46.6 kB	46.6 kB	✓
404.html gzip	1.44 kB	1.44 kB	✓
hooks.html gzip	1.08 kB	1.08 kB	✓
index.js gzip	46.7 kB	46.7 kB	✓
link.js gzip	72.6 kB	72.6 kB	✓
routerDirect.js gzip	70.8 kB	70.8 kB	✓
withRouter.js gzip	70.6 kB	70.6 kB	✓
Overall change	310 kB	310 kB	✓

Commit: 186479f

ijjk · 2020-02-07T16:21:56Z

Stats from current PR

Default Server Mode

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	12.4s	12.3s	-43ms
nodeModulesSize	52.6 MB	52.6 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..e781.js gzip	13.8 kB	13.8 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.5 kB	67.5 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.5 kB	12.5 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62.1 kB	62.1 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Rendered Page Sizes

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
index.html gzip	1.03 kB	1.03 kB	✓
link.html gzip	1.04 kB	1.04 kB	✓
withRouter.html gzip	1.03 kB	1.03 kB	✓
Overall change	3.11 kB	3.11 kB	✓

Serverless Mode

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	12.8s	12.5s	-352ms
nodeModulesSize	52.6 MB	52.6 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..e781.js gzip	13.8 kB	13.8 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.5 kB	67.5 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.5 kB	12.5 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62.1 kB	62.1 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Serverless bundles

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_error.js gzip	46.6 kB	46.6 kB	✓
404.html gzip	1.44 kB	1.44 kB	✓
hooks.html gzip	1.08 kB	1.08 kB	✓
index.js gzip	46.7 kB	46.7 kB	✓
link.js gzip	72.6 kB	72.6 kB	✓
routerDirect.js gzip	70.8 kB	70.8 kB	✓
withRouter.js gzip	70.6 kB	70.6 kB	✓
Overall change	310 kB	310 kB	✓

Commit: 565b739

lfades · 2020-02-11T22:14:04Z

examples/with-apollo/lib/apollo.js

+  // to the component, otherwise the component would have to call initApollo() again but this
+  // time without the context, once that happens the following code will make sure we send
+  // the prop as `null` to the browser
+  apolloClient.toJSON = () => null


Nice, I did this in next-with-apollo a long time ago, I don't remember why I never put it here 🤣

Actually, is this required? I did it as a bug fix for a configuration in the package, but I don't know about this case

Reason is, it feels very hacky, the overhead of creating a new instance of the Apollo Client may not matter (otherwise go ahead)

I'm happy for this to be fixed in a follow-up! It's likely fixing an already existing bug.

@lfades This line is there to prevent the following issue.

I think it is a genius hack that reduces a lot of complexity inside this HOC.
I have to admit that this was not my idea. I believe I saw this pattern inside your excellent lfades/next-with-apollo module, the first time.

Timer

Thanks @HaNdTriX!

ijjk · 2020-02-13T04:24:22Z

Stats from current PR

Default Server Mode

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	11.7s	11.5s	-241ms
nodeModulesSize	52.9 MB	52.9 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..c95c.js gzip	13.6 kB	13.6 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.4 kB	67.4 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.4 kB	12.4 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62 kB	62 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Rendered Page Sizes

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
index.html gzip	1.03 kB	1.03 kB	✓
link.html gzip	1.04 kB	1.04 kB	✓
withRouter.html gzip	1.03 kB	1.03 kB	✓
Overall change	3.11 kB	3.11 kB	✓

Serverless Mode (Increase detected ⚠️)

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	12.8s	12.4s	-384ms
nodeModulesSize	52.9 MB	52.9 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..c95c.js gzip	13.6 kB	13.6 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.4 kB	67.4 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.4 kB	12.4 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62 kB	62 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Serverless bundles Overall increase ⚠️

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_error.js gzip	290 kB	290 kB	-115 B
404.html gzip	1.44 kB	1.44 kB	✓
hooks.html gzip	1.08 kB	1.08 kB	✓
index.js gzip	289 kB	289 kB	-115 B
link.js gzip	320 kB	319 kB	-634 B
routerDirect.js gzip	316 kB	316 kB	⚠️ +118 B
withRouter.js gzip	315 kB	317 kB	⚠️ +1.47 kB
Overall change	1.53 MB	1.53 MB	⚠️ +719 B

Commit: ed94c45

ijjk · 2020-02-13T04:34:26Z

Stats from current PR

Default Server Mode

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	11s	11s	-33ms
nodeModulesSize	52.9 MB	52.9 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..c95c.js gzip	13.6 kB	13.6 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.4 kB	67.4 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.4 kB	12.4 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62 kB	62 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Rendered Page Sizes

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
index.html gzip	1.03 kB	1.03 kB	✓
link.html gzip	1.04 kB	1.04 kB	✓
withRouter.html gzip	1.03 kB	1.03 kB	✓
Overall change	3.11 kB	3.11 kB	✓

Serverless Mode (Decrease detected ✓)

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	11.9s	11.8s	-124ms
nodeModulesSize	52.9 MB	52.9 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..c95c.js gzip	13.6 kB	13.6 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.4 kB	67.4 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.4 kB	12.4 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62 kB	62 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Serverless bundles Overall decrease ✓

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_error.js gzip	290 kB	289 kB	-915 B
404.html gzip	1.44 kB	1.44 kB	✓
hooks.html gzip	1.08 kB	1.08 kB	✓
index.js gzip	289 kB	289 kB	⚠️ +109 B
link.js gzip	318 kB	319 kB	⚠️ +566 B
routerDirect.js gzip	315 kB	316 kB	⚠️ +1.12 kB
withRouter.js gzip	317 kB	315 kB	-1.39 kB
Overall change	1.53 MB	1.53 MB	-511 B

Commit: 16d456e

ijjk · 2020-02-13T04:45:59Z

Stats from current PR

Default Server Mode

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	11.5s	12s	⚠️ +549ms
nodeModulesSize	52.9 MB	52.9 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..c95c.js gzip	13.6 kB	13.6 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.4 kB	67.4 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.4 kB	12.4 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62 kB	62 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Rendered Page Sizes

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
index.html gzip	1.03 kB	1.03 kB	✓
link.html gzip	1.04 kB	1.04 kB	✓
withRouter.html gzip	1.03 kB	1.03 kB	✓
Overall change	3.11 kB	3.11 kB	✓

Serverless Mode (Decrease detected ✓)

General

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
buildDuration	12.7s	12.7s	⚠️ +12ms
nodeModulesSize	52.9 MB	52.9 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.js gzip	5.13 kB	5.13 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
4952ddcd88e7..54d3.js gzip	4.68 kB	4.68 kB	✓
commons.HASH.js gzip	4.06 kB	4.06 kB	✓
de003c3a9d30..c95c.js gzip	13.6 kB	13.6 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	67.4 kB	67.4 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
main-HASH.module.js gzip	4.13 kB	4.13 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
4952ddcd88e7..dule.js gzip	5.56 kB	5.56 kB	✓
de003c3a9d30..dule.js gzip	12.4 kB	12.4 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	62 kB	62 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
polyfills-HASH.js gzip	4.76 kB	4.76 kB	✓
Overall change	4.76 kB	4.76 kB	✓

Client Pages

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.js gzip	1.15 kB	1.15 kB	✓
_error.js gzip	4.07 kB	4.07 kB	✓
hooks.js gzip	779 B	779 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.89 kB	2.89 kB	✓
routerDirect.js gzip	283 B	283 B	✓
withRouter.js gzip	282 B	282 B	✓
Overall change	9.68 kB	9.68 kB	✓

Client Pages Modern

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_app.module.js gzip	576 B	576 B	✓
_error.module.js gzip	3.06 kB	3.06 kB	✓
hooks.module.js gzip	371 B	371 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	2.46 kB	2.46 kB	✓
routerDirect..dule.js gzip	273 B	273 B	✓
withRouter.m..dule.js gzip	272 B	272 B	✓
Overall change	7.22 kB	7.22 kB	✓

Client Build Manifests

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Serverless bundles Overall decrease ✓

	zeit/next.js canary	HaNdTriX/next.js examples/apollo-easy-config	Change
_error.js gzip	289 kB	290 kB	⚠️ +757 B
404.html gzip	1.44 kB	1.44 kB	✓
hooks.html gzip	1.08 kB	1.08 kB	✓
index.js gzip	290 kB	289 kB	-833 B
link.js gzip	319 kB	319 kB	-113 B
routerDirect.js gzip	316 kB	316 kB	⚠️ +360 B
withRouter.js gzip	316 kB	315 kB	-678 B
Overall change	1.53 MB	1.53 MB	-507 B

Commit: baca121

kachkaev · 2020-02-13T08:12:50Z

Decent update, many thanks @HaNdTriX 👏

Looking forward to switching over to your implementation in a few days. Will let know if anything breaks or gets confusing 🙌

BiscuiTech · 2020-02-14T13:55:38Z

Love it! Switched it with the recommended Auth version above. Everything works and more consise.

One thing to note: are there any plans to make the Auth version available outside of this PR for documentation purposes? Seems like a 'with-apollo-auth' example could be useful, or simply add it in comments in the main folder.

Just my 2 cents.

HaNdTriX · 2020-02-15T10:42:04Z

@BiscuiTech Currently I am not a fan of adding more examples regarding apollo.
We already have a lot examples, that are hard to maintain.

Maybe we can add a docs directory where we explain different strategies regarding those PRs.
Here are some topics we might want to cover in there.

Drawbacks of using Apollo (e.g.: bundle size increase, performance)
Apollo SSR
Apollo partial SSR
Apollo manual SSR
Apollo SSG
Apollo Server
Apollo server side auth
- Especially drawbacks of this approach (caching issues, performance & security)
Apollo client side auth
Apollo _app.js vs Apollo <somePage>.js

As soon as I have time I'll try to write down some of the thoughts I currently have in my head.
Of course PRs are always welcome.

ghost · 2020-02-15T19:27:06Z

Apollo server side auth

Especially drawbacks of this approach (caching issues, performance & security)

Id be particularly interested in your thoughts on this. I understood JS cookies to be less secure so have taken an approach using a seperate login/logout API and have Apollo server pull the token from the cookie.

fev4 · 2020-02-15T21:59:38Z

@HaNdTriX that would be awesome, it would be incredibly helpful!!

Regarding the current PR I've personally encountered an error but I haven't found a way to reproduce it yet. I'm guessing it's because I'm handling auth with Auth0 but I'm uncertain of this. Perhaps it's more likely a bug with the implementation I'm using will need to dig deeper.

The error occurs locally when I'm logging into the web app, then it crashes with this:

Error: A valid Auth0 Domain must be provided
    at Object.createInstance [as default] (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/node_modules/@auth0/nextjs-auth0/dist/instance.node.js:10:15)
    at initAuth0 (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/node_modules/@auth0/nextjs-auth0/dist/index.js:8:46)
    at Module../lib/auth/auth0.js (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/.next/server/static/development/pages/api/login.js:111:133)
    at __webpack_require__ (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/.next/server/static/development/pages/api/login.js:23:31)
    at Module../pages/api/login.js (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/.next/server/static/development/pages/api/login.js:164:73)
    at __webpack_require__ (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/.next/server/static/development/pages/api/login.js:23:31)
    at Object.7 (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/.next/server/static/development/pages/api/login.js:184:18)
    at __webpack_require__ (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/.next/server/static/development/pages/api/login.js:23:31)
    at /Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/.next/server/static/development/pages/api/login.js:91:18
    at Object.<anonymous> (/Users/fillipvt/Local_Projects/wagglio-gitlab/monorepo/.next/server/static/development/pages/api/login.js:94:10)
    at Module._compile (internal/modules/cjs/loader.js:1128:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1167:10)
    at Module.load (internal/modules/cjs/loader.js:983:32)
    at Function.Module._load (internal/modules/cjs/loader.js:891:14)
    at Module.require (internal/modules/cjs/loader.js:1023:19)
    at require (internal/modules/cjs/helpers.js:72:18)

But it's weird because the Auth0 config is done as in the example repo instructions and it was working perfectly before updating the apollo config (it was the only change). So I'm puzzled at the moment.

Will let you know if I find something.

fev4 · 2020-02-16T05:26:34Z

Totally my bad. Ignore the previous one, complete false alarm. Everything is working nicely. Thanks again!

Linux249 · 2020-02-18T09:02:26Z

Hi - thanks for the update, I just tested it to see if the new version maybe solve the problem, that errors from the apollo client are not visible on the server/in the component/pages. Are you aware of the issue? The comment in apollo.js is therefor not up to date

// Prevent Apollo Client GraphQL errors from crashing SSR.
// Handle them in components via the data.error prop:
// https://www.apollographql.com/docs/react/api/react-apollo.html#graphql-query-data-error

Even if the error is visible through CSR the hole part of SSR is somehow useless without an option to handle errors. Most likely it is a problem with apollo and the issue should be fixed with apollo client 3.0 which is currently in beta. Cause you properly will update the example I mention this here - there are many issues I found somehow related to that problem, like this one: apollographql/react-apollo#3678

HaNdTriX · 2020-02-20T15:00:45Z

@Linux249 thanks for your feedback. I will try to look into the issue regarding errors in the future. A good reproduction example could help a lot.

I've also already looked into @apollo/client@3.0.0-beta.36. Currently I decided to wait for it to be stable. This is because:

currently @apollo/client@3.0.0-beta.36 increased its bundle size compared to Version 2 (this is a nogo from my point of view since apollo-client is already way to big).
@apollo/client@3.0.0-beta.36 currently has a lot of bugs when it comes to ssr.
Migrating from apollo-client to @apollo/client is not trivial, because of npm/yarn issues in the dependency tree.

So lets wait for a stable release until we update this example.

jaydenseric · 2020-02-25T08:22:10Z

examples/with-apollo/lib/apollo.js

-
-          // getDataFromTree does not call componentWillUnmount
-          // head side effect therefore need to be cleared manually
-          Head.rewind()


According to @timneutkens , this should not have been removed: #9326 (comment)

Thanks for clarifying 🙏. #10696

HaNdTriX requested review from lfades and Timer as code owners February 7, 2020 15:56

HaNdTriX added 11 commits February 7, 2020 16:56

Make withApollo work with _app.js components

2668970

Support wrapping functional _App

425d9db

Add apolloClient to NextPageContext & NextPageContext

441a2aa

Propertly call App.getInitialProps if used in NextAppContext

5ba21f0

Add Automatic Static Optimization warning

5a6c5bb

Update deps

c3159bc

Reduce API surface

89708d5

Move back to singleton client

0ad8db3

Improve documentation

d116ae7

Remove Head.rewind()

6f820be

We can get rid of .rewind by now as the latest next/head no longer uses legacy context.

Add extra docs

186479f

HaNdTriX force-pushed the examples/apollo-easy-config branch from 60a75d5 to 186479f Compare February 7, 2020 15:56

Reuse apolloState coming from previous hocs

565b739

HaNdTriX changed the title ~~Examples/apollo easy config~~ Update withApollo example Feb 7, 2020

lfades reviewed Feb 11, 2020

View reviewed changes

Timer approved these changes Feb 13, 2020

View reviewed changes

Timer added this to the 9.2.2 milestone Feb 13, 2020

Timer added ready to land examples Issue/PR related to examples labels Feb 13, 2020

Merge branch 'canary' into examples/apollo-easy-config

ed94c45

Merge branch 'canary' into examples/apollo-easy-config

16d456e

Merge branch 'canary' into examples/apollo-easy-config

baca121

Merge branch 'canary' into examples/apollo-easy-config

8b1408b

Timer merged commit 1a50d99 into vercel:canary Feb 13, 2020

HaNdTriX deleted the examples/apollo-easy-config branch February 13, 2020 19:11

HaNdTriX mentioned this pull request Feb 24, 2020

Demonstrate Apollo-Server context usage with-apollo-xxx examples #10413

Closed

jaydenseric reviewed Feb 25, 2020

View reviewed changes

This was referenced Mar 13, 2020

[Snyk] Upgrade next from 9.2.1 to 9.2.2 pixeldrew/hero-masq#10

Closed

[Snyk] Upgrade @next/mdx from 9.0.5 to 9.2.2 shahinalzahrani/docs#1

Open

This was referenced Mar 22, 2020

[Snyk] Upgrade next from 9.1.5 to 9.2.2 evantahler/next-static-hosting#3

Merged

[Snyk] Upgrade next from 9.2.1 to 9.2.2 grouparoo/next-plugins-example#3

Merged

vercel locked as resolved and limited conversation to collaborators Jan 31, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update withApollo example #10451

Update withApollo example #10451

HaNdTriX commented Feb 7, 2020 •

edited

ijjk commented Feb 7, 2020

ijjk commented Feb 7, 2020

lfades Feb 11, 2020

lfades Feb 11, 2020 •

edited

lfades Feb 11, 2020 •

edited

Timer Feb 13, 2020

HaNdTriX Feb 15, 2020

Timer left a comment

ijjk commented Feb 13, 2020

ijjk commented Feb 13, 2020

ijjk commented Feb 13, 2020

kachkaev commented Feb 13, 2020

BiscuiTech commented Feb 14, 2020

HaNdTriX commented Feb 15, 2020

ghost commented Feb 15, 2020

fev4 commented Feb 15, 2020

fev4 commented Feb 16, 2020

Linux249 commented Feb 18, 2020 •

edited

HaNdTriX commented Feb 20, 2020

jaydenseric Feb 25, 2020

HaNdTriX Feb 25, 2020

Update withApollo example #10451

Update withApollo example #10451

Conversation

HaNdTriX commented Feb 7, 2020 • edited

Changelog

Examples

Setting up ApolloClient

Adding authentication

Using withApollo globally on _app.js

Using ApolloClient inside getStaticProps

ijjk commented Feb 7, 2020

Stats from current PR

ijjk commented Feb 7, 2020

Stats from current PR

lfades Feb 11, 2020

Choose a reason for hiding this comment

lfades Feb 11, 2020 • edited

Choose a reason for hiding this comment

lfades Feb 11, 2020 • edited

Choose a reason for hiding this comment

Timer Feb 13, 2020

Choose a reason for hiding this comment

HaNdTriX Feb 15, 2020

Choose a reason for hiding this comment

Timer left a comment

Choose a reason for hiding this comment

ijjk commented Feb 13, 2020

Stats from current PR

ijjk commented Feb 13, 2020

Stats from current PR

ijjk commented Feb 13, 2020

Stats from current PR

kachkaev commented Feb 13, 2020

BiscuiTech commented Feb 14, 2020

HaNdTriX commented Feb 15, 2020

ghost commented Feb 15, 2020

fev4 commented Feb 15, 2020

fev4 commented Feb 16, 2020

Linux249 commented Feb 18, 2020 • edited

HaNdTriX commented Feb 20, 2020

jaydenseric Feb 25, 2020

Choose a reason for hiding this comment

HaNdTriX Feb 25, 2020

Choose a reason for hiding this comment

HaNdTriX commented Feb 7, 2020 •

edited

Using `withApollo` globally on `_app.js`

Using ApolloClient inside `getStaticProps`

lfades Feb 11, 2020 •

edited

lfades Feb 11, 2020 •

edited

Linux249 commented Feb 18, 2020 •

edited