GraphiQL
Browser-based GraphQL IDE plus the editor and language tools behind it.
- Stars
- 16.9k
- Forks
- 1.9k
- Licence
- MIT
- Language
- TypeScript
- Last update
- 4 days ago
- Type
- Library
What it is
This monorepo holds GraphiQL, an in-browser IDE for writing and testing GraphQL queries against a server, along with the packages that power it. It also includes editor integrations for CodeMirror and Monaco, and a language server (LSP) that IDE extensions such as VS Code can use for GraphQL support.
- Add a GraphiQL query console to a GraphQL server's web page
- Get GraphQL autocomplete and linting in a VS Code extension via the language server
- Use the CodeMirror 6 or Monaco packages to add a schema-aware GraphQL editor to a web app
- Run the graphql-language-service-cli to use the language service from the command line
Great for
- Teams that want an in-browser GraphQL query tool embedded in their own web app or server
- Developers building editor or IDE plugins for GraphQL
- Framework or plugin authors who want to add a GraphQL IDE experience
- Developers who want schema-aware autocomplete and linting in CodeMirror or Monaco
Not ideal for
- People who just want a finished desktop app; the README describes libraries and packages rather than a standalone installer
- Users who need Internet Explorer or old browser support, which the README explicitly does not provide
- Anyone looking for a simple one-line tool; the monorepo spans many packages, so the right one depends on the goal
How to get it
- 1
Install with a package manager
You'll need: Node.js
Clone the repository
git clone https://github.com/graphql/graphiql - 2
Run it
- Read packages/graphiql/README.md for the GraphiQL setup instructions
- Install the package you need from npm, for example graphiql
- Point GraphiQL at your GraphQL server endpoint
- Open the page in a supported modern browser and run a query
- 3
Get the most out of it
- Use the language service packages to add GraphQL support to other editors via LSP
- Review the security docs in docs/security and keep graphiql at 1.4.7 or later
- Check the typedoc API docs linked in the README for the language service API
- Try the examples directory for working integrations
Downloads
Strengths
- Official project under the GraphQL Foundation, with the reference implementation of the tooling
- Covers several layers: browser UI, editor modes, and a reusable language server
- MIT licensed and actively maintained, with a recent push date
Trade-offs
- Many packages with different roles, so newcomers must work out which one they need
- The README warns that graphiql versions below 1.4.7 have an XSS issue when the connected server is untrusted
- Monaco support is described as 'in the works' in the README
How it compares
| Project | Stars | Type | Level | Updated | Best for |
|---|---|---|---|---|---|
| graphiql (this) | 16.9k | Library | intermediate | 4 days ago | Teams that want an in-browser GraphQL query tool embedded in their own web app or server |
| monaco-editor | 46.9k | Library | intermediate | 6 days ago | Web developers adding a code editing box to a browser app |
| editor.md | 14.3k | Library | beginner | 2.5 years ago | Web developers who want a Markdown input box inside their own site or admin panel |
| gatsby | 55.9k | Framework | intermediate | 17 days ago | Developers building content-heavy sites such as blogs or documentation |
| query | 50.5k | Library | intermediate | 4 days ago | Frontend developers building apps that load data from a server |
| refine | 36k | Framework | intermediate | 2 months ago | Developers building internal admin panels or back-office tools in React |
Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.