![9 @luisw19
9
GraphQL – What is it then?
A consumer oriented query language, a strongly typed schema
language and a runtime to implement GraphQL services.
Define Schema
type Country {
id: ID!
name: String!
code: String!
}
type query {
countries:
[Country]
}
GraphQL Service GraphQL Client
Quickly write and
run queries
{
getCountries(name:"great")
{
name
}
}
GraphQL Client
Get exactly what
you asked for
{
"data": {
"countries": [
{
"name": "United
Kingdom"
}
]
}
}
01](https://image.slidesharecdn.com/graphqlasanalternativeapproachtorest-181204171431/85/GraphQL-as-an-alternative-approach-to-REST-as-presented-at-Java2Days-CodeMonsters-UKOUG-AIOUG-Sangam-9-320.jpg)
![22 @luisw19
22
Browser
GraphQL Client
Simple GraphQL Query Demo (I) - Mock
{
query
}
GraphQL Server:
Apollo/Express
GraphQL Service
Graphiql
GraphQL Schema
GraphQL Endpoint
http://.../graphiql
Query Operation {JSON}
[HTTP/POST]
{JSON}
{
data
}
https://github.com/luisw19/graphql-samples/tree/master/graphql-
countries-part1
02
Apollo Express: https://github.com/apollographql/apollo-server](https://image.slidesharecdn.com/graphqlasanalternativeapproachtorest-181204171431/85/GraphQL-as-an-alternative-approach-to-REST-as-presented-at-Java2Days-CodeMonsters-UKOUG-AIOUG-Sangam-22-320.jpg)
![23 @luisw19
23
Browser
GraphQL Client
Simple GraphQL Query Demo (II) – REST Backend
{
query
}
GraphQL Server:
Apollo/Express
GraphQL Service
Graphiql
GraphQL Schema
GraphQL Endpoint
Query Operation {JSON}
[HTTP/POST]
{JSON}
{
data
}
https://github.com/luisw19/graphql-samples/tree/master/graphql-
countries-part2
[HTTP/GET]
https://restcountries.eu/rest/v2/{resource}
{JSON}
REST COUNTRIES
02](https://image.slidesharecdn.com/graphqlasanalternativeapproachtorest-181204171431/85/GraphQL-as-an-alternative-approach-to-REST-as-presented-at-Java2Days-CodeMonsters-UKOUG-AIOUG-Sangam-23-320.jpg)
![24 @luisw19
24
Docker Container
Browser
GraphQL Client
Simple GraphQL Query Demo (III) - Mutation
{
query
}
GraphQL Server:
Apollo/Express
GraphQL Service
Graphiql
GraphQL Schema
GraphQL Endpoint
Query Operation {JSON}
[HTTP/POST]
{JSON}
{
data
}
https://github.com/luisw19/graphql-samples/tree/master/graphql-
countries-part3
[HTTP/GET]
https://restcountries.eu/rest/v2/{resource}
{JSON}
REST COUNTRIES
[HTTP/POST]
http://localhost:8000/{resource}
{JSON}
RequestBIN
02](https://image.slidesharecdn.com/graphqlasanalternativeapproachtorest-181204171431/85/GraphQL-as-an-alternative-approach-to-REST-as-presented-at-Java2Days-CodeMonsters-UKOUG-AIOUG-Sangam-24-320.jpg)
![25 @luisw19
25
Browser
GraphQL Client
Simple GraphQL Query Demo (IV) – API Composition
{
query
}
GraphQL Server:
Apollo/Express
GraphQL Service
Graphiql
GraphQL Schema
GraphQL Endpoint
Query Operation {JSON}
[HTTP/POST]
{JSON}
{
data
}
Not merged yet… (soon)
[HTTP/GET]
https://restcountries.eu/rest/v2/{resource}
{JSON}
REST COUNTRIES
[HTTP/POST]
https://www.google.co.uk/search?q={search}
{JSON}
02](https://image.slidesharecdn.com/graphqlasanalternativeapproachtorest-181204171431/85/GraphQL-as-an-alternative-approach-to-REST-as-presented-at-Java2Days-CodeMonsters-UKOUG-AIOUG-Sangam-25-320.jpg)
GraphQL as an alternative approach to REST (as presented at Java2Days/CodeMonsters, UKOUG, AIOUG/Sangam)
- 1. 1 @luisw19 GraphQL as an alternative approach to REST
- 2. About me Luis Weir CTO at Capgemini UK Oracle Ace Director & Groundbreaker Ambassador [email protected] uk.linkedin.com/in/lweir http://www.soa4u.co.uk apiplatform.cloud/ Released Q2 2018 tinyurl.com/eapim18 Goes to Print Q2 2019 • The 7 Deadly Sins of API Design • Setting the vision, strategy and direction — the CTO’s role • How can you design, deploy and manage your APIs? • The Spotify's Engineering Culture. My interpretation and summary • A comparison of API Gateways communication styles • Is BPM Dead, Long Live Microservices? • Five Minutes with Luis Weir • 2nd vs 3rd Generation API Platforms - A Comprehensive Comparison • Podcast: Are Microservices and APIs Becoming SOA 2.0? • 3rd-Generation API Management: From Proxies to Micro-Gateways • Oracle API Platform Cloud Service Overview Latest articles: @luisw19 Want the slides? I’ll share via:
- 3. 3 @luisw19© 2018 Capgemini. All rights reserved. GraphQL as an alternative appraoch to REST GraphQL – context & key concepts GraphQL vs REST PoV 01 03 Demos02 Conclusions04
- 4. 4 @luisw19 Application Programming Interfaces (APIs) are doors to information and functionality.
- 5. 5 @luisw19 5 But some doors can be unfit for purpose… source: https://imgur.com/a/J3ttg 01
- 6. 6 @luisw19 6 Why GraphQL? Source: https://dev-blog.apollodata.com/graphql-vs-rest- 5d425123e34b by Sashko Stubailo 01
- 7. 7 @luisw19 7 GraphQL - Background • Created by Facebook in 2012 to get around a common constraints in the REST approach when fetching data • Publicly released in 2015 • GraphQL Schema Definition Language (SDL) added to spec in Feb’18 Latest release: http://facebook.github.io/graphql Latest draft: http://facebook.github.io/graphql/draft/ https://GraphQL.org 01
- 8. 8 @luisw19 8 GraphQL – What is it NOT? a query language for a databases in spite of its name, it has nothing to do with Graphs DBs A silver Bullet necessarily a replacement for REST. Both can work together 01 Roy from the IT Crowed à
- 9. 9 @luisw19 9 GraphQL – What is it then? A consumer oriented query language, a strongly typed schema language and a runtime to implement GraphQL services. Define Schema type Country { id: ID! name: String! code: String! } type query { countries: [Country] } GraphQL Service GraphQL Client Quickly write and run queries { getCountries(name:"great") { name } } GraphQL Client Get exactly what you asked for { "data": { "countries": [ { "name": "United Kingdom" } ] } } 01
- 10. 10 @luisw19 10 Who is using it? Lots of organisations are embracing GraphQL: http://graphql.org/users 01
- 11. 11 @luisw19 11 Increasing rapidly in Popularity https://trends.google.com/trends/explore?date=2016-01-01%202018-12-01&q=GraphQL,REST%20API,OData GraphQL REST API OData Jan 2016 Dec 2018 01
- 12. 12 @luisw19 12 Let’s put it into perspective https://trends.google.com/trends/explore?date=2004-01-10%202018-11-30&q=GraphQL,REST%20API,OData,WSDL trend WSDL 01 GraphQL REST API OData Feb 2004 Sep 2018
- 13. 13 @luisw19 13 GraphQL – Key Concepts There are 5 key characteristics of GraphQL that are important to understand: Hierarchical Queries as hierarchies of data definitions, shaped just how data is expected to be retuned. 1 View-centric By design built to satisfy frontend application requirements. 2 Strongly-typed A GraphQL server defines a specific type system. Queries are executed within this context. 3 4 Introspective The type system itself is queryable. Tools are built around this capability. 5 Version-Free GraphQL takes a strong opinion on avoiding versioning by providing the tools for the continuous evolution. 01
- 14. 14 @luisw19 GraphQL Server Implementation GraphQL Schema Definition Language GraphQL Schema (Data) Types (Object, Input, Scalar, Enum, Interface, Union) Queries (operation type) Mutations (operation type) Resolvers f(x), f(x), f(x) Subscriptions (operation type) Define Types have have have Execute 14 GraphQL – Anatomy 01
- 15. 15 @luisw19 GraphQL Server Implementation GraphQL Schema Definition Language GraphQL Schema (Data) Types (Object, Input, Scalar, Enum, Interface, Union) Queries (operation type) Mutations (operation type) Resolvers f(x), f(x), f(x) Subscriptions (operation type) Define Types have have have Execute 15 GraphQL – Anatomy Effectively the blueprint of a GraphQL API, it defines the Types, Queries and Mutations supported in a GraphQL service 1 01
- 16. 16 @luisw19 GraphQL Server Implementation GraphQL Schema Definition Language GraphQL Schema (Data) Types (Object, Input, Scalar, Enum, Interface, Union) Queries (operation type) Mutations (operation type) Resolvers f(x), f(x), f(x) Subscriptions (operation type) Define Types have have have Execute 16 GraphQL – Anatomy Object, Input, Scalar, Enumeration, Interfaces and Unions are all types to define data structures, which are used in Operation types. 2 01
- 17. 17 @luisw19 GraphQL Server Implementation GraphQL Schema Definition Language GraphQL Schema (Data) Types (Object, Input, Scalar, Enum, Interface, Union) Queries (operation type) Mutations (operation type) Resolvers f(x), f(x), f(x) Subscriptions (operation type) Define Types have have have Execute 17 GraphQL – Anatomy Entry point for operations that fetch data (read / search). Note that a single Query type can define multiple query operations. 3 01
- 18. 18 @luisw19 GraphQL Server Implementation GraphQL Schema Definition Language GraphQL Schema (Data) Types (Object, Input, Scalar, Enum, Interface, Union) Queries (operation type) Mutations (operation type) Resolvers f(x), f(x), f(x) Subscriptions (operation type) Define Types have have have Execute 18 GraphQL – Key Concepts Entry point for operations that create/update data via a GraphQL service. Note that a single Mutation type can define multiple mutation operations. 4 01
- 19. 19 @luisw19 GraphQL Server Implementation GraphQL Schema Definition Language GraphQL Schema (Data) Types (Object, Input, Scalar, Enum, Interface, Union) Queries (operation type) Mutations (operation type) Resolvers f(x), f(x), f(x) Subscriptions (operation type) Define Types have have have Execute 19 GraphQL – Anatomy *new* Pub/sub system for near- realtime updates. Unlike queries or mutations, it can deliver more than one result via push. 01 5
- 20. 20 @luisw19 GraphQL Server Implementation GraphQL Schema Definition Language GraphQL Schema (Data) Types (Object, Input, Scalar, Enum, Interface, Union) Queries (operation type) Mutations (operation type) Resolvers f(x), f(x), f(x) Subscriptions (operation type) Define Types have have have Execute 20 GraphQL – Anatomy Functions that define how each field, within a GraphQL Query or Operation is to be acted upon. 6 01
- 21. 21 @luisw19 21 GraphQL Schema Cheat Sheet https://github.com/sogko/graphql-schema-language-cheat-sheet 01
- 22. 22 @luisw19 22 Browser GraphQL Client Simple GraphQL Query Demo (I) - Mock { query } GraphQL Server: Apollo/Express GraphQL Service Graphiql GraphQL Schema GraphQL Endpoint http://.../graphiql Query Operation {JSON} [HTTP/POST] {JSON} { data } https://github.com/luisw19/graphql-samples/tree/master/graphql- countries-part1 02 Apollo Express: https://github.com/apollographql/apollo-server
- 23. 23 @luisw19 23 Browser GraphQL Client Simple GraphQL Query Demo (II) – REST Backend { query } GraphQL Server: Apollo/Express GraphQL Service Graphiql GraphQL Schema GraphQL Endpoint Query Operation {JSON} [HTTP/POST] {JSON} { data } https://github.com/luisw19/graphql-samples/tree/master/graphql- countries-part2 [HTTP/GET] https://restcountries.eu/rest/v2/{resource} {JSON} REST COUNTRIES 02
- 24. 24 @luisw19 24 Docker Container Browser GraphQL Client Simple GraphQL Query Demo (III) - Mutation { query } GraphQL Server: Apollo/Express GraphQL Service Graphiql GraphQL Schema GraphQL Endpoint Query Operation {JSON} [HTTP/POST] {JSON} { data } https://github.com/luisw19/graphql-samples/tree/master/graphql- countries-part3 [HTTP/GET] https://restcountries.eu/rest/v2/{resource} {JSON} REST COUNTRIES [HTTP/POST] http://localhost:8000/{resource} {JSON} RequestBIN 02
- 25. 25 @luisw19 25 Browser GraphQL Client Simple GraphQL Query Demo (IV) – API Composition { query } GraphQL Server: Apollo/Express GraphQL Service Graphiql GraphQL Schema GraphQL Endpoint Query Operation {JSON} [HTTP/POST] {JSON} { data } Not merged yet… (soon) [HTTP/GET] https://restcountries.eu/rest/v2/{resource} {JSON} REST COUNTRIES [HTTP/POST] https://www.google.co.uk/search?q={search} {JSON} 02
- 26. 26 @luisw19 26 GraphQL vs REST GraphQL REST (++) Usage: Best usage experience for developers (Graphiql is brilliant!) (~) API-first design: Tooling evolving (build a service to mock). (~) Usage: depends on the quality of API definition and documentation (+) API-first design: good tools available (e.g. Apiary, Swagger Hub). Developer Experience (design and consume APIs) Design Try Build API Composition (query data from multiple sources) API (++) Perfectly suited for API composition. Each field can be fetch (in parallel) from any source in a single query. (--) The nature of REST makes it difficult to model resources that combine data structures from multiple sources. HATEOAS results in chattiness. (++) Brilliant (+) Good (~) Neutral (it depends) (-) Not very good (--) It sucks! API Gateway (API routing, security, policies) (-) Existing Gateways have rich support for REST, not yet GraphQL - but could be used. Alternative is to use a GraphQL Service as API Gateway. (++) API Gateways take away from REST endpoints common tasks (e.g. OAuth, API keys, throttling, security). API API Gateway API API 03
- 27. 27 @luisw19 27 GraphQL vs REST GraphQL REST (++) Brilliant (+) Good (~) Neutral (it depends) (-) Not very good (--) It sucks! Caching (--) Network: unsuitable as there is a common URL for all operations. (+) Service: possible based on Object Type (even fields) and in mem cache like REDIS. (++) Network: Caching is easy as each resource is a unique URI. Common tools can be used (e.g. CDNs). (+) Service: It’s equally possible at service Level. Network Caching App Cache Client Back End Resource (-) Standards like OAuth, OpenID can be used however because all ops can be accessed by single URI, custom authorisation is typically required. (++) Major standards (OAuth 2, OpenId) supported by API Gateways and frameworks. Authentication / Authorization Client Resource Authorisation Server 1 2 Versioning (++) Best practices are clear. Versioning should be avoided and tools are provided (e.g. deprecation of fields) for continuous evolution. (-) Best practice less clear, in practice URI based versioning very popular although not encouraged. 03
- 28. 28 @luisw19 28 GraphQL vs REST (completely subjective!) GraphQL REST +++++++ (7) ~ (1) ---- (4) ++++++++ (8) ~~ (2) --- (3) à But it will only improve! 03
- 29. 29 @luisw1929© 2018 Capgemini. All rights reserved.29 1 3 Conclusions Still early days but GraphQL has huge potential GraphQL takes away many of the headaches of dealing with REST from a client side -specially around complex queries (against multiple sources). However tooling specially around API Design and API Gateways is still evolving. So bear this in mind when considering GraphQL. 2 GraphQL and REST can work nicely together There are thousands of REST APIs (external and internal) and REST still is a viable and popular option. Instead of boiling the ocean, as Roy said, GraphQL is not necessarily a replacement for REST. As shown in this presentation both can be complementary and work together nicely. There is no silver bullets –do your own research There is tons of information available in the GraphQL Communities page. Explore it, learn about it and adopt it based on your own criteria and requirements. And hope this presentation helps in the process! 04
- 30. 30 @luisw19 30 Resources • GraphQL as an alternative approach to Rest recording at Devoxx’18 London https://www.youtube.com/watch?v=hJOOdCPlXbU • Github repository with the GraphQL tutorials https://github.com/luisw19/graphql-samples • Related articles: • GraphQL with Oracle Database and node-oracledb by Christopher Jones https://blogs.oracle.com/opal/demo%3a-graphql-with-node-oracledb • GraphQL+OracleDB by Steven B https://github.com/cloudsolutionhubs/oracledb-graphql-demo
- 31. 31 @luisw19 With more than 190,000 people, Capgemini is present in over 40 countries and celebrates its 50th Anniversary year in 2018. A global leader in consulting, technology and outsourcing services, the Group reported 2016 global revenues of EUR 12.5 billion. Together with its clients, Capgemini creates and delivers business, technology and digital solutions that fit their needs, enabling them to achieve innovation and competitiveness. A deeply multicultural organization, Capgemini has developed its own way of working, the Collaborative Business Experience™, and draws on Rightshore®, its worldwide delivery model. About Capgemini Learn more about us at www.capgemini.com This message contains information that may be privileged or confidential and is the property of the Capgemini Group. Copyright © 2018 Capgemini. All rights reserved. Rightshore® is a trademark belonging to Capgemini. This message is intended only for the person to whom it is addressed. If you are not the intended recipient, you are not authorized to read, print, retain, copy, disseminate, distribute, or use this message or any part thereof. If you receive this message in error, please notify the sender immediately and delete all copies of this message.