GraphQL Query Builder
Generate GraphQL queries, mutations, and subscriptions with nested selection sets.
Written by Golam Rabbani, Founder & Lead Engineer
How to use this graphql query builder
- Pick the operation type: query, mutation, or subscription.
- Optionally name the operation (helpful when sending to a server with operation logs).
- Enter the root field — e.g. user, products, createPost.
- List arguments as comma-separated name:value pairs (id: 42, first: 10).
- List fields comma- or newline-separated; use braces for nested selections: address { city, zip }.
- Press Generate to emit a clean, indented GraphQL document.
About this graphql query builder
The GraphQL query builder writes valid GraphQL document text from form fields. Field lists support nested selection sets via braces, so "id, name, address { city, zip }" becomes a properly indented selection set. Arguments are parsed with balanced-bracket awareness so values like {first: 10, after: "abc"} or [1, 2, 3] pass through intact. Identifiers — operation name, root field, argument names — are validated against the GraphQL name rule (a letter or underscore followed by letters, digits, or underscores).
Worked example: pick query, name it "GetUser", set root field to "user", arguments to "id: 42", and fields to "id, name, email, address { city, zip }". The tool emits: query GetUser { user(id: 42) { id name email address { city zip } } }
Paste it into GraphiQL, Apollo Sandbox, or any HTTP client targeting your /graphql endpoint. The builder runs entirely client-side and never talks to a remote schema.
FAQ
- Does the builder validate against a real GraphQL schema?
- No. It checks GraphQL name syntax and bracket balance, but it does not know your schema. The output is syntactically valid GraphQL; whether the requested fields exist on the server is something only your server can answer.
- How do I write nested fields?
- Use braces. For example, "user, posts { id, title }, profile { bio, avatar { url, size } }" expands into the right multi-level selection set with proper indentation.
- Can I use variables like $userId?
- You can pass any literal in the arguments field, including a GraphQL variable reference like "id: $userId". The builder treats the value as opaque text, so $variables flow straight through to the output. Add the variable declaration manually if you need it on the operation line.
- Does it support mutations and subscriptions?
- Yes. Switch the operation type dropdown; the rest of the form behaves identically. Mutations and subscriptions follow the same root-field + arguments + selection-set shape as queries.
- How does the argument parser handle nested objects?
- It splits on commas only at the top level. Anything inside (), [], or {} is treated as part of the same value, so "where: {role: \"admin\"}, first: 10" stays intact rather than splitting on the inner comma.
- Is anything sent to a server?
- No. The query string never leaves your browser. You decide where to send it.