Graphql workshop

GraphQL workshop React Alicante

Transcript

1. For React Developers @aashimaahuja22
3. Agenda 1. Introduction 2. Graphql fundamentals 3. Graphql Server 4. GraphQl Client (Apollo Client) 5. Graphql with typescript
4. Introduction
5. GraphQL introduction 1. Restful Routing 2. Shortcomings of Restful Routings 3. What is GraphQL ? 4. Why GraphQL ?
6. RESTful Routing They are set of rules that are used to carry out the CRUD operations, by using a set of HTTP verbs to make server requests.
7. Enter some content Post Enter some content Delete Edit http:// http://
8. HTTP methods URL Method Operation /posts POST Create a new post /posts GET Fetch all posts /posts/23 GET Fetch post 23 /posts/20 PUT update post 20 /posts/12 DELETE delete post 12
9. Restful conventions URL Method Operation /<name> POST Create a record /<name> GET Fetch all records /<name>/:id GET Fetch record with given id /<name>/:id PUT update record with given id /<name>/:id DELETE delete record with given id
10. Nested Urls URL Method Operation /users/2/posts POST Create a new post /users/2/posts GET Fetch all posts users/2/posts/23 GET Fetch post 23 users/2/posts/20 PUT update post 20 users/2/posts/12 DELETE delete post 12
11. Shortcomings of RESTful routing John Doe software engineer at Google Sarah Drasner software engineer at Netlify David Miller software engineer at X Cool Dude Fashion Designer @Tommy username company
12. Tables userId ID name String company_id ID position_id ID id ID name String description String User Company id ID name String description String Position
13. User Friend Friend Friend Company Position Company Position Company Position /user/23 /user/23/friends ???
14. Friend Friend Friend Company Position Company Position Company Position /user/23/friends /users/1/company /users/1/position /users/2/company /users/2/position
15. Friend Friend Friend Company Position Company Position Company Position /user/23/friends_with_companies_and_positions { id: 12, name: ‘Apple’, stockPrice: ‘’, type: ‘public’ }
16. RESTful Routing shortcomings 1. Difficult to define urls in case of heavily nested relations 2. Too many http calls 3. Over Fetching data
17. User User User User Company Position Company Position Company Position
18. query { user(id: “23”) { friends { company name } } } User User User User Company Position Position Company Position
19. Writing first graphql query
20. Graphql Academy Project
21. Graphql academy - Display list of courses - Show details of each course - Add new course - Delete a course - Update details of a course
22. Client Server GraphQL
23. Client Server GraphQL Database
24. Client Server GraphQL Database data access
25. Client Server GraphQL Database data access Auth
26. Client Server GraphQL Database data access Auth Web framework
27. Client Server GraphQL Database data access Auth Next JS
28. Client Server GraphQL SQLite data access Auth Next JS
29. Client Server GraphQL SQLite knex Auth Next JS
30. Client Server Apollo Server SQLite knex Auth Next JS
31. Client Server Apollo Server SQLite knex Next JS
32. Thankyou Slides Github repo link