Interactive GraphQL query builder with schema introspection and execution. Part of the DevTools Surf developer suite. Browse more tools in the API / Config collection.
Use Cases
Explore a public GraphQL API (GitHub, SpaceX) without setting up a local client.
Debug query errors by running queries against a schema and inspecting the full error response.
Build and test mutations before wiring them into frontend code.
Compare N+1 query patterns vs. batched queries using the explorer's response timing.
Tips
Use the schema introspection panel to browse available types and fields before writing queries by hand.
Add 'fragment UserFields on User { id name email }' to reuse field sets across multiple queries in the same session.
Check the Variables panel to pass dynamic arguments as JSON rather than hardcoding them into the query string.
Fun Facts
GraphQL was developed by Facebook (now Meta) engineers in 2012 and open-sourced in 2015. It was originally built to power the Facebook mobile app's data fetching.
GraphQL's introspection system — the ability to query a schema about itself — was novel at the time. REST APIs had no equivalent until OpenAPI/Swagger became widespread.
The npm package 'graphql' has been downloaded over 4 billion times since its 2015 release, making it one of the most-downloaded packages in the JavaScript ecosystem.
FAQ
Can I connect to my own GraphQL endpoint?
Yes — enter any GraphQL endpoint URL. The explorer fetches the introspection schema and builds a browser-based query editor for it.
Does it support subscriptions?
WebSocket-based subscriptions are supported when connecting to an endpoint that implements the graphql-ws protocol. SSE-based subscriptions are read-only (no subscription input).
How do I authenticate requests?
Add authorization headers in the Headers panel (e.g., Authorization: Bearer <token>). Headers are sent with every request during the session.
