▸ The term representational state transfer was introduced and
deﬁned in 2000 by Roy Fielding
▸ The defacto standard for communicating with a server
▸ Deﬁnes simple operations: GET, PUT, POST, DELETE
▸ A query operation (like GET) promises no side-effects (e.g.
changes) in data being queried. Commands (like PUT/DELETE)
answer no questions about the data, but compute changes
applied to the data (e.g. UPDATE or INSERT to use database
▸ Many endpoints - proliferation of ad hoc endpoints
▸ Many round trips between the client and server
▸ First fetch pilots, then fetch homeworld info for each pilot, then…
▸ Very expensive for mobile apps
▸ Response structure may change over time
▸ Data overfetching
▸ We don’t always need all the data for a REST call
▸ Usually no metadata
▸ Big blob of data…we can’t run inquires on it’s types or structure
FIXES FOR REST??
▸ Deﬁne your own ad-hoc query language
▸ Use REST PATCH to minimize data transfer ?
▸ REST API introspection via Swagger (http://swagger.io/)
WHAT IS GRAPHQL?
▸ Queries describe the shape of data that the client needs. The
response has the same structure as the request query.
▸ Server interprets GraphQL calls and queries the database (or
any other source of data)
▸ GraphQL is language-, database- and protocol-agnostic
INVENTED AT FACEBOOK
IN 2012, BUT IT WAS
FIRST SHOWN TO
PUBLIC IN 2015 DURING
REACT.JS CONF AS A
PART OF FACEBOOK
▸ Single endpoint
▸ Hierarchical nature
▸ Strongly typed - enables validation, introspection and more
▸ Response mirrors the shape of the query
▸ Introspection - make inquiries from your client about the schema
▸ Application-Layer Protocol
▸ GraphQL is an application-layer protocol and does not require a particular
transport. It is a string that is parsed and interpreted by a server.
▸ Syntax (covered)
▸ Type System
▸ Edges/Nodes & Pagination
GRAPHQL TYPE SYSTEM
▸ Scalars - basic types
▸ Schema - a representation of the capabilities of the GraphQL
▸ Deﬁnitions - deﬁning types
▸ Predicates - meta info on types
▸ Un-modiﬁers - type “un” modiﬁers
▸ GraphQLInt - integer number
▸ GraphQLFloat - ﬂoat number
▸ GraphQLString - string
▸ GraphQLBoolean - boolean
▸ GraphQLID - represents an ID (essentially a string)
▸ It all starts with a “root” query
▸ Fields on type can be plain data or “resolved”
▸ You can deﬁne your own types
▸ You can deﬁne/override the serialization on a type
▸ You can add enhanced validation to types
▸ From a schema, you can generate a more human readable
schema and JSON based schema for clients to use
▸ GraphQLScalarType - the class of scalars
▸ GraphQLObjectType - an object
▸ GraphQLInterfaceType - a interface
▸ GraphQLUnionType - a union
▸ GraphQLEnumType - enum
▸ GraphQLList - what you use for lists arrays of objects
▸ GraphQLNonNull - an object for which null is an invalid value
GRAPHQL DATA RESOLUTION
▸ Resolve to data - synchronous
result. Return the data as teh
result of a resolve.
▸ Resolve to promise -
asynchronous result. Return a
promise that will return the
data in the future. My
preference is to use ES6 and
async functions (which actually
▸ Not built into the language, but provided by types
▸ The type Facebook uses and I recommend you use too, are in
▸ Using edges and nodes allow for pagination. If you don’t
need pagination, then use a simple GraphQLList.
RUNNING ON EXPRESS https://github.com/graphql/graphql-js
Credits: Snippet from https://github.com/mattkrick/meatier
▸ Build your server…I use Babel and ES6
▸ You’ll also need to run (see sample code) a script to “update”
your schema. This creates a client and a human readable
version of your schema.
▸ If you are using Relay, you will also need to use the Babel-
Relay plugin to consume, compile and validate your GraphQL
queries in your components.
▸ You also need to tell the Babel-Relay plugin where to ﬁnd the
schema you built above (the JSON form).
▸ Hopefully more sense
▸ All of the queries you see are deﬁned by your schema. I.e.
things like viewer, user, edge, node are deﬁned by the
schema and not an inherent part of the language.
▸ There are 3rd party ports for Python, Scala, Go, Ruby, etc.
▸ GraphQL requires special communications protocol. Nope!
▸ The default implementation uses a basic REST post call, but you can use
web sockets, etc. and even mix and match.
GRAPHQL & RELAY
▸ Cartoon Guides To
▸ Awesome GraphQL -
curated list on Github:
GRAPHQL & RELAY
▸ GraphQL Home: http://graphql.org/
▸ GraphQL Spec: https://facebook.github.io/graphql/
▸ Many REST APIs you can experiment with using GraphQL: