This document discusses using GraphQL to wrap and secure REST APIs. It describes problems with REST APIs like multiple endpoints, over-fetching and under-fetching data, and versioning issues. GraphQL solves these problems with a single endpoint that returns flexible data structures. The document then provides steps to implement GraphQL, including using schemas to define queries and mutations, retrieving data from existing services and APIs, adding authentication middleware, and building a GraphQL server with Node.js and Apollo.

1. Wrapping and Securing
REST APIs with GraphQL
Nodejs Edinburgh Meetup
05/02/2019

2. What is this about?
@gethackteam

3. @gethackteam

4. Who Am I?
@gethackteam

5. @gethackteam
Roy Derks
@gethackteam
Auth0 Ambassador
#reactjs #ReactNative
#GraphQL

6. Who is this for?
@gethackteam

7. Who is this for?
BACKEND
@gethackteam

8. What is wrong with REST?
@gethackteam

9. REST has multiple
endpoints that return fixed
data structures
@gethackteam

10. Let’s look at an example
REST API
@gethackteam

11. What is wrong with REST?
Multiple Endpoints
@gethackteam

12. What is wrong with REST?
Multiple Endpoints
1
@gethackteam

13. What is wrong with REST?
Multiple Endpoints
1
2
@gethackteam

14. What is wrong with REST?
Multiple Endpoints
1
2
3
@gethackteam

15. Why not create one endpoint
with all information?
@gethackteam

16. What is wrong with REST?
Multiple Endpoints
@gethackteam

17. What is wrong with REST?
Multiple Endpoints
@gethackteam

18. What is wrong with REST?
Multiple Endpoints
@gethackteam

19. Why not specify parameters
you want to receive?
@gethackteam

20. What is wrong with REST?
Under/Over-fetching
@gethackteam

21. SHOW
What is wrong with REST?
Under/Over-fetching
@gethackteam

22. SHOW
What is wrong with REST?
Under/Over-fetching
@gethackteam

23. SHOW
What is wrong with REST?
Under/Over-fetching
2
1
@gethackteam

24. But how does this affect the first
version of the application?
@gethackteam

25. SHOW MORE
What is wrong with REST?
Versioning
V1 V2 @gethackteam

26. SHOW MORE
What is wrong with REST?
Versioning
V1 V2
Different endpoints
@gethackteam

27. SHOW MORE
What is wrong with REST?
Versioning
V1 V2
Different endpoints
@gethackteam
Different parameters

28. SHOW MORE
What is wrong with REST?
Versioning
V1 V2
Different endpoints
@gethackteam
Different parameters
Different datastructures

29. How does GraphQL
solve these problems?
@gethackteam

30. How does GraphQL
solve these problems?
Multiple Endpoints
@gethackteam

31. How does GraphQL
solve these problems?
Multiple Endpoints
Over-fetching
@gethackteam

32. How does GraphQL
solve these problems?
Multiple Endpoints
Under-fetching (N+1)
Over-fetching
@gethackteam

33. How does GraphQL
solve these problems?
Multiple Endpoints
Under-fetching (N+1)
Over-fetching Versioning /
Documentation@gethackteam

34. GraphQL has a single
endpoint that returns flexible
data structures
@gethackteam

35. How does GraphQL Solve This
Multiple Endpoints
@gethackteam

36. How does GraphQL Solve This
Multiple Endpoints
@gethackteam

37. How does GraphQL Solve This
Multiple Endpoints
GET
Query
@gethackteam

38. How does GraphQL Solve This
Multiple Endpoints
Mutation
POST PUT
PATCH DELETE
GET
Query
@gethackteam

39. How does GraphQL Solve This
Multiple Endpoints
Mutation
POST PUT
PATCH DELETE
GET
Query
@gethackteam

40. How does GraphQL Solve This
Single endpoint

41. How does GraphQL Solve This
Single endpoint

42. How does GraphQL Solve This
Single endpoint
Describe the data structure

43. How does GraphQL Solve This
Single endpoint
Describe the data structure
Set the possible queries

44. How does GraphQL Solve This
Single endpoint

45. How does GraphQL Solve This
Single endpoint
Set dynamic parameters

46. Specify which data
to return
How does GraphQL Solve This
Single endpoint
Set dynamic parameters

47. How does GraphQL Solve This
Single endpoint

48. How does GraphQL Solve This
Single endpoint
Predictable return result

49. Sounds great! How can I
implement this?
@gethackteam

50. BACKEND
Implementation
@gethackteam

51. BACKEND
Implementation
@gethackteam

52. Implementation
Existing services
Database(s)
Third-party API
@gethackteam

53. Implementation
Existing services
Database(s)
Third-party API
@gethackteam

54. Implementation
Existing services
Database(s)
Third-party API
@gethackteam

55. Implementation
@gethackteam

56. Implementation
@gethackteam
Node.js API Server

57. Implementation
@gethackteam
Node.js API Server
Apollo Express GraphQL Server

58. Implementation
@gethackteam

59. Implementation
Schemas
@gethackteam

60. Implementation
Schemas
@gethackteam
Match data
to schema

61. Implementation
@gethackteam

62. Implementation
Retrieve data
from source
@gethackteam

63. Implementation
Retrieve data
from source
Get information
from headers
@gethackteam

64. Implementation
@gethackteam

65. Implementation
Initialise the
Node.js / GraphQL
server
@gethackteam

66. Data Sources
@gethackteam

67. Data Sources
@gethackteam

68. Data Sources
@gethackteam
Fetch REST endpoint

69. https://github.com/royderks/
auth0-graphql-rest/tree/
datasources
@gethackteam

70. Cool, let’s add Authentication
@gethackteam

71. Add Authentication
@gethackteam

72. Add Authentication
@gethackteam

73. Add Authentication
Middleware to validate JWT
@gethackteam

74. Add Authentication
Middleware to validate JWT
Retrieve key from JWT
@gethackteam

75. Add Authentication
Middleware to validate JWT
Retrieve key from JWT
Validate JWT scopes
@gethackteam

76. Add Authentication
@gethackteam

77. Add Authentication
Don’t break when token is
incorrect or missing @gethackteam

78. Add Authentication
Don’t break when token is
incorrect or missing
Add middleware to endpoint
@gethackteam

79. Add Authentication
@gethackteam

80. Add Authentication
Get information
from headers @gethackteam

81. Add Authentication
Get information
from headers @gethackteam

82. Add Authentication
Get information
from headers Pass to REST endpoint @gethackteam

83. https://github.com/royderks/
auth0-graphql-rest
@gethackteam

84. To summarise..
@gethackteam

85. GraphQL can be built on top of
your existing data and code
@gethackteam

86. Want to learn more?
@gethackteam #javascriptEverywhere
https://auth0.com/
https://howtographql.com