Data source integration in GraphQL - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is data source integration in GraphQL?

Data source integration in GraphQL means connecting your GraphQL server to different places where data lives, like databases or APIs, so you can get and send data through GraphQL queries and mutations.

beginner

Name two common types of data sources used with GraphQL.

Two common data sources are databases (like SQL or NoSQL) and REST APIs. GraphQL can fetch data from these sources and combine it in one response.

intermediate

How does a resolver function help with data source integration?

A resolver function tells GraphQL how to get the data for a specific field by connecting to the right data source and returning the needed information.

intermediate

What is the benefit of using a data source class in Apollo Server?

A data source class helps organize how your GraphQL server talks to external data sources, making code cleaner and easier to manage and reuse.

intermediate

Explain why caching is important in data source integration.

Caching stores data temporarily so GraphQL can respond faster without asking the data source every time, which saves time and reduces load on the data source.

What role does a resolver play in GraphQL data source integration?

A It fetches data from the data source for a query field.

B It defines the GraphQL schema.

C It stores data permanently.

D It formats the GraphQL query.

Resolvers connect query fields to data sources and fetch the needed data.

Which of these is NOT a typical data source for GraphQL?

A GraphQL schema

B REST API

C SQL database

D NoSQL database

The GraphQL schema defines structure but is not a data source itself.

Why use a data source class in Apollo Server?

A To write GraphQL queries.

B To organize and reuse data fetching logic.

C To create new databases.

D To define GraphQL types.

Data source classes help keep data fetching code clean and reusable.

What is a key benefit of caching in data source integration?

A Better schema design.

B More complex queries.

C Faster responses and less load on data sources.

D Automatic data validation.

Caching speeds up responses and reduces repeated data fetching.

Which statement about GraphQL and REST APIs is true?

A REST APIs are faster than GraphQL.

B REST APIs cannot be used with GraphQL.

C GraphQL replaces REST APIs completely.

D GraphQL can fetch data from REST APIs as a data source.

GraphQL servers often fetch data from REST APIs to combine and serve it.

Describe how a GraphQL server integrates with different data sources.

Think about how GraphQL gets data for each query field.

Explain the benefits of using data source classes and caching in GraphQL integration.

Consider code management and speed of responses.

Practice

1. What is the main purpose of data source integration in GraphQL?

easy

A. To style the GraphQL interface for better user experience

B. To encrypt data sent over the network

C. To create new GraphQL schema types automatically

D. To connect GraphQL queries to the actual data storage or services

Solution

1. Step 1: Understand what data source integration means

   It means linking GraphQL queries to where data is stored or fetched from, like databases or APIs.

2. Step 2: Identify the main goal of this integration

   The goal is to let GraphQL get data from these sources when a query runs.

3. Final Answer:

   To connect GraphQL queries to the actual data storage or services -> Option D

4. Quick Check:

   Data source integration = connect queries to data [OK]

Hint: Think: GraphQL needs to reach data somewhere [OK]

Common Mistakes:

• Confusing integration with UI styling
• Thinking it creates schema types automatically
• Assuming it handles data encryption

2. Which of the following is the correct way to define a resolver that fetches data from a REST API in GraphQL?

easy

A. const resolver = () => fetch('https://api.example.com/data').then(res => res.json());

B. const resolver = fetch('https://api.example.com/data').json();

C. const resolver = () => fetch('https://api.example.com/data').json();

D. const resolver = () => fetch('https://api.example.com/data').then(res => res.text());

Solution

1. Step 1: Check how fetch works in JavaScript

   fetch returns a promise; to get JSON, you call .then(res => res.json()).

2. Step 2: Verify the resolver syntax

   const resolver = () => fetch('https://api.example.com/data').then(res => res.json()); correctly returns a function that fetches and parses JSON asynchronously.

3. Final Answer:

   const resolver = () => fetch('https://api.example.com/data').then(res => res.json()); -> Option A

4. Quick Check:

   fetch + then + json() = correct resolver [OK]

Hint: Remember fetch returns a promise; use then() to parse JSON [OK]

Common Mistakes:

• Calling .json() directly on fetch without then()
• Not wrapping fetch in a function
• Using res.text() instead of res.json() for JSON data

3. Given this resolver code snippet, what will be the output of the GraphQL query if the API returns [{"id":1,"name":"Alice"}]?

const resolvers = {
  Query: {
    users: async () => {
      const response = await fetch('https://api.example.com/users');
      const data = await response.json();
      return data;
    }
  }
};

medium

A. undefined

B. {"id":1,"name":"Alice"}

C. [{"id":1,"name":"Alice"}]

D. Error: fetch is not defined

Solution

1. Step 1: Analyze the resolver's return value

   The resolver awaits the fetch, parses JSON, and returns the data array as is.

2. Step 2: Match the returned data with the query output

   The API returns an array with one user object, so the query returns the same array.

3. Final Answer:

   [{"id":1,"name":"Alice"}] -> Option C

4. Quick Check:

   Returned data array = output array [OK]

Hint: Async resolver returns exactly what API sends after parsing [OK]

Common Mistakes:

• Assuming it returns a single object instead of an array
• Forgetting async/await means data is resolved
• Thinking fetch is undefined in server environment

4. Identify the error in this resolver code that fetches data from a database:

const resolvers = {
  Query: {
    products: () => {
      const data = db.query('SELECT * FROM products');
      return data;
    }
  }
};

medium

A. The resolver should be async and await the db query

B. The query string is incorrect SQL syntax

C. The resolver should return a promise, not data

D. The resolver is missing a try-catch block

Solution

1. Step 1: Understand db.query behavior

   db.query usually returns a promise, so it must be awaited in async functions.

2. Step 2: Check resolver function signature

   The resolver is not async and does not await the promise, so it returns a pending promise instead of data.

3. Final Answer:

   The resolver should be async and await the db query -> Option A

4. Quick Check:

   Async + await needed for promises [OK]

Hint: If db query returns promise, resolver must be async and await it [OK]

Common Mistakes:

• Ignoring async/await for promises
• Assuming SQL syntax is wrong without checking
• Thinking try-catch is mandatory for correctness

5. You want to integrate two data sources in a GraphQL resolver: a REST API and a SQL database. Which approach correctly combines data from both sources before returning it?

const resolvers = {
  Query: {
    combinedData: async () => {
      const apiData = await fetch('https://api.example.com/items').then(res => res.json());
      const dbData = await db.query('SELECT * FROM items');
      // What next?
    }
  }
};

hard

A. Return {apiData, dbData} as an object without merging

B. Return [...apiData, ...dbData] to merge both arrays

C. Return dbData only, ignoring apiData

D. Return apiData only, ignoring dbData

Solution

1. Step 1: Understand data types returned

   Both apiData and dbData are arrays of items fetched asynchronously.

2. Step 2: Combine arrays before returning

   Using spread syntax [...apiData, ...dbData] merges both arrays into one list.

3. Final Answer:

   Return [...apiData, ...dbData] to merge both arrays -> Option B

4. Quick Check:

   Spread arrays to combine data sources [OK]

Hint: Use spread operator to merge arrays from multiple sources [OK]

Common Mistakes:

• Returning only one data source ignoring the other
• Returning an object without merging arrays
• Forgetting to await both data sources