This document is a presentation on GraphQL fundamentals. It was created by Virbhadra S. Ankalkote from BORN Group. The presentation covers what GraphQL is, who created it, why it was created, and how it works. It defines GraphQL as a query language for APIs that fulfills queries with existing data. It notes that Facebook developed GraphQL in 2012 for their native mobile app. In comparison to REST APIs, GraphQL allows clients to get precisely the data they need in one request. The presentation explains the GraphQL specification and includes sections on reading and writing data, using variables and fragments, and limitations such as indefinite querying depth.

1. © 2021 GraphQL, Inc. Page | 1
GraphQL Fundamentals

2. © 2021 GraphQL.
.
Page | 2
Senior Software Engineer at BORN Group
Virbhadra S. Ankalkote

3. © 2021 GraphQL Page | 3
Agenda

4. © 2021 GraphQL Page | 4
Agenda
{
graphql:{
what
who
why
how
}
}

5. © 2021 GraphQL Page | 5
What ?

6. © 2021 GraphQL Page | 6
“GraphQL is a query language
for APIs, and a runtime for
fulfilling those queries with
existing data ”

7. © 2021 GraphQL Page | 7
Who ?

8. © 2021 GraphQL Page | 8
“In 2012, Facebook develop the
GraphQL technology for their
native mobile app”
.

9. © 2021 GraphQL Page | 9
.
2012 2015 2017..2018...2020
Development Started Open Source Evolving Specification.
Timeline

10. © 2021 GraphQL Page | 10
Why?

11. © 2021 GraphQL Page | 11
Application Programming Interface (API)

12. © 2021 GraphQL Page | 12
REST Flow

13. © 2021 GraphQL Page | 13
Principles of REST API Design

14. © 2021 GraphQL Page | 14

15. © 2021 GraphQL Page | 15
GraphQL Flow

16. © 2021 GraphQL Page | 16

17. © 2021 GraphQL Page | 17
Browser Tools

18. © 2021 GraphQL Page | 18

19. © 2021 GraphQL Page | 19
GraphQL Playground

20. © 2021 GraphQL Page | 20
How?

21. © 2021 GraphQL Page | 21

22. © 2021 GraphQL Page | 22

23. © 2021 GraphQL Page | 23

24. © 2021 GraphQL Page | 24

25. © 2021 GraphQL Page | 25
Limitations

26. © 2021 GraphQL Page | 26

27. © 2021 GraphQL Page | 27
Reading Data

28. © 2021 GraphQL Page | 28

29. © 2021 GraphQL Page | 29

30. © 2021 GraphQL Page | 30

31. © 2021 GraphQL Page | 31

32. © 2021 GraphQL Page | 32
Writing Data ( Mutation )

33. © 2021 GraphQL Page | 33

34. © 2021 GraphQL Page | 34

35. © 2021 GraphQL Page | 35

36. © 2021 GraphQL Page | 36
GraphQL Variables

37. © 2021 GraphQL Page | 37
• In GraphQL, you can use variables to reuse the same query/mutations written by
the client, with different arguments.
• When we start working with variables, we need to do three things:
– Replace the static value in the query with $variableName
– Declare $variableName as one of the variables accepted by the query
– Pass variableName: value in the separate, transport-specific (usually JSON)
variables dictionary

38. © 2021 GraphQL Page | 38
GraphQL Fragments

39. © 2021 GraphQL Page | 39
• A GraphQL fragment is a piece of logic that a client can share between multiple
queries and mutations.
• In GraphQL, you often need to query for the same data fields in different queries.
• By reusing this code, we can be more efficient with our time and reuse these piece
of queries

40. © 2021 GraphQL Page | 40

41. © 2021 GraphQL Page | 41
Pain Points of GraphQL

42. © 2021 GraphQL Page | 42
Almost impossible to solve
● Query In Indefinite Depth
– GraphQL cannot query in indefinite depth, so if you have a tree and want to
return a branch without knowing the depth, you’ll have to do some
pagination
● Specific Response Structure
– In GraphQL the response matches the shape of the query, so if you need to
respond in a very specific structure, you'll have to add a transformation layer
to reshape the response.

43. © 2021 GraphQL Page | 43
Hard to solve
● Cache at Network Level
– Because of the commonly way GraphQL is used over HTTP (A POST in a
single endpoint), cache at network level becomes hard. A way to solve it is to
use Persisted Queries.
● Handling File Upload
– There is nothing about file upload in the GraphQL specification and
mutations doesn’t accept files in the arguments. To solve it you can upload
files using other kind of APIs (like REST) and pass the URL of the uploaded file
to the GraphQL mutation, or inject the file in the execution context, so you’ll
have the file inside the resolver functions.

44. © 2021 GraphQL Page | 44
Questions ?

45. © 2021 GraphQL Page | 45
Thank You