Search⌘ K
AI Features

Query Operation with Variables

Explore how to convert hardcoded GraphQL queries into dynamic ones using variables. Understand how to define variable types, pass values through JSON, and avoid string interpolation for safer query execution in Apollo Studio.

Until now, we’ve written all of our GraphQL parameters as query strings in the request. However, the arguments in a production application will usually be dynamic. For example, our application may have a dropdown menu with side dishes we, a search area, or a set of filters.

Variables in GraphQL

Instead of requiring the client to dynamically change the query string, GraphQL features an exclusive approach to extract dynamic values and set their values. These values are called variables.

How to convert hardcoded GraphQL queries

Let’s observe the GetPizzas query again.

JavaScript (JSX)
query GetPizzas{
pizzas(pizza:"Chicago Pizza") {
id
pizza
toppings {
id
topping
}
}
}

Before converting the hardcoded GraphQL ...