Slides from my talk at JS Channel

1. Demand Driven Applications
with
Vinci Rufus
@areai51
GraphQL

2. 3 Eras of Web based Applications
Monolithic
Server Side
Applications
De-Coupled
Headless
Applications
REST
Demand Driven
Applications
Demand Driven

3. C O P Y R I G H T S A P I E N T R A Z O R F I S H | C O N F I D E N T I A L 3
What’s the problem with REST

4. C O P Y R I G H T S A P I E N T R A Z O R F I S H | C O N F I D E N T I A L 4
Over Fetching & Under Fetching
The Power of Positive Thinking
Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Curabitur porttitor, purus quis
ultricies rutrum, erat nisl facilisis erat, in
maximus massa libero nec ipsum. Cras eget
leo sed est scelerisque sodales vel eget justo.
Vestibulum ante ipsum primis in faucibus orci
luctus et ultrices posuere cubilia Curae;
Aenean feugiat ante id bibendum imperdiet.
Nunc gravida mollis est, nec tincidunt diam
sodales ultricies. Etiam consequat lobortis
tellus, eu pretium dui lacinia ac. Phasellus
faucibus eros in luctus tempor. Vestibulum vel
ultrices orci. Nullam in augue libero. Nam
dapibus velit nec pellentesque porttitor.
Author - John Doe
5 Comments - View All

5. C O P Y R I G H T S A P I E N T R A Z O R F I S H | C O N F I D E N T I A L 5
Agree on JSON Contracts
Frontend Developer Backend Developer

6. API Documentation

7. C O P Y R I G H T S A P I E N T R A Z O R F I S H | C O N F I D E N T I A L 7
API Rigidity and Bloat

8. C O P Y R I G H T S A P I E N T R A Z O R F I S H | C O N F I D E N T I A L 8
API versioning
API - V1 API – V2 API – V3

9. Demand Driven Architecture

10. David Nolen
Kovas Boguta
WTH is Demand Driven Architecture?
• Driven from the client side app. Clients demand their data
needs.
• Server knows how to parse this demand structure
recursively, fetching all data that is needed.
• Query up. Render down,

11. FALCOR GraphQL
By
Netflix
2011
By
Facebook
2012

12. GraphQL is a query language for your API, and a
server-side runtime for executing queries by using
a type system you define for your data.

13. "The biggest mistake we made as a company was
betting too much on HTML5 instead of native... We
burnt two years.”
Tech Crunch- Disrupt (2012)

14. Evolution
2012
Internal
Development at
Facebook
2015
Open sourced
2016
Deemed
Production
Ready

15. Popular brands using Graphql

16. GraphQL Specifications
facebook.github.io/graphql

17. Server Implementations
No Language Server Libraries
1 JavaScript GraphQL.js, express-graphql, Apollo Server
2 Ruby Graphql-ruby
3 Python Graphene
4 Scala Sangria
5 Java Graphql-java
6 Clojure Graphql-clj
7 Go Lang Graphql-gp , graphql-relay-go
8 PHP Graphql-php , graphql-relay-php
9 C# / .Net Graphql-dotnet, graphql-net
10 Elixir Absinthe, graphql-elixir

18. GraphQL is NOT
! a Graph database
! a client side state management library
! Limited to React, Relay or Web
! Limited to JavaScript & Node
Not related to Facebook’s Social Graph

19. GraphQL Clients
Relay
lokka
React | Angular | iOS | Android | VanillaJS

20. REST
GraphQL
src: http://slides.com/gerardsans/ngeurope-ng2-loves-graphql#/3/5
REST
GraphQL

21. GraphQL Topology
GraphQL
PIM OMS Inventory RDBMS
Microservices
Gql Query
Gql Query

22. Authentication & Authorization
HTTP
Authentication
GraphQL
Business Logic
Authorization
REST
Data Layer
src: https://www.youtube.com/watch?v=6GyubnT38EQ

23. GraphQL Query
• Single Endpoint.
• No more crazy parsing logic for JSON data
• No Need for Versioning

24. 3 Types of Operations
•Query
Query data by passing an empty object of fields you want data for.
•Mutations
Cary out write operations on the dataset.
•Subscriptions
Real-time (read-only) updates of data.

25. GraphiQL

26. demo:
bit.ly/git-stars
code:
bit.ly/git-stars-code

27. Upcoming Features

28. @defer

29. Live Queries

30. • Vinci Rufus
• @areai51