apollo-client-ssr
The necessary HOC and hook for SSR. e.g. Next.js.
Last updated 2 months ago by onichandame .
MIT · Original npm · Tarball · package.json
$ cnpm install apollo-client-ssr 
SYNC missed versions from official npm registry.

Apollo Client for SSR

The necessary HOC and hook for SSR. e.g. Next.js.

This is a thin wrapper around next-with-apollo. If you don't need subscription to work with SSR, please use it instead.

Author

onichandame

Usage

import React, { FC } from 'react'
import gql from 'graphql-tag'
import { withApollo } from 'apollo-client-ssr'
import { useQuery, useMutation, useSubscription } from 'apollo-client-ssr'

const QUERY = gql`
  query book($id: String!){
    book(id: $id){
      author
    }
  }
`

const MUTATION = gql`
  mutation book($id: String!, $authoor: String!){
    book(id: $id, author: $authoor)
  }
`

const SUBSCRIPTION = gql`
  subscription book($id: String!){
    book(id: $id){
      author
    }
  }
`

const Query: FC = () => {
  const { data,loading } = useQuery<{book: {author: string}}>(QUERY, { variables: {id: '1'} })
  if(loading || !data) return <p>loading...</p>
  else return <p>{`book 1 is authored by ${data.book.author}`}</p>
}

export const QueryAuthor = withApollo(Query, {
  url: 'localhost/graphql'
})

const Mutation: FC = () => {
  const { data, loading } = useMutation<boolean>(MUTATION, {variables: {id: '1', author: 'shakespeare'}})
  if(loading || !data) return <p>loading...</p>
  else return <p>{data.book ? 'done' : 'failed'}</p>
}

export const MutateAuthor = withApollo(Mutation, {
  url: 'localhost/graphql'
})

const Subscription: FC = () => {
  const { data, loading } = useSubscription<{book: {author: string}}>({
    query: [ QUERY, { variables: {id: '1'} }], // needed for the first render on the server side
    subscription: [ SUBSCRIPTION, { variables: {id: '1'} } ]
  })
  if(loading || !data) return <p>loading...</p>
  else return <p>{`book 1 is authored by ${data.book.author}`}</p>
}

export const SubscriptionAuthor = withApollo(Subscription, {
  url: 'localhost/graphql'
})

License

MIT

Contributing

Please open issues or PRs to discuss whatever you think that will make this tool more convenient!

Roadmap

  • add SSL support for http and ws

Current Tags

  • 0.0.11                                ...           latest (2 months ago)

12 Versions

  • 0.0.11                                ...           2 months ago
  • 0.0.10                                ...           4 months ago
  • 0.0.9                                ...           4 months ago
  • 0.0.8                                ...           4 months ago
  • 0.0.7                                ...           4 months ago
  • 0.0.6                                ...           4 months ago
  • 0.0.5                                ...           4 months ago
  • 0.0.4                                ...           4 months ago
  • 0.0.3                                ...           4 months ago
  • 0.0.2                                ...           5 months ago
  • 0.0.1                                ...           5 months ago
  • 0.0.0                                ...           5 months ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (11)
Dev Dependencies (9)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |