Awesome React GraphQL
A curated collection of resources, clients and tools that make working with
GraphQL and React/React Native
awesome.
Contents
- General Resources
- Clients
- Developer Tools
- Tutorials
- Boilerplates
- Advanced Use Cases
- GraphQL BaaS Providers
- Articles and Videos
- Stories
General Resources
Clients
React and React Native clients for GraphQL
- Apollo: Apollo Client is a community-driven GraphQL client for React, JavaScript, and native platforms
- Relay Modern: A JavaScript framework for building data-driven React applications
Developer Tools
Tools for better development (debugging, linting, validation etc)
- Code generators:
- apollo-codegen: Generate API code or type annotations based on a GraphQL schema and query documents
- graphql-code-generator: GraphQL code generator with flexible support for custom templates
- Linters:
- eslint-plugin-graphql: Check your GraphQL query strings against a schema
- ReactJS Debugging Tools
- Apollo Client Developer Tools: Chrome extension for Apollo Client developer tools
- Relay DevTools: A Chrome Extension that creates a Relay tab in the developer tools interface for debugging apps in Chrome
- Relay Devtools Electron: StandAlone Relay DevTools App for debugging Relay outside Chrome
- React Native Debugging Tools
- Relay Devtools Electron: StandAlone Relay DevTools App for debugging Relay outside Chrome
Tutorials
Awesome tutorials for using GraphQL with React and React Native
- ReactJS
- React Native
- (Video series) Build a Twitter Clone with Apollo Graphql & React-Native
- How to setup React Native + GraphQL + Relay Modern
- Building Chatty: A WhatsApp clone with React Native and Apollo
- Miscellaneous
Boilerplates and Example Apps
Boilerplates and examples for a headstart in development
- ReactJS
- ReactQL: Universal React+GraphQL starter kit
- UniversalRelayBoilerplate
- React Todo App using Apollo Client Boilerplate + examples for React Native (iOS, Android), React (isomorphic, Material-UI), Relay, GraphQL, JWT, Node.js, Apache Cassandra.
- Relay Skeleton - Relay project skeleton.
- Next.js With Apollo - Boilerplate for building Next.js apps with Apollo.
- Universal React Apollo - Universal React Apollo Example App with Webpack, Recompose, CSS Modules, and other cool stuff.
- GitHunt React
- Extensive React + Apollo + GraphQL GitHub Client
- React Native
- WhatsApp Clone
- React Native Todo App using Apollo Client
- frontpage-react-native-app: Apollo "hello world" app, for React Native
- pokedex-react-native
Advanced Use Cases
- Server-side Rendering
- Offline apps
- Realtime
- (Video) Robert Zhu - Realtime React Apps with GraphQL - React Conf 2017
- Polling: Dynamic GraphQL polling with React and Apollo Client
- Subscriptions with Relay Modern
- Subscriptions with Apollo Client: Learn how to achieve realtime data with GraphQL subscriptions using Apollo Client.
- Gatsby: Blazing-fast static site generator for React
GraphQL BaaS Providers
Get a GraphQL backend for your applications using these service providers
- GraphCool: Self-Hosted GraphQL BaaS
- Hasura: Instant GraphQL APIs on Postgres
- Scaphold: GraphQL Backend As A Service
Articles and Videos
Articles
- So what’s this GraphQL thing I keep hearing about?
- Thinking in Graphs
- What are the benefits of using GraphQL and why it surpasses REST
Videos
Stories
Good and bad experiences