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
GraphQL + Relay + Serverless
Search
텀블벅
November 10, 2017
Technology
2
360
GraphQL + Relay + Serverless
필요한 리소스만을 요청하고 사용하는 API 만들기
텀블벅
November 10, 2017
Tweet
Share
Other Decks in Technology
See All in Technology
チームメンバー迷わないIaC設計
hayama17
5
3.1k
バクラクにおける Document Understanding の挑戦:書類の「読取」から「意思決定」へ / document-understanding-in-bakuraku-2026
yuya4
0
160
Introduction to Bill One Development Engineer
sansan33
PRO
0
370
Sansan Engineering Unit 紹介資料
sansan33
PRO
1
4k
WBCの解説は生成AIにやらせよう - 生成AIで野球解説者AI Agentを実現する / Baseball Commentator AI Agent for Gemini
shinyorke
PRO
0
300
Claude Codeはレガシー移行でどこまで使えるのか?
ak2ie
1
1.1k
【SLO】"多様な期待値" と向き合ってみた
z63d
2
250
全自動で回せ!Claude Codeマーケットプレイス運用術
yukyu30
3
140
Secure Boot 2026 - Aggiornamento dei certificati UEFI e piano di adozione in azienda
memiug
0
120
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
14k
論文検索を日本語でできるアプリを作ってみた
sailen2
0
140
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
sansan33
PRO
0
3k
Featured
See All Featured
Designing Experiences People Love
moore
144
24k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
ryanjones
0
82
Build your cross-platform service in a week with App Engine
jlugia
234
18k
The SEO identity crisis: Don't let AI make you average
varn
0
400
GraphQLとの向き合い方2022年版
quramy
50
14k
Test your architecture with Archunit
thirion
1
2.2k
Bash Introduction
62gerente
615
210k
Writing Fast Ruby
sferik
630
62k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
0
160
The World Runs on Bad Software
bkeepers
PRO
72
12k
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
63
53k
Transcript
GraphQL + Relay + Serverless ߅ഋध @ థ࠶ߢ
థ࠶ߢ "#$%&'()*+,-./01234 56
ਃೠ ܻࣗझ݅ਸ ਃೞҊ ࢎਊೞח API ٜ݅ӝ I
߄ҳפ ߄ҳפীӟ࢚ಿ ࢸݺ оѺ ߓ࣠࠺ ߓ࣠ࣗ 25,000 12,000 2,500 2,500
࢚ಿ
߄ҳפ ߄ҳפীӟ࢚ಿ ࢸݺ оѺ ߓ࣠࠺ ߓ࣠ࣗ 25,000 12,000 2,500 2,500
࢚ಿ ProductList Cart ShippingAddress ProductData ProductData
ProductList Cart ProductData ProductData ShippingAddress /carts/1 /products/1 /products/2 /shippingAddresses/1
/carts/1? fields=products,coupons,shipping_addr esses&products[images, descriptions] /carts/1? fields=products,coupons,shipping_addr esses&products[images[high,low]]&prod ucts[descriptions[reviews, contents]]
/carts_with_products_shipping_address_coupons /carts_with_products_recommendations /carts_with_products_videos /carts_with_products_newsletter_signups /carts_with_products_for_mobile /carts_with_products_for_tablets
None
None
None
None
BFF (soundcloud) Backends for Frontends
None
GraphQL A Query Language for API
{ me { name company } }
{ me { name: "߅ഋध" company: "థ࠶ߢ" } }
{ me { name company hobby } }
{ me { name: "߅ഋध" company: "థ࠶ߢ" hobby: "୷ҳ" }
}
Query REST GET method
REST GET /me { name: "߅ഋध", company: "థ࠶ߢ", hobby: "୷ҳ",
favoriteColor: "ی࢝", country: "ೠҴ", conference: "playnode 2017", cloudProvider: "IBM", age: "?^^^^", address: "??????????", cardNumber: "@#$D@#$#$%#$FD@#$@#" }
GraphQL { user (id: "1") { name company } }
GraphQL { user { name: "chulsoo" company: "younghee co." }
}
ProductList Cart ProductData ProductData ShippingAddress /carts/1 /products/1 /products/2 /shippingAddresses/1 REST
ProductList Cart ProductData ProductData ShippingAddress { cart { products {
imageUrl description price shippingCost } shippingAddress } } POST /graphql GraphQL
None
None
None
None
Type System ⚙⚙⚙
Types type Query { cart: Cart } type Cart {
products: [Product]! shippingAddress: String! } type Product { imageUrl: String! description: String! price: Int! shippingCost: Int! } { cart { products { imageUrl description price shippingCost } shippingAddress } }
Types type Query { cart: Cart } type Cart {
products: [Product]! shippingAddress: String! } type Product { imageUrl: String! description: String! price: Int! shippingCost: Int! } { cart { products { imageUrl description price shippingCost } shippingAddress } }
Types type Query { cart: Cart } type Cart {
products: [Product]! shippingAddress: String! } type Product { imageUrl: String! description: String! price: Int! shippingCost: Int! } { cart { products { imageUrl description price shippingCost } shippingAddress } }
Types type Query { cart: Cart } type Cart {
products: [Product]! shippingAddress: String! } type Product { imageUrl: String! description: String! price: Int! shippingCost: Int! } { cart { products { imageUrl description price shippingCost } shippingAddress } }
Types type Query { cart: Cart } type Cart {
products: [Product]! shippingAddress: String! } type Product { imageUrl: String! description: String! price: Int! shippingCost: Int! } { cart { products { imageUrl description price shippingCost } shippingAddress } }
Mutation REST POST/PUT/PATCH/DELETE Method
Mutation mutation { createProduct( input: { description: "ݧ ৩" price:
50000 } ) } { product { Price } }
؊ب ݈Ҋ ؏ب ݈Ҋ ٯ ۄо ਗೞח ч݅ NO
࠺ऴ ֎ਕ ਃ ୭ࣗച R
None
None
Relay
Relay
Relay
Relay
Relay
Relay
Relay
id? GraphQL Relay
id? id GraphQL Relay
GraphQL Relay
GraphQL Relay
GraphQL Relay 1
GraphQL Relay 1 1
None
None
Server
Serverless
f(⚡) Functions ⚡⚡ ⚡⚡
Serverless = function-as-a-service?
Serverless Pattern / Architecture
ࢲߡ ҙܻ ݽٚѦ ۄ٘ীѱ ݐӝ ☁ /provisioning, OS patching/upgrading, scaling,
self-healing, … /
Pricing • IBM Cloud functions • 500ms प೯ • 512MB
@ 5,000,000 ਃ പࣻ • $14.45
Pricing • प೯ दр ⏰ • ݫݽܻ ࣗ࠺ • ਃ
പࣻ ⚡
“ࢲߡ” ೡ ݽٚѦ ۄ٘ীѱ ݐӝ ☁ /API Gateway, Message Queue,
Search, Analytics, Authentication, … /
“ࢲߡ”ٜਸ ೣࣻ۽ োѾೞ ⚡ ⚡ ⚡ ⚡ ⚡ ⚡
None
GraphQL API Gateway Cart Product Search Message Queue Object Storage
⚡ ⚡ ⚡ ⚡ ⚡ ⚡ ⚡ ⚡ ⚡ ⚡ Email Authentication
GraphQL + Relay + Serverless
tumblbug.workable.com ହઑੋ दب ӝࣿ ӝ߈ਸ ೣԋ ٜ݅ ࣗਝয ূפযܳ णפ.