DroidCon IT - GraphQL on the JVM and beyond

Slide 1

Slide 1 text

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

GraphQL on the JVM and beyond DroidCon IT webinars 2020 3

Slide 4

Slide 4 text

GraphQL on the JVM and beyond @martinbonnin 4

Slide 5

Slide 5 text

1. What is GraphQL 2. Consuming GraphQL in an Android App 3. What’s next 5 Agenda

Slide 6

Slide 6 text

Questions 6 https://app.sli.do/event/tp6pylrx https://wall.sli.do/event/tp6pylrx

Slide 7

Slide 7 text

The beginnings of GraphQL 7 ● 2012: Facebook

Slide 8

Slide 8 text

REST: GET /feed 8 { "feed": [ { "type": "post", "title": "My cat is so funny :-P", "text": "Pancake loves to lay in the sun!", "thumbnail": "/img/fe3c57178.jpg" }, { "type": "post", "title": "My first homemade bread!", "text": "Using only flour and water", "thumbnail": "/img/85511bbb2.jpg" }, { "type": "ad", "title": "50 bread recipes" } ] }

Slide 9

Slide 9 text

REST 9 GET /feed/desktop GET /feed/mobile GET /feed/tablet GET /feed/watch

Slide 10

Slide 10 text

GraphQL 10 ● Product oriented ● Exposes a Graph Feed Post Post Ad Title Text XL Thumbnail S Thumbnail

Slide 11

Slide 11 text

GraphQL 11 Feed Post Post Ad Title Text XL Thumbnail S Thumbnail ● Product oriented ● Exposes a Graph

Slide 12

Slide 12 text

GraphQL 12 Feed Post Post Ad Title Text XL Thumbnail S Thumbnail ● Product oriented ● Exposes a Graph

Slide 13

Slide 13 text

GraphQL 13 Feed Post Post Ad Title Text XL Thumbnail S Thumbnail ● Product oriented ● Exposes a Graph

Slide 14

Slide 14 text

Hello GraphQL 14 query { feed { post { title text thumbnail } } } { "feed": { "post": { "title": "My cat is so funny :-P", "text": "Pancake loves to lay in the sun", "thumbnail": "/img/fe3c57178.jpg" } } }

Slide 15

Slide 15 text

Principles 15 ● Client requests the data. ● Data is strongly typed. ● The api is introspectable.

Slide 16

Slide 16 text

GraphQL 16 ● 2012: Facebook ● 2015: Open Source release ● 2018: Linux Foundation ● https://github.com/graphql/graphql-spec

Slide 17

Slide 17 text

Type system 17

Slide 18

Slide 18 text

Type system 18 type User { login: String bio: String isBountyHunter: Boolean status: UserStatus issueComments: List } User Github ● Objects ● Scalars ○ Boolean ○ Int ○ Float ○ String ● Lists

Slide 19

Slide 19 text

Type system 19 type User { login: String bio: String isBountyHunter: Boolean status: UserStatus issueComments: List } User Github ● Objects ● Scalars ○ Boolean ○ Int ○ Float ○ String ● Lists

Slide 20

Slide 20 text

Type system 20 type User { login: String bio: String isBountyHunter: Boolean status: UserStatus issueComments: List } User Github ● Objects ● Scalars ○ Boolean ○ Int ○ Float ○ String ● Lists

Slide 21

Slide 21 text

Type system 21 type User { login: String bio: String isBountyHunter: Boolean status: UserStatus issueComments: List } User Github ● Objects ● Scalars ○ Boolean ○ Int ○ Float ○ String ● Lists

Slide 22

Slide 22 text

● Objects ● Scalars ○ Boolean ○ Int ○ Float ○ String ● Lists Type system 22 type User { login: String bio: String isBountyHunter: Boolean status: UserStatus issueComments: List } User Github

Slide 23

Slide 23 text

● Interfaces ● Enums ● Unions Type system 23 type User implements Node { id: ID! login: String bio: String [...] } User Github

Slide 24

Slide 24 text

Null safety ❗ 24 type User { login: String❗ bio: String isBountyHunter: Boolean❗ status: UserStatus issueComments: List❗ }

Slide 25

Slide 25 text

Let’s try it with GraphiQL 25 https://developer.github.com/v4/explorer/

Slide 26

Slide 26 text

Hello GraphQL 26 query GetViewer { viewer { login bio status { emoji message } } } { "data": { "viewer": { "login": "martinbonnin", "bio": "Lorem Ipsum", "status": { "emoji": ":smileyface:", "message": "Foo" } } } }

Slide 27

Slide 27 text

Passing parameters 27 query GetViewer { viewer { login bio avatarUrl(size: 500) status { emoji message } } }

Slide 28

Slide 28 text

Mutations 28 mutation { changeUserStatus(input: { emoji: ":recycle:" message: "Hello DroidCon!" }) { clientMutationId } }

Slide 29

Slide 29 text

Introspection 29

Slide 30

Slide 30 text

Schema 30 { "data" { "__schema": { "types": [ { "kind": "OBJECT", "name": "User", "description": "A user is an individual..", "fields": [...], "interfaces": [...], }, [...] ] } }

Slide 31

Slide 31 text

1. What is GraphQL 2. Consuming GraphQL in an Android app 3. What’s next 31

Slide 32

Slide 32 text

Apollo-Android 32 ● https://github.com/apollographql/apollo-android ● Doesn’t require Android! ● Java & Kotlin codegen. ● Strong typing. ● Reﬂection-free json parsing. ● HTTP & Normalized cache. ● RxJava & Coroutines support.

Slide 33

Slide 33 text

Automatic code generation 33 query.graphql Schema.json Kotlin Models

Slide 34

Slide 34 text

Demo 34 https://github.com/martinbonnin/DroidConITDemo/

Slide 35

Slide 35 text

A few tips 35

Slide 36

Slide 36 text

Authentication 36 ● We use a separate Oauth endpoint. ● Leverage the “Authorization” header. ● Can be done with a OkHttp interceptor.

Slide 37

Slide 37 text

Persisted queries 37 query { viewer { login bio status { emoji message } } } “OperationId”: viewerQuery

Slide 38

Slide 38 text

Versioning 38 ● Versioning is ﬂuid. ● Easy to add new ﬁelds, hard to remove. ● Do not modify types. ● Monitor your backend.

Slide 39

Slide 39 text

Use deprecation 39 query { pinnedRepositories { nodes { id } } } /** * A list of repositories this user has pinned to their profile */ @Deprecated(message = "pinnedRepositories will be removed Use ProfileOwner.pinnedItems instead. Removal on 2019-10-01 UTC.") val pinnedRepositories: PinnedRepositories

Slide 40

Slide 40 text

1. What is GraphQL 2. Consuming GraphQL in an Android app 3. What’s next 40

Slide 41

Slide 41 text

Apollo 2.0 41 ● Released end of April ● Multiplatform ○ Codegen ○ Parsing

Slide 42

Slide 42 text

What’s next 42 ● Multiplatform runtime ● Modularized network APIs ● Modularized cache APIs

Slide 43

Slide 43 text

Thanks ! @martinbonnin 43

Slide 44

Slide 44 text

Questions 44 https://app.sli.do/event/tp6pylrx https://wall.sli.do/event/tp6pylrx

Slide 45

Slide 45 text

No content

Slide 46

Slide 46 text

Slide 47

Slide 47 text

● HTTP cache ● Normalized cache ○ In Memory ○ SQLLite Cache 47

Slide 48

Slide 48 text

runBlocking { client.subscribe(UserSubscription()) .toFlow() .collect { // do something with data } } Subscriptions 48