GraphQL - Tidepool Labs
Download as PPTX, PDF0 likes44 views
The document discusses the integration of GraphQL into an existing RESTful backend API to better serve different client types, such as web and mobile applications. It highlights issues like over-fetching, under-fetching, and various data endpoint challenges, and outlines the structure of GraphQL queries, types, and resolvers. The document emphasizes the need for a streamlined approach to manage data more efficiently and improve client interactions.
![Hello GraphQl
query MyProduct($id: ID!) {
product($id: $id) {
name,
description
devices {
name,
model
}
}
}
{
product {
Name: “apple”
Description: “Good device”
devices: [
{name: “iPhone”, model: “x”},
{name: “iPad”, model: “Pro”}
]
}
}](https://image.slidesharecdn.com/graphql-230608220411-5c4cdadb/85/GraphQL-Tidepool-Labs-12-320.jpg)
![Type Definition and Resolvers
type Product {
id: ID!
name: STRING
description: STRING
devices: [Device]
}](https://image.slidesharecdn.com/graphql-230608220411-5c4cdadb/85/GraphQL-Tidepool-Labs-13-320.jpg)
![The Schema
type Query {
product(id: ID!): Product
products: [Product]
device(id: ID!): Device
devices: [Device]
}
type Mutation {
addProduct(id: ID!): Product
updateDevice(id: ID!): Device
}](https://image.slidesharecdn.com/graphql-230608220411-5c4cdadb/85/GraphQL-Tidepool-Labs-14-320.jpg)
GraphQL - Tidepool Labs
- 2. What do we have? ● RestFul backend Api ● Client App
- 3. What do we need? Integration of a new type of client how use our data.
- 4. What can we do? ● Use existing endpoint ● Create new endpoint for each new client type ● Create custom/internal endpoints ● Refactor existing API ● Find a better solution
- 5. Data API 1 Web Client API 2 Mobile Client
- 6. Main problems ● Web and mobile use different data and different endpoints ● Too many request from old existing api (over-fetching/ under-fetching) ● Data types
- 8. What is GraphQL? ● A query language for your API (A data query language) ● Runtime for queries. (Spec/ specification)
- 11. Hello GraphQL Query { product{ name, description } } { product: { name: Apple, description: “good devices” } }
- 12. Hello GraphQl query MyProduct($id: ID!) { product($id: $id) { name, description devices { name, model } } } { product { Name: “apple” Description: “Good device” devices: [ {name: “iPhone”, model: “x”}, {name: “iPad”, model: “Pro”} ] } }
- 13. Type Definition and Resolvers type Product { id: ID! name: STRING description: STRING devices: [Device] }
- 14. The Schema type Query { product(id: ID!): Product products: [Product] device(id: ID!): Device devices: [Device] } type Mutation { addProduct(id: ID!): Product updateDevice(id: ID!): Device }
- 15. The Resolvers const Resolvers = { products: () => db.products.list, product: (parent, { id }) => db.products.findByPk(id) }
- 16. Problems ● N+1 queries ● Growing query complexity ● Error handling ● HTTP caching