GraphQL support in the JSS React sample app
The sample application supports using Sitecore GraphQL to enable accessing content or other custom data schemas (for example, aggregating an existing set of backend REST services).
Sitecore GraphQL does not come with a disconnected mock service, so it can only operate with a JSS app running in connected, integrated, or headless application modes. If you require disconnected GraphQL functionality, graphql-tools has very powerful GraphQL mocking capabilities.
The remainder of this topic describes using GraphQL in connected mode.
Do not confuse connected application mode with connected GraphQL.
The React sample app uses the Apollo GraphQL client. To use the ApolloGraphQL Client, follow the react/apollo documentation for usage and implementation details, but instead of using the graphql higher-order component (HOC), use the JSS-specific GraphQLData HOC instead. This service has the same API as Apollo but performs JSS-specific operations to make it compatible with Sitecore.
Complete examples of using connected and integrated GraphQL are provided in the folder src/components and contain documentation comments. For example, src/components/graphql/GraphQL-ConnectedDemo shows you how to use connected GraphQL. Please refer to these samples for implementation details.