Front-end Framework

Learn about the different front-end frameworks.

Choosing a framework

Absinthe subscriptions use Phoenix channels (by default, at least) which take specialized handling. If you’re going to support subscriptions, it’s probably a good idea to go beyond the JavaScript we’ve been using up to this point and look at more advanced GraphQL clients and framework projects. We’ll cover two of them:

  • Apollo Client
  • Relay

Currently, there are two major client-side JavaScript frameworks that developers use to build user interfaces on top of GraphQL: Relay and the Apollo GraphQL platform.

Relay

Relay is the original project that illustrated the use of GraphQL, released by Facebook at the same time in 2015. It has progressed quite considerably since then. The Apollo platform is effectively a collection of related tools and product offerings built around GraphQL. Relay, on the other hand, is the more prescriptive, opinionated framework to buildGraphQL-based web applications with the library of React Facebook for building user interfaces. The relay sets certain additional expectations about the way we’ve built our GraphQL schema. It also supports some out-of-the-box patterns as a benefit of adhering to those constraints.

Apollo client

The Apollo GraphQL platform takes another approach. Originating from the Meteor Development Group, Apollo is a large set of open-source packages, projects, and tools that work in concert. This provides a GraphQL client framework a more a la carte approach than Relay. Apollo isn’t tied to React and can be more readily layered on existing client applications. This flexibility has made Apollo a popular alternative to the more prepackaged Relay framework.

Both systems have Node.js-based server components that we’ll ignore for the purposes of this course. We’ll focus on the client-side portions of Relay and the Apollo Platform. ...