Overstacked

Writing your first query ✏️

Learn how to write your first GraphQL query in the GraphQL Playground.

GraphQL queries are not magic. They are just sent as a standard HTTP request to the GraphQL server. Let's write our first query in the GraphQL Playground and understand exactly how it works under the hood.

The anatomy of a query

Queries are made up of a few key parts:

  • query: This is the keyword that tells the server that we are making a query.
  • users: This is the name of the field we are querying.
  • id, name: This is the data we want to return.

These are the core components for any query.

query {
  users {
    id
    name
  }
}

When we send this query to the server, nothing magic is happening. The server will receive the query and return the data in the format we specified.

{
  "data": {
    "users": [
      {
        "id": 1,
        "name": "John Doe"
      }
    ]
  }
}

What is actually being sent to the server? It's a standard HTTP request with a JSON body!

POST /graphql HTTP/1.1
Host: localhost:3000
Content-Type: application/json

{
  "query": "query { users { id name } }"
}

On this page