GraphQL APIs offer greater flexibility than traditional REST APIs and are particularly suited for mobile app development. Exposing a GraphQL API is also becoming an expected part of the API offering of many platforms. GraphQL APIs work differently to traditional REST APIs and also present some unique operational challenges. In this session, Ben Morgan will get you ready to build and run a GraphQL API. The session is focussed on the design and operational side. We will cover the basics of GraphQL; design patterns for GraphQL; how to operate a GraphQL API; and take a look at available tooling.

1. BENJAMIN MORGAN | SENIOR DEVELOPER | ATLASSIAN | @BENEDWINMORGAN
Designing and Running a
GraphQL API

2. How do you build apis today?

3. REST

4. Why GraphQL?

5. Latency
Why GraphQL
MobileOver / Under fetching

6. /users/12345
{
"name": "Ben",
"dateOfBirth": "1/2/1930",
"hairColour": "Brown",
"shoeSize": {
"EU": "44"
},
"favouriteColour": "Grey",
"preferredIcecream": "Chocolate",
“floor": "8"
}

7. /users/12345
{
"name": "Ben",
"dateOfBirth": "1/2/1930",
"hairColour": "Brown",
"shoeSize": {
"EU": "44"
}
}
/users/12345/address
{
"number": "123",
"street": "george"
}

8. Latency

9. Mobile

10. What is GraphQL?

11. Is a query
language
GRAPHQL

12. {
person (id: 123) {
name
address {
street
}
}
}

13. {
person (id: 123) {
name
address {
street
}
}
}

14. {
"data": {
"person": {
"name": "Ben",
"address": {
"street": "George"
}
}
}
}

15. Schema Execution Engine
Components

16. type Person {
name: String
dateOfBirth: String
hairColour: String
address: Address
}
type Address {
number: String
street: String
}
type Query {
person(id: ID): Person
}

17. type Person {
name: String
dateOfBirth: String
hairColour: String
address: Address
}
type Address {
number: String
street: String
}
type Query {
person(id: ID): Person
}

18. type Person {
name: String
dateOfBirth: String
hairColour: String
address: Address
}
type Address {
number: String
street: String
}
type Query {
person(id: ID): Person
}

19. type Person {
name: String
dateOfBirth: String
hairColour: String
address: Address
}
type Address {
number: String
street: String
}
type Query {
person(id: ID): Person
}

20. Query parsing
Break the query up into fields
Data fetcher / resolvers
Fetch portions of the graph
Merge results
Merge the results of the fetch operations

21. Query parsing
Break the query up into entities
Data fetcher / resolvers
Fetch portions of the graph
Merge results
Merge the results of the fetch operations

22. Query parsing
Break the query up into entities
Data fetcher / resolvers
Fetch portions of the graph
Merge results
Merge the results of the fetch operations

23. Stick it on a HTTP path and
you’re done!

24. Design Patterns

25. Schema evolution
Pagination
Mutations

26. GraphQL is more flexible
Prefer types
Monitor schema usage

27. GraphQL is more flexible
Prefer types
Monitor schema usage

28. type Person {
name: String
dateOfBirth: String
hairColour: String
address: Address
}
type Address {
number: String
street: String
}
type Query {
person(id: ID): Person
}

29. type Person {
name: String
dateOfBirth: String
hairColour: String
address: Address
}
type Address {
number: String
street: String
}
type Query {
person(id: ID): Person
}

30. GraphQL is more flexible
Prefer types
Monitor schema usage

31. Schema evolution
Pagination
Mutations

32. Relay Cursor Specification
Connection and Node
PageInfo and Cursor

33. Relay Cursor Specification
Connection and Node
PageInfo and Cursor

34. Relay Cursor Specification
Connection and Node
PageInfo and Cursor

35. Schema evolution
Pagination
Mutations

36. No hierarchy
Use a single mandatory input object
Return the affected object

37. No hierarchy
Use a single mandatory input object
Return the affected object

38. No hierarchy
Use a single mandatory input object
Return the affected object

39. Running a service

40. Monitoring
Tracing
Access logging

41. "GET /hello/world HTTP/1.1" 200
"POST /user/create HTTP/1.1" 200
"POST /user/create HTTP/1.1" 500
"GET /group/report HTTP/1.1" 200
"DELETE /user/create HTTP/1.1" 500

42. "POST /graphql HTTP/1.1" 200
"POST /graphql HTTP/1.1" 200
"POST /graphql HTTP/1.1" 200
"POST /graphql HTTP/1.1" 200
"POST /graphql HTTP/1.1" 200

43. {
"data": {
},
"errors": [
{
"message": "No user found with name
'Ben'.",
"locations": [
{
}
],
"path": [
],
"extensions": {
}
}
]
}

44. {
"extensions": {
"status": [
400
],
"statusCode": 400,
"userMessage": "No user found with name
'Ben'."
}
}

45. Monitoring
Tracing
Access logging

46. "GET /hello/world HTTP/1.1" 200
"POST /user/create HTTP/1.1" 200
"POST /user/create HTTP/1.1" 500
"GET /group/report HTTP/1.1" 200
"DELETE /user/create HTTP/1.1" 500

47. "POST /graphql HTTP/1.1" 200
"POST /graphql HTTP/1.1" 200
"POST /graphql HTTP/1.1" 200
"POST /graphql HTTP/1.1" 200
"POST /graphql HTTP/1.1" 200

48. {
person (xxx) {
name
address {
street
}
}
}

49. "127.0.0.1 bmorgan "query {person…

50. Monitoring
Tracing
Access logging

51. Track performance by field not url
Not all fields are equal
Consider tooling such as apollo-tracing

52. Track performance by field not url
Not all fields are equal
Consider tooling such as apollo-tracing

53. Track performance by field not url
Not all fields are equal
Consider tooling such as apollo-tracing

54. {
"data": {
"person": {
...
},
"extensions": {
"tracing": {
"startTime" : 123,
...
"execution" : {
"resolvers": [...]
}
}
}
}

55. Schema Validation
Tooling
GatewaysGraphiQL

57. Schema Validation
Tooling
GatewaysGraphiQL

58. Schema Validation
Tooling
GatewaysGraphiQL

59. That is it!

60. Operating
Summary
ToolingDesigning

61. Projects and tools
GraphQL Foundation
Foundation that looks after the
GraphQL standard
Relay
Framework for GraphQL client
Apollo GraphQL
Platform and tooling for building
graphql APIs
GraphiQL
In browser query ide
graphql-java
Java Graphql framework

63. BENJAMIN MORGAN | SENIOR DEVELOPER | ATLASSIAN | @BENEDWINMORGAN
Thank you!