- Deepak Shevani works at Microsoft for the Azure group and recently became interested in GraphQL.
- GraphQL was created by Facebook in 2015 to improve client-server communication when rebuilding their native mobile apps. It defines a query language and provides a server-side runtime to fetch the desired data.
- GraphQL allows clients to get precisely the data they need through queries, reducing over- and under-fetching of data compared to REST APIs.
4. History of Web Services
4
1960 1990 2000 2018
RPC SOAP REST GRAPHQL
5. REST Drawbacks
▧ Client Options : Http Verbs (GET, PUT, POST)
▧ Resources : /users /users/1 /users/1/posts
▧ No control over which fields to select
▧ Versioning of APIs is painful
▧ Overfetching / Underfetching
▧ Managing multiple endpoints is headache
▧ Change Process hindering agility
5
6. GraphQL origins ?
▧ In 2012, FB decided to rebuild native apps
▧ FB then used RESTful services & FQL
▧ Idea : Improving client server communication
▧ Result : In 2015, open sourced GraphQL
▧ Also provided reference implementation (js)
6
11. Meet GraphQL
QUERY LANGUAGE
GraphQL defines query language and
query is validated against type system
which is blueprint for API Data
SERVER SIDE RUNTIME
GraphQL provides server side runtime to
parse and route queries to fetch desired
data for the caller
More info about GraphQL can be found at
http://graphql.org/learn
11
STRONGLY TYPED
GraphQL allows you to do domain first
design that generates types and schema
CLIENT CENTRIC
GraphQL has developer centric view biased
towards clients
12. Meet GraphQL
QUERY LANGUAGE
GraphQL defines query language and
query is validated against type system
which is blueprint for API Data
SERVER SIDE RUNTIME
GraphQL provides server side runtime to
parse and route queries to fetch desired
data for the caller
More info about GraphQL can be found at
http://graphql.org/learn
12
STRONGLY TYPED
GraphQL allows you to do domain first
design that generates types and schema
CLIENT CENTRIC
GraphQL has developer centric view biased
towards clients
13. What is GraphQL
QUERY LANGUAGE
GraphQL defines query language and
query is validated against type system
which is blueprint for API Data
SERVER SIDE RUNTIME
GraphQL provides server side runtime to
parse and route queries to fetch desired
data for the caller
More info about GraphQL can be found at
http://graphql.org/learn
13
STRONGLY TYPED
GraphQL allows you to do domain first
design that generates types and schema
CLIENT CENTRIC
GraphQL has developer centric view biased
towards clients
21. What is GraphQL
QUERY LANGUAGE
GraphQL defines query language and
query is validated against type system
which is blueprint for API Data
SERVER SIDE RUNTIME
GraphQL provides server side runtime to
parse and route queries to fetch desired
data for the caller
More info about GraphQL can be found at
http://graphql.org/learn
21
Queries
Mutations
Subscriptions Fragments
Type System
Validation
Execution
23. Queries
Fetch data
Describes what data you want to fetch
from server. Response from server reflects
what you ask in query (selection sets). We
can create fragments to create reusable
selection sets
Query is GraphQL root type, as it maps to
an operation
Each field in selection set can have scalar
or object type.
Example
fragment basicInfo on Employee {
name
email
}
query {
employee (id : 35) {
... basicInfo
}
}
More info about GraphQL can be found at
http://graphql.org/learn
23
25. GraphQL Operations
25
query GetTweets {
allTweets {
text
user
}
}
mutation Post ($body : String!) {
addTweet (body : $body) {
id
}
}
Query Operation
Mutation Operation
variables : { body : "LSPE 15th" }
variables : { body : "Loving it" }
26. Mutations
Update or Delete data
Like queries, we could name them. We
could also include selection sets to define
return types
Mutations are also root types, and they
usually include variables
Example
mutation createSong($title:String! $one:Int) {
addSong(title:$title, numberOne:$one) {
id
title
numberOne
}
}
More info about GraphQL can be found at
http://graphql.org/learn
26
28. Subscriptions
Real time updates
Using web sockets, you could listen to real
time updates from the server
At Facebook, the use case was to fetch real
time likes on a page without getting
refreshed
Subscriptions are also root types
Example
subscription {
liftStatusChange {
name
capacity
status
}
}
More info about GraphQL can be found at
http://graphql.org/learn
28
29. Query Language
QUERY
query {
programs {
name
status
}
}
FRAGMENTS
fragment liftInfo on Lift {
name
status
capacity
night
elevationGain
}
29
MUTATIONS
mutation {
create(id: "program" status: OPEN) {
name
status
}
}
SUBSCRIPTIONS
subscription {
liftStatusChange {
name
capacity
status
}
}