GraphQL

1. GraphQL Stefan Kanev http://skanev.com/ @skanev Slovenia Ruby User Group 28 March 2018 Ljubljana Why is it exciting?
2. Hi, I’m Stefan
3. skanev skanev skanev.com about.me/skanev
4. Chief Technical Officer @
6. Despite the management title, I still tend to think of myself as a programmer
8. This should be part talk, part Q&A
9. 1 2 3 4 Walkthrough Demonstration Benefits React and Relay
10. 1 Walkthrough
11. It’s not a technology It’s a standard
12. queries vs. mutations “gets” data changes stuff
13. queries vs. mutations “gets” data changes stuff
14. Queries data on the server is represented as a graph 
 the client specifies which part of the graph to fetch 
 server returns only those parts 
 the input is in a special language 
 the output is in JSON
17. query { hero { name friends { name } } } Query { "data": { "hero": { "name": "R2-D2", "friends": [ { "name": "Luke Skywalker" }, { "name": "Han Solo" }, { "name": "Leia Organa" } ] } } } Response
18. Query query { hero { name appearsIn friends { name appearsIn } } } Response { "data": { "hero": { "name": "R2-D2", "appearsIn": ["NEWHOPE", "EMPIRE", "JEDI"], "friends": [ { "name": "Luke Skywalker", "appearsIn": ["NEWHOPE", "EMPIRE", "JEDI"] }, { "name": "Han Solo", "appearsIn": ["NEWHOPE", "EMPIRE", "JEDI"] }, { "name": "Leia Organa", "appearsIn": ["NEWHOPE", "EMPIRE", "JEDI"] } ] } } }
19. Schema the graph is composed of objects 
 each object is of a specific type 
 each type defines a number of fields 
 each field has a type 
 there is a form of polymorphism
20. type Character { name: String! friends: [Character]! appearsIn: [Episode]! } type Character { name: String! friends: [Character!]! appearsIn: [Episode!]! } By the way, this… …is better in a different way: Anybody see the difference?
21. queries vs. mutations “gets” data changes stuff
22. Mutations each mutation is a separate endpoint 
 it’s RPC-like (conceptually similar to REST mutations) 
 it still goes through the GraphQL language 
 we’ll see an example later
23. 2 Demonstration
24. 3 Benefits
25. Caveat emptor It might be a better fit for when you control the client, as opposed to letting anybody create a client 
 The complexity on the backend is a magnitude bigger
26. Self-documenting
27. Decouples clients from backend once the graph is large enough, clients won’t need to request (as many) endpoints for reading 
 it’s closer to “write once”
28. Versionless evolution Versioning APIs is a bitch 
 You can get away with not doing it to a large extent 
 (example)
29. Traffic optimisation You get only what you asked for 
 You can get multiple things with a single request
30. Structure It provides a lot of structure to build 3rd party tools on
 (especially in comparison to REST) 
 GraphiQL is a good example 
 Apollo Engine is another one 
 Relay is the most interesting example
31. 4 React and Relay
34. ?