Query variables in GraphQL - Mini Project: Build & Apply

Using Query Variables in GraphQL

📖 Scenario: You are building a simple GraphQL API for a bookstore. You want to allow users to query for books by their id using query variables.

🎯 Goal: Create a GraphQL query that uses a variable called $bookId to fetch the title and author of a book by its id.

📋 What You'll Learn

Define a query named GetBookById that accepts a variable $bookId of type ID!

Use the variable $bookId in the query to fetch the book with that id

Request the title and author fields of the book

💡 Why This Matters

🌍 Real World

GraphQL query variables are used in real applications to make queries dynamic and reusable without rewriting the query for each input.

💼 Career

Understanding query variables is essential for backend and frontend developers working with GraphQL APIs to build efficient and flexible data fetching.

1

Define the GraphQL query with a variable

Write a GraphQL query named GetBookById that accepts a variable $bookId of type ID!. Inside the query, select the book field and pass id: $bookId as an argument.

GraphQL

# Write the query definition with variable $bookId of type ID!
query GetBookById($bookId: ID!) {
  book(id: $bookId) {
    
  }
}

Need a hint?

Remember to declare the variable $bookId with its type ID! in the query definition.

2

Add the variable value in the query variables section

Create a JSON object named variables with a key "bookId" and value "1" to provide the variable value for the query.

GraphQL

query GetBookById($bookId: ID!) {
  book(id: $bookId) {
    title
    author
  }
}

# Define the variables JSON object below

Need a hint?

The variables are sent as a JSON object with keys matching the variable names without the $ sign.

3

Use the query and variables together

Combine the query and the variables JSON object so they can be sent together in a GraphQL request.

GraphQL

# Combine the query and variables for the request
# Your code here

Need a hint?

Usually, the query string and variables JSON are sent together in the request body.

4

Complete the query to fetch book details by variable

Ensure the query named GetBookById uses the variable $bookId to fetch the title and author fields of the book with that id. The variables JSON object must have "bookId": "1".

GraphQL

# Finalize the query and variables
# Your code here

Need a hint?

Double-check that the variable is used correctly in the query and the variables JSON matches the variable name.