View integrations

How to use Apollo Client with the view layer your application is developed in!

React

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 server-side render.

React Apollo, unlike some other tools in the React ecosystem, requires no complex build setup to get up and running. As long as you have a GraphQL server you can get started building out your application with React immediately. React Apollo works out of the box with both create-react-app and React Native with a single install and with no extra hassle configuring Babel or other JavaScript tools.

Vue

A Vue.js integration is maintained by Guillaume Chau (@Akryum). See the Github repository for more details.

Svelte

A Svelte integration is maintained by Tim Hall (@timhall). See Github repository for more details.

Angular

To use Apollo with the Angular rendering library, see the Angular guide;

Ember

There are two Ember integrations available:

• ember-apollo-client is maintained by Blake Gentry (@bgentry).
• ember-apollo is maintained by Jeff Levy (@jlevycpa).

Web Components

Web components are the browser-built-in component APIs. They are defined in a framework-agnostic way, using either vanilla JS or libraries like lit-element or hybrids.

• apollo-elements includes support for lit-element, gluon, hybrids, and polymer, as well as providing class mixin functions so you can integrate Apollo into vanilla elements or any other web component library. Apollo Elements is maintained by Benny Powers (@bennypowers).
• polymer-apollo is a separate Polymer integration maintained by Arun Kumar T K (@aruntk).

Previous: Compiling queries with Babel
Next: Integrating with React Native