Using the Apollo framework with Next.js to fetch data

Notice the bulkiness of the previous example. Even if we do not take into account the client/server code, we still end up with an inconvenient build process. What if we could make an app that will not require any build steps, precompilation, Babel plugins, and so on?

Recently, the Apollo Framework has received a lot of traction, and of course it has integration with Next.js.

All we need to do is to install a few packages:

$ npm i apollo-link-http next-apollo react-apollo graphql-tag --save

Then, we need to create a preconfigured HOC that we will attach to our pages:

import {withData} from 'next-apollo'
import {HttpLink} from 'apollo-link-http'

const config = {
    link: new HttpLink({
        uri: 'https://swapi.graph.cool',
        opts: {
            credentials: 'same-origin'
        }
  ...