Give REST a rest, use GraphQL for your next Ruby API - Jakarta RubyConf Indonesia 2017

GraphQL is a query language for APIs. While typical REST APIs require loading from multiple URLs, GraphQL APIs get all the data your app needs in a single request which makes Apps using GraphQL can be quick and stable

Transcript

1. GIVE REST A REST, GRAPHQL FOR YOUR NEXT RUBY API GIVE REST A REST, GRAPHQL FOR YOUR NEXT RUBY API
2. { name: 'Shaiju E', email: 'eshaiju@gmail.com', tech_blog: 'tech.eshaiju.in', github: 'eshaiju', twitter: 'eshaiju', facebook: 'eshaiju', linkedin: 'eshaiju' }
3. God’s Own Country!​
8. Technology stack - Rails + GraphQL+ ReactJS +Apollo
9. Technology stack - Rails +Android + iOS+ GraphQL Employee performance management product
10. Kerala Ruby Users Group
12. A simple UI component
13. A simple UI component
14. Comment Post User What kind of data is needed? ​
15. REST API
16. GET /comments/post_id=1 GET /comments/post_id=2 GET /comments/post_id=5 GET /posts GET /users/1 GET /users/2 GET /users/5 Too many round trips! Client Server
17. Still waiting..............
18. "post": { "id": 1, "title": "A GraphQL Server Implementation", "url": "http://tech.eshaiju.in/blog/2017/05/ "body": null, "votes": 100, "published_at": "11 Jul 2017 00 00 AM", "auther_name": "Shaiju E", "created_at": "2017-07-11 12:57:20 UTC", "updated_at": "2017-07-11 13:15:50 UTC" } "post": { "id": 1, "title": "A GraphQL Server Implementation", "url": "http://tech.eshaiju.in/blog/2017/05/06/a-graphql-server-implementation-r } What I get What I care about Over-fetching of data
19. Custom Endpoints ​
20. /posts_with_everything_i_need
21. /posts_with_everything_i_need /posts_with_everything_i_need_with_author_v2 /posts_with_everything_i_need_with_author_and_images posts_with_everything_i_need_with_author_and_images_for_mobil ghtly_coupled_endpoint_for_a_specific_client_bla_bla_bla_bla osts_with_everything_i_need_with_author_and_images_for_tab_v2
23. Client Server Updates a view Update endpoints Creates a new view New view version Create new endpoint
24. Client Server Hey, give me the resource with id = 1 OK, here’s the resource with id = 1 In REST System
25. Client Server Here is everything you can do! (capabilities) I need that exact data shape (requirements) GraphQL OK, here’s the data with same shape
26. GraphQL
27. What GraphQL is NOT
28. What GraphQL is NOT It's not about graph databases and graph search It's not about data storage it's not language specific it's not a library
29. What GraphQL IS
30. What GraphQL IS GraphQL is a query language for APIs is a new API standard that provides an alternative to REST GraphQL Declarative data fetching - The client specifies what data shapes, and the server returns that data in exact same shape. GraphQL server only exposes a single endpoint and responds with precisely the data a client asked for
31. graphql-ruby
32. query { post(id: 1){ title url published_at } } Query
33. query { post(id: 1){ title url published_at } } { "data": { "post": { "title": "A GraphQL Server Implementa "url": "http://tech.eshaiju.in/blog/2 "published_at": "2017-07-11 00:00:00 } } }
34. query { users{ id name } post(id: 1){ title url published_at author{ name } comments{ body author{ name } } } } { "data": { "users": [ { "id": 1, "name": "Shaiju E" }, { "id": 2, "name": "Awin" } ], "post": { "title": "A GraphQL Server Implementation", "url": "http://tech.eshaiju.in/blog/2017/05/06/a-graphql-se "published_at": "11 Jul 2017 00 00 AM", "author": { "name": "Shaiju E" }, "comments": [ { "body": "Good post", "author": { "name": "Awin" } } ] } } }
35. Mutations are the equivalent to the POST, PUT, PATCH and DELETE in HTTP/REST. mutation addComment{ addComment(input: { comment: "New comment", post_id: 1, author_id: 1}) { post{ id title comments{ body user{ name } } } } } Mutations are used to change your data Mutation
37. Type System
38. query { users{ id name } post(id: 1){ title url published_at author{ name } comments{ body author{ name } } } }
39. QueryType = GraphQL::ObjectType.define do name "Query" description "The query root of this schema" field :post do type PostType description "Find a Post by ID" argument :id, !types.ID resolve ->(obj, args, ctx) { Post.find_by_id(args[:id]) } end field :posts, types[PostType] do description "Return all posts" resolve ->(obj, args, ctx) { Post.all } end field :users, types[UserType] do description "Fetch all users" resolve ->(obj, args, ctx) { User.all } end end
40. PostType = GraphQL::ObjectType.define do name "Post" description "Post and details" field :id, types.Int field :title, types.String do resolve -> (post, args, ctx) { post.title } end field :body, types.String field :url, types.String field :votes, types.Int field :published_at, types.String do resolve -> (post, args, ctx) { post.published_at.strftime('%d %b %Y %H %M %p') } deprecation_reason 'This field is deprecated' end field :comments, types[CommentType] field :author, UserType end
41. CommentType = GraphQL::ObjectType.define do name "Comment" field :id, types.Int field :body, types.String field :author, UserType field :post, PostType end UserType = GraphQL::ObjectType.define do name "User" field :id, types.Int field :name, types.String field :joined_at end
42. HackerNewsSchema = GraphQL::Schema.define do query QueryType mutation MutationType end Schema
43. class GraphqlController < ApplicationController def execute variables = ensure_hash(params[:variables]) query = params[:query] context = { # Query context goes here, for example: current_user: current_user, } result = HackerNewsSchema.execute( query, variables: variables, context: context ) render json: result end end
44. POST /graphql curl -XPOST -d 'query= { post(id: 1) { title url } }' http://localhost:3000/graphql
45. API Documentation
48. Lessons from Production
49. 1 - Name your queries
50. query PostQuery { post(id: 1){ title comments{ comment user { id name } } } } Name your queries
51. 2 - Know about N+1 Queries early
52. { posts{ title url comments{ body author { name } } } } Know about N+1 Queries early
53. Solution: Batching + Caching
54. 3 - Aware of Security issues
55. malicious query query { posts{ title url author{ name comments{ author{ comments{ author { name comments{ author{ name comments{ author{ name comments{ body } } } } } } } } } } } }
56. Timeouts Solutions HackerNewsSchema.middleware << GraphQL::Schema::TimeoutMiddleware.new(max_seconds: 10) do |err, Rails.logger.info("GraphQL Timeout: #{query.query_string}") end Query Depth & Query Complexity MySchema = GraphQL::Schema.define do # ... max_depth 12 max_complexity 100 end
57. 4 - Awesome GraphQL tools
58. GraphiQL Feen(Chrome Extension)
59. GraphQLDocs
60. Who’s using GraphQL?
61. Who’s using GraphQL?
62. Advantages Efficient Predictable Flexible Auto Documentation
63. References http://graphql-ruby.org/ http://tech.eshaiju.in/blog/categories/graphql/ https://www.howtographql.com/​ https://www.youtube.com/watch?v=eD7kLFGOgVw
64. Thank you!