Tweet
Tweet

Slide 1

Slide 1 text

shahidh_k Build your backend with GraphQL and Serverless in Redux style React India 2019 1

Slide 2

Slide 2 text

shahidh_k 2 I’m Shahidh

Slide 3

Slide 3 text

shahidh_k Redux is awesome! 3

Slide 4

Slide 4 text

shahidh_k 4 UI - 1 Dispatch Reducer State update UI - 2 UI - 3 State on the UI

Slide 5

Slide 5 text

shahidh_k Serverless 5

Slide 6

Slide 6 text

shahidh_k Serverless $ cat index.js exports.function = (req, res) => { res.json({"message": "Hello World"}); } 6 $ serverless functions deploy hello_world --trigger-http https://serverless.functions.net/hello_world $ curl https://serverless.functions.net/hello_world {"message": "Hello World"}

Slide 7

Slide 7 text

shahidh_k GraphQL 7

Slide 8

Slide 8 text

shahidh_k REST vs GraphQL Product Brand Category GET PUT POST PATCH DELETE GET PUT POST PATCH DELETE GET PUT POST PATCH DELETE ProductWithBrand 8

Slide 9

Slide 9 text

shahidh_k 9 UI - 1 GraphQL Mutation Serverless Function GraphQL Subscription UI - 2 UI - 3 State on the UI State on the backend

Slide 10

Slide 10 text

shahidh_k Demo App: Sanitize Text / Filter bad words 10

Slide 11

Slide 11 text

shahidh_k 11 Type bad content GraphQL Mutation Serverless Function GraphQL Subscription Show clean content State on the UI State on the backend *BREAKING NEWS: Speaker uses own project!

Slide 12

Slide 12 text

shahidh_k Demo Time 12

Slide 13

Slide 13 text

shahidh_k Cool! Something complex? 13

Slide 14

Slide 14 text

shahidh_k Food ordering app 14 https://serverless-demo.hasura.app/

Slide 15

Slide 15 text

shahidh_k Order state machine is_validated | false is_paid | false is_approved | false is_agent_assigned | false is_validated | true is_paid | false is_approved | false is_agent_assigned | false is_validated | true is_paid | true is_approved | false is_agent_assigned | false is_validated | true is_paid | true is_approved | true is_agent_assigned | false is_validated | true is_paid | true is_approved | true is_agent_assigned | true Checks payment Validate order Restaurant approval Agent assignment 15

Slide 16

Slide 16 text

shahidh_k 16 Thanks github.com/shahidhk/dangerous-tweets