Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Why GraphQL: A React Developer's Perspective
Search
Praveen Durairaj
May 19, 2018
Programming
1
110
Why GraphQL: A React Developer's Perspective
React Bangalore Meetup May 2018
Praveen Durairaj
May 19, 2018
Tweet
Share
More Decks by Praveen Durairaj
See All by Praveen Durairaj
Intro to GraphQL
praveenweb
0
22
Other Decks in Programming
See All in Programming
Go1.25からのGOMAXPROCS
kuro_kurorrr
1
720
ドメインモデリングにおける抽象の役割、tagless-finalによるDSL構築、そして型安全な最適化
knih
11
1.9k
機械学習って何? 5分で解説頑張ってみる
kuroneko2828
0
210
ASP.NETアプリケーションのモダナイズ インフラ編
tomokusaba
1
280
LINEヤフー データグループ紹介
lycorp_recruit_jp
0
690
CSC307 Lecture 17
javiergs
PRO
0
120
GoのWebAssembly活用パターン紹介
syumai
3
10k
GoのGenericsによるslice操作との付き合い方
syumai
2
620
統一感のある Go コードを生成 AI の力で手にいれる
otakakot
0
3k
Spring gRPC で始める gRPC 入門 / Introduction to gRPC with Spring gRPC
mackey0225
2
510
実はすごいスピードで進化しているCSS
hayato_yokoyama
0
120
F#で自在につくる静的ブログサイト - 関数型まつり2025
pizzacat83
0
300
Featured
See All Featured
It's Worth the Effort
3n
184
28k
Git: the NoSQL Database
bkeepers
PRO
430
65k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
Facilitating Awesome Meetings
lara
54
6.4k
Bash Introduction
62gerente
614
210k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Side Projects
sachag
455
42k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
Making the Leap to Tech Lead
cromwellryan
134
9.3k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Transcript
Why GraphQL: A React Developer’s Perspective
Hello! I am Praveen Durairaj Application Engineer - Hasura twitter.com/praveenweb
github.com/praveenweb 2
What is GraphQL • Query Language • Declarative, Type safe
• Server-side runtime • Better REST ? 3
• Type-safe schema with introspection • Endpoint is the same
- /graphql • Always fetch what you want • Versioning made easy Let that sink in! 4
const typeDefs = ` type CityWeather { temp: String min_temp:
String max_temp: String city_name: String! applicable_date: String! } type Query { cityWeather(city_name: String! applicable_date: String): CityWeather } `; 5
• Type-safe schema with introspection • Endpoint is the same
- /graphql • Always fetch what you want • Versioning made easy Let that sink in! 6
7
• Type-safe schema with introspection • Endpoint is the same
- /graphql • Always fetch what you want • Versioning made easy Let that sink in! 8
• Type-safe schema with introspection • Endpoint is the same
- /graphql • Always fetch what you want • Versioning made easy Let that sink in! 9
10
11 How is the Developer Workflow?
API Explorer Query Validation Caching Developer Tooling Autocomplete Mocking Predictable
12
API Explorer GraphiQL Know what you can request Code intelligence
13
Validation & Autocomplete Autocomplete during development Query validation 14
15 DEMO
Caching - Leverage unique identifiers for client side caching -
Directives with Apollo Server 16
Response Caching 17
Schema Stitching - Merge multiple graphql schemas into a single
endpoint - Extend existing schema 18
19
20 - Person Schema - Extend it with weather -
Merge and query
Downsides? - Exposing db / api schema to client -
Managing schema - Moving the load server side 21
22 Thanks! Any questions? You can find me at @praveenweb
&
[email protected]