GraphQL
Martin Pham - CTO Fornace Srl
🤩
Real-time programming
A loooong
story
between
client and
server
Who works on server-side applications? How
many Server APIs you've created until now 🤩?
Have you ever written API documentations? and
update it frequently?
And client-side developers, how many times you
worked with Remote APIs? Tell me how you were
working with undocumented APIs 😱
And how you handle the slow connection / or
even offline?
A E
B
C
D
API
CHALLENGES
D.
User doesn't want to wait
1 second to see the
update. He wants now,
NOW, NAOHHH 😟
Instant response
E.
Easy to understand, easy to
consume. Develop with smiles,
not with tears.
Developer friendly
B.
User would like to see all notes
he created on cloud, even when
he's on an airplane. He also
want to add some notes and
sync it with cloud later.
Connectivity
A.
A User has relationship with his
preferred Store, which has
relationship with its City, which
has relationship with other
Users who live in this City,
which ... blabla...
Data relationships
C.
We have a LiveGame today, how we could adjust
our system to fit 100.000 concurrent users?
Scalable
A E
B
C
D
REQUIREMENTS
D.
REALTIME
COLLABORATIONS
Instant response
E.
IMPLEMENTATIONS &
DOCUMENTATIONS
Developer friendly
B.
OFFLINE SUPPORT,
WITH RE-SYNC
ABILITY
Connectivity
A.
FLEXIBLE
RELATIONSHIP
QUERY
Data relationships
C.
FLEXIBLE INFRASTRUCTURES
Scalable
WHAT WE ARE DOING?
REST
REPRESENTATIONAL STATE TRANSFER
Using API endpoints, each endpoint serves
different purpose.
SSE
SERVER-SENT EVENTS
Client keeps a long request to server, and
check every time server issues messages.
REST & SSE
-F*cking simple 😎.
-Hell of 1000 endpoints.
-Missing or Not up-to-date
documentations.
-SSE lacking support,
polyfills are very bad.
A E
B
C
D
SO?
D.
REALTIME
COLLABORATIONS
Instant response
E.
IMPLEMENTATIONS &
DOCUMENTATIONS
Developer friendly
B.
OFFLINE SUPPORT,
WITH RE-SYNC
ABILITY
Connectivity
A.
FLEXIBLE
RELATIONSHIP
QUERY
Data relationships
C.
FLEXIBLE INFRASTRUCTURES
Scalable
NOT SUPPORTED
IT HURTS
NOT STABLE
WE'RE ALL LAZY
SPAGHETTI CODE
We need
something
Facebook
We were having the same problems.
Then some lazy developers created GraphQL
for fun, and now it's serving 2.7 billion people.
Wanna try?
WHERE PEOPLE WASTE THEIR TIME
GraphQL
-Don't be fool by QL - query language
-Designed for API
-Query, mutation and realtime subscribe
-Self documented
-Don't worry, much more simple 🥰
Definition
-GraphQL Schema
-Ball object has x, y, z and size
-Query balls will return list of Ball
-Query addBall with ballData (type Ball) as
param, will return Boolean
Definition
-Easy to learn, easy to work.
-Everything has Type: Enum, String, Int,
Object,...
-Built-in Type validation.
-Mark deprecations easily.
-Provide directives for dynamic queries.
-From Schema to Code without pain.
Query &
Mutate data
-What you ask is What you get
-What you design is What you document
Subscription
- Realtime updates made simple
Resolver
- Define handler for every node of query
Apollo
GraphQL
Even easier for GraphQL works
A E
B
C
D
SO?
D.
REALTIME
COLLABORATIONS
Instant response
E.
IMPLEMENTATIONS &
DOCUMENTATIONS
Developer friendly
B.
OFFLINE SUPPORT,
WITH RE-SYNC
ABILITY
Connectivity
A.
FLEXIBLE
RELATIONSHIP
QUERY
Data relationships
C.
FLEXIBLE INFRASTRUCTURES
Scalable
OF COURSE!
YEAH!
EASY
SURE!
YOU WILL LOVE IT
DevTools
-Interactive playground to test GraphQL queries
-Apollo server & client libraries
-React friendly
-Native support for all client platforms
-Huge community support
Hooks supported!
Let's get our hands dirty
We create a React application, let users
play with balls. All ball data will be
saved on server.
(not wet)
All balls are provided from Pornhub
Gaio Giulio Cesare
GraphQL helped me to dominate
Roman politics, to become one of the
greatest military minds in history, and
to sleep with Cleopatra 😻
FULL STACK DEVELOPER
Thank you!

Introduction to GraphQL for beginners

  • 1.
    GraphQL Martin Pham -CTO Fornace Srl 🤩 Real-time programming
  • 2.
    A loooong story between client and server Whoworks on server-side applications? How many Server APIs you've created until now 🤩? Have you ever written API documentations? and update it frequently? And client-side developers, how many times you worked with Remote APIs? Tell me how you were working with undocumented APIs 😱 And how you handle the slow connection / or even offline?
  • 3.
    A E B C D API CHALLENGES D. User doesn'twant to wait 1 second to see the update. He wants now, NOW, NAOHHH 😟 Instant response E. Easy to understand, easy to consume. Develop with smiles, not with tears. Developer friendly B. User would like to see all notes he created on cloud, even when he's on an airplane. He also want to add some notes and sync it with cloud later. Connectivity A. A User has relationship with his preferred Store, which has relationship with its City, which has relationship with other Users who live in this City, which ... blabla... Data relationships C. We have a LiveGame today, how we could adjust our system to fit 100.000 concurrent users? Scalable
  • 4.
    A E B C D REQUIREMENTS D. REALTIME COLLABORATIONS Instant response E. IMPLEMENTATIONS& DOCUMENTATIONS Developer friendly B. OFFLINE SUPPORT, WITH RE-SYNC ABILITY Connectivity A. FLEXIBLE RELATIONSHIP QUERY Data relationships C. FLEXIBLE INFRASTRUCTURES Scalable
  • 5.
    WHAT WE AREDOING? REST REPRESENTATIONAL STATE TRANSFER Using API endpoints, each endpoint serves different purpose. SSE SERVER-SENT EVENTS Client keeps a long request to server, and check every time server issues messages.
  • 6.
    REST & SSE -F*ckingsimple 😎. -Hell of 1000 endpoints. -Missing or Not up-to-date documentations. -SSE lacking support, polyfills are very bad.
  • 7.
    A E B C D SO? D. REALTIME COLLABORATIONS Instant response E. IMPLEMENTATIONS& DOCUMENTATIONS Developer friendly B. OFFLINE SUPPORT, WITH RE-SYNC ABILITY Connectivity A. FLEXIBLE RELATIONSHIP QUERY Data relationships C. FLEXIBLE INFRASTRUCTURES Scalable NOT SUPPORTED IT HURTS NOT STABLE WE'RE ALL LAZY SPAGHETTI CODE
  • 8.
  • 9.
    Facebook We were havingthe same problems. Then some lazy developers created GraphQL for fun, and now it's serving 2.7 billion people. Wanna try? WHERE PEOPLE WASTE THEIR TIME
  • 10.
    GraphQL -Don't be foolby QL - query language -Designed for API -Query, mutation and realtime subscribe -Self documented -Don't worry, much more simple 🥰
  • 11.
    Definition -GraphQL Schema -Ball objecthas x, y, z and size -Query balls will return list of Ball -Query addBall with ballData (type Ball) as param, will return Boolean
  • 12.
    Definition -Easy to learn,easy to work. -Everything has Type: Enum, String, Int, Object,... -Built-in Type validation. -Mark deprecations easily. -Provide directives for dynamic queries. -From Schema to Code without pain.
  • 13.
    Query & Mutate data -Whatyou ask is What you get -What you design is What you document
  • 14.
  • 15.
    Resolver - Define handlerfor every node of query
  • 16.
  • 17.
    A E B C D SO? D. REALTIME COLLABORATIONS Instant response E. IMPLEMENTATIONS& DOCUMENTATIONS Developer friendly B. OFFLINE SUPPORT, WITH RE-SYNC ABILITY Connectivity A. FLEXIBLE RELATIONSHIP QUERY Data relationships C. FLEXIBLE INFRASTRUCTURES Scalable OF COURSE! YEAH! EASY SURE! YOU WILL LOVE IT
  • 18.
    DevTools -Interactive playground totest GraphQL queries -Apollo server & client libraries -React friendly -Native support for all client platforms -Huge community support Hooks supported!
  • 19.
    Let's get ourhands dirty We create a React application, let users play with balls. All ball data will be saved on server. (not wet) All balls are provided from Pornhub
  • 21.
    Gaio Giulio Cesare GraphQLhelped me to dominate Roman politics, to become one of the greatest military minds in history, and to sleep with Cleopatra 😻 FULL STACK DEVELOPER
  • 22.