Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Upcoming SlideShare
What to Upload to SlideShare
What to Upload to SlideShare
Loading in …3
×
1 of 31

Andreas Roth - GraphQL erfolgreich im Backend einsetzen

0

Share

Download to read offline

GraphQL erfolgreich im Backend einsetzen. Einleitung zu GraphQL vom Dev Day Online 2020.

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

Andreas Roth - GraphQL erfolgreich im Backend einsetzen

  1. 1. ▪ ▪ ▪ ▪ ▪ ▪ ▪
  2. 2. type User { id: Int! name: String! friends: [User!]! } type Query { user(id: Int!): User } type Mutation { setUserName(id: Int!, name: String!): User }
  3. 3. query { user(id: 1) { id name } } { "data": { "user": { "id": 1, "name": "Luke Skywalker" } } }
  4. 4. const app = express(); app.use( "/graphql", graphqlHTTP({ schema, rootValue, graphiql: true })); app.listen( 4000, () => console.log("Listening on port 4000") );
  5. 5. query { user(id: 1) { id name friends { id name } } } const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, };
  6. 6. query { user(id: 1) { id name friends { id name } } } const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, };
  7. 7. query { user(id: 1) { id name friends { id name } } } const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, };
  8. 8. query { user(id: 1) { id name friends { id name } } } const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, };
  9. 9. query { user(id: 1) { id name friends { id name } } } const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, };
  10. 10. const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, }; query { user(id: 1) { id name friends { id name } } }
  11. 11. const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, }; query { user(id: 1) { id name friends { id name } } }
  12. 12. const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, }; query { user(id: 1) { id name friends { id name } } }
  13. 13. const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, }; query { user(id: 1) { id name friends { id name } } }
  14. 14. const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, }; query { user(id: 1) { id name friends { id name } } }
  15. 15. const rootValue = { user: ({ id }) => { const dummyUser = { id: () => id, name: "dummy-user", friends: () => [dummyUser, dummyUser], }; return dummyUser; }, }; query { user(id: 1) { id name friends { id name } } }
  16. 16. const rootValue = { user: async ({ id }) => { const userRow = await userQueries.getById(id); return { id: id, name: userRow.name, friends: () => getFriendsOfUser(id), }; }, };
  17. 17. async function getFriendsOfUser(id) { const friendIds = await userQueries.getFriendIds(id); const friendUserRows = await userQueries.getByIds(friendIds); return friendUserRows.map((friend) => ({ id: friend.id, name: friend.name, friends: () => getFriendsOfUser(friend.id), })); }
  18. 18. ▪ ▪ ▪ ▪ ▪
  19. 19. ▪ ▪ ▪ ▪ ▪ ▪
  20. 20. function getByIds(ids) { return db.all( ` SELECT * FROM user WHERE id IN (${new Array(ids.length).fill("?").join(", ")}) `, ids, ); }
  21. 21. async function preloadUsersById() { usersById = {}; const userRows = await userQueries.getAll(); userRows.forEach((u) => { usersById[u.id] = { ...u, friends: [] }; }); const friendPairs = await userQueries.getFriendPairs(); friendPairs.forEach(([a, b]) => { usersById[a].friends.push(usersById[b]); usersById[b].friends.push(usersById[a]); }); return usersById; }
  22. 22. const dataLoader = new DataLoader(async (userIds) => { const userRows = await userQueries.getByIds(userIds); return userRows.map((userRow) => ({ ...userRow, friends: () => this.friendsByUserIdDataLoader.load(userRow.id), })); }); // later dataLoader.loadMany([1, 2, 3]) dataLoader.loadMany([2, 4, 5])
  23. 23. ▪ ▪ ▪ ▪ ▪ ▪ ▪ →

×