Introduction to GraphQL Software Developer, Newlogic @arnellebalane 

What is GraphQL? 

a query language for our APIs, and a runtime for fulfilling these queries 

a query language for our APIs, and a runtime for fulfilling these queries 

GraphQL is a query language It gives clients the ability to ask for the exact data that they need, and nothing more runtime It provides a complete and understandable description of the data available in the API, and defines how to get those data 

query { post(id: 1) { id content comments { content } } } { "data": { "post": { "id": "abc123", "content": "Hello GraphQL!", "comments": [{ "content": "Hey!" }, { "content": "Yoooo!" }] } } } 

it’s just a new way to send data over HTTP 

it’s just a new way to send data over HTTP ( ehem... REST ) 

GraphQL vs REST ( part one ) 

Both have the idea of a resource, which is the piece of data in our API. Usually these resources have their own IDs They’re similar! Both can fetch resources via HTTP with a URL Both can return a JSON representation of the resource being fetched 

REST But also different! GraphQL The server determines what fields are returned to the client when fetching a resource The server returns only the fields that were queried by the client 

The available resources are described in a “schema” ● A schema is a typed representation of the resources, their fields, and their relationships with each other Each resource is identified by a URL REST But also different! GraphQL example.com/api/posts example.com/api/posts/1 example.com/api/posts/1/comments 

type Query { posts: [Post] post(id: ID!): Post } type Post { id: ID! content: String comments: [Comment] } type Comment { id: ID! content: String } 

Both need to differentiate if the request is meant to read or write data They’re similar! Both provide a way to interact with our API data 

REST But also different! Interact with API data using a list of available root queries ● “Which query should I use?” Interact with API data using a list of available endpoints ● “Which endpoint should I use?” GraphQL 

REST But also different! Interact with API data using a list of available root queries ● “Which query should I use?” Interact with API data using a list of available endpoints ● “Which endpoint should I use?” GraphQL Use HTTP methods (i.e. GET, POST, etc.) to differentiate read/write operations Use query to read data, use mutation to write data 

They’re similar! Both eventually call a function in the server when a request is received 

Route handlers are called when requests are received REST But also different! GraphQL app.get('/books/:id', (req, res) => { res.json(book); }) Resolver functions are called corresponding to the fields requested ● Each field in the GraphQL schema has a corresponding “resolver” function which returns the value for that field Each request can call multiple field resolvers from different resources 

GraphQL syntax 

bit.ly/graphql-playground graphql.org/learn/queries 

Queries ● Fields ● Arguments ● Aliases Summary Mutations Subscriptions ● Fragments ● Variables ● Operation Names 

Get the content, number of likes, and author email for posts with ID of 1 and 3 

Add yourself as a new user, then create a new post as that user 

Subscribe to the latest posts, showing their content and creation date 

GraphQL schema and resolvers 

bit.ly/fdc-graphql-workshop graphql.org/learn/schema 

Add a new root query field that will return all users 

Add a new mutation for creating a new comment for a given post using a given user 

GraphQL in our apps 

● Apollo Client ● Relay ● … and many more Server libraries/services graphql.org/code ● Apollo Server ● Express GraphQL ● Hasura Client libraries 

bit.ly/fdc-apollo-react apollographql.com/docs/react/get-started/ 

GraphQL vs REST ( part two ) 

REST is years ahead of GraphQL Tools and integrations, e.g. for monitoring, alerting, logging, etc. Versioning, authentication, authorization, file uploads, caching, etc. GraphQL requests can’t be cached as easily as REST requests 

GraphQL Introspection GraphQL Subscriptions Apollo Graph Manager 

Should you use GraphQL? 

Thank you! Software Developer, Newlogic @arnellebalane