GOODBYE REST; HELLO GRAPHQL Sandeep Singh initialspark.co.uk @initial_spark 

◦Modern API technologies & challenges ◦What it is, what it’s not and what GraphQL aims to solves? ◦GraphQL core concepts ◦Demo ◦Considerations Agenda @initial_spark 

○REST ○SOAP ○gRPC ○OData ○And many more … API Technologies @initial_spark 

○Architectural style of the web ○Resources ! a single resource e.g. api/patients (nouns) ○Verbs ! GET, PUT, DELETE & POST ○HATEOAS (Hypermedia As The Engine Of Application State) REST @initial_spark 

Sounds good… So why are we looking at GraphQL? @initial_spark 

○Efficiency ○Predictability ○Versioning ○Security ○Caching, tooling, platforms, documentation and more Modern API considerations @initial_spark 

Lets look at an example… @initial_spark 

@initial_spark 

Multiple round-trips (Under-fetching) Code Code REST API /patients /medications /allergies CLIENT 

Includes REST API /patients CLIENT api/patients/1?include=meds,allergies … /medications /allergies 

Over-fetching REST API /patients CLIENT … api/patients/1?include=meds,allergies 

Ad-hoc endpoints Code Code REST API /patients /medications /allergies /patients_summary CLIENT 

Ad-hoc endpoints CLIENT 1 REST API CLIENT 2 /patients_summary /patients_summary_mobile 

Building modern APIs can be hard @initial_spark Q: So how does GraphQL fit in? 

GraphQL is a query language for your API. GraphQL allows developers to compose typed queries to request and receive only the data that’s required from the server in a single network request. “ @initial_spark 

○Built on specification ○Hierarchical ○Product centric ○Strongly typed What is GraphQL? @initial_spark (http://graphql.org) 

○About graph databases ○Assumes nothing about: ! Transport protocol ! Data storage ○A solution for binary streams e.g. file upload ○Limited to JavaScript What GraphQL isn’t @initial_spark 

Clients Server Relay Apollo 

Q: What problems does it help us solve? @initial_spark 

Efficiency @initial_spark 

Efficiency query{ patient(id:"22344667"){ id firstName surname dateOfBirth gender nhsNumber medications(top:5){ name dose prescribedOn } allergies { type recorded severity } } } { "data": { "patient": { "id": 1, "firstName": "Tom", "surname": "Smith", "dateOfBirth": "12/12/1980", "gender": "MALE", "nhsNumber": "12345678911", "medications": [ { "dose": "500mg twice a day", "name": "Amoxicillin", "prescribedOn": "10/01/2016" }, { "dose": "10mg once a day", "name": "Prednisolone", "prescribedOn": "01/05/2011" } ], "allergies":[] } } } 

Efficiency GraphQL API CLIENT 1 CLIENT 2 

Versioning Evolution @initial_spark 

Versioning @initial_spark (http://graphql.org) 

Tooling & Documentation @initial_spark 

Tooling & Documentation @initial_spark 

REST GraphQL Persistence Business Logic HTTP Authentication Authorisation Technology Stack @initial_spark 

REST GraphQL Conceptual Model Resources Graph Related operations Yes No Introspection No Yes Data typing Weak Strong Real-Time No Yes Comparison @initial_spark 

GraphQL Core Concepts @initial_spark 

Schema Type System Operations GraphQL Core Concepts 

Type system @initial_spark • Object type • Scalar types • Enumeration Types • Lists • Interfaces • Unions type Patient{ id:Integer identifier:String! firstName:String surname:String dateOfBirth:String isDeceased:Boolean medications: [MedicationType] } 

Operations | queries @initial_spark 

Operations – Queries @initial_spark 

Operations | mutations @initial_spark 

Operations - Mutations @initial_spark 

Operations - Resolve @initial_spark • Call business logic • Map object • Call existing REST API • Query and mutate data • Applies to all fields { type: PatientType, resolve(obj, {args}, ctx) { return ctx.db.getPatient(args); } }; 

Schema @initial_spark 

Schema @initial_spark const schema = new GraphQLSchema({ query: new GraphQLObjectType({ name: 'RootQueryType', fields: () => ({ patient: PatientQueries.patient, allPatients: PatientQueries.allPatients, medications: PatientQueries.medications, allergies: PatientQueries.allergies }) }), mutation: new GraphQLObjectType({ name: 'RootMutation', fields: () => ({ addPatient: AddPatientMutation, deletePatient: DeletePatientMutation }) }) }); 

DEMO @initial_spark 

Considerations @initial_spark 

Caching ◦ Client and app server ◦ Can’t use network caching e.g. Varnish, Squid etc ◦ Solution: Cache queries (normalised cache) 

Performance ◦ Optimise queries/mutations ◦ N+1 problem ◦ Solution: Loaders - Batching 

Security ◦ Don’t expose anything you don’t want to be public ◦ Malicious queries ◦ Solution: Timeouts, max query depth/query complexity analysis 

Error handling ◦ Can’t use HTTP codes to provide contextual information ◦ Surfacing errors to user(s) ◦ Solution: Validation, return errors in response object 

Q: Use cases? @initial_spark 

○http://graphql.org/learn/ ○https://github.com/chentsulin/awesome-graphql ○https://github.com/apollographql/apollo-client ○https://github.com/initialspark/goodbye-rest-hello-graphql ○http://graphql.org/swapi-graphql/ Resources @initial_spark 

Thank you ! You can find me at @initial_spark & initialspark.co.uk