Advices and “must-know” things regarding GraphQL usage.
Install JS GraphQL IntelliJ Plugin: GraphQL language support for WebStorm, IntelliJ IDEA and other IDEs based on the IntelliJ Platform.
The plugin is available using WebStorm directly. To install it, open your IDE “Settings”, “Plugins”, “Marketplace” and search for “GraphQL”.
The plugin is built-in and should be available as soon as you open the project using WebStorm.
The usage of both
gql and the IntelliJ GraphQL plugin is awesome, it allows writing GraphQL queries (see
src/gql) and have auto-completion and validation from WebStorm itself.
To refresh the GraphQL spec, just run the
.graphqlconfig file by opening it and run the stage you want to sync (usually staging).
graphql: Client for connecting to a GraphQL endpoint.
graphql-tag: Helpful utilities for parsing GraphQL queries. Useful to write plain-text GraphQL query using the
gqltag, that can be validated by other tools, such as JS GraphQL IntelliJ Plugin.
We use Apollo to manipulate our GraphQL endpoint.
React Apollo allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework. React Apollo may be used in any context that React may be used.
apollo-boost: Apollo Boost is a zero-config way to start using Apollo Client. It includes some sensible defaults, such as our recommended InMemoryCache and HttpLink, which come configured for you with our recommended settings. Even though it may seems unused, this package is required as peer-dependency.
apollo-cache-inmemory: Recommended cache implementation for Apollo Client 2.0. InMemoryCache is a normalized data store that supports all of Apollo Client 1.0’s features without the dependency on Redux.
apollo-client: Apollo Client is a fully-featured caching GraphQL client with integrations for React, Angular, and more. It allows you to easily build UI components that fetch data via GraphQL.
apollo-link-http: The http link is a terminating link that fetches GraphQL results from a GraphQL endpoint over an http connection.
react-apollo: React Apollo allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework. React Apollo may be used in any context that React may be used. In the browser, in React Native, or in Node.js when you want to do server-side rendering.
It works fine with both SSR and client-side navigation.
We provide some headers on-the-fly (for I18n), that are added per-query basis.