In 2015, Facebook launched GraphQL—A query language for APIs, after internally developing it back in 2012. Ever since its inception, GraphQL has grown immensely with a buzzing community and vibrant ecosystem of tools, libraries, IDEs, & more around it. With companies like Twitter, Airbnb, GitHub and myriad others moving to GraphQL, the adoption trend has gone up in the past 6 years.
To cater to the growing number of developers using GraphQL, there is now a wide range of GraphQL IDEs that one can choose from. In this blog post, I’ve put together a list of the top 7 IDEs that you should know about in 2021 (in no particular order). Feel free to comment to add your suggestions and tell us about your preferred IDE!
1.GraphiQL
GraphiQL is a popular lightweight and interactive in-browser GraphQL IDE that is built with React by the GraphQL Foundation. It supports the official GraphQL spec out-of-the-box and includes strong features like a visual query builder, API documentation explorer, syntax & error highlighting, and automatic code completion.
Since this blog post is dedicated to GraphQL IDEs, there is one candidate that deserves an honourable mention—graphiql.online.com. This version of GraphiQL is a fork of the original version with a simple header management UI that lets you configure environment variables that are required in various stages of development. For instance, the production build uses values directly present in index.html serving this app.
2. Insomnia
Insomnia is an open-source API design platform. Although it isn’t specifically a GraphQL IDE, the API client supports GraphQL extensively. It is a great tool for collaboration across teams with its multiple workspaces and import/export features. Other interesting features of the Insomnia editor include automatic query completion and real-time error checking.
3. Postman
Postman is another API development platform that is quite popular among developers. Much like Insomnia, Postman isn't specifically built for GraphQL, rather better suited for REST APIs. However, the support for GraphQL has become a bit more sophisticated and robust. Its auto-generated API documentation is one of its strongest features. It also lets you connect to mock servers for simulating endpoints which allows developers to test different responses without running an actual backend.
4. GraphQL Playground
GraphQL Playground is a GraphQL IDE built on top of GraphiQL, developed by Prisma. Apart from the existing features of GraphiQL, it includes improvements and enhancements to the original GraphiQL experience, like enhanced documentation and schema exploration, and better query debugging.
5. GraphQL Editor
GraphQL Editor is an open-source GraphQL IDE that lets you preview your frontend as a live JAMstack engine by allowing you to connect to a mock backend and comes with a great schema exploration & visualization experience.
6. Apollo Studio
The Apollo Studio Explorer is a cloud-based GraphQL IDE that is specifically tailored to suit GraphQL developers. It lets you save your query history to the cloud automatically.
7. Altair Client
Altair is an open-source GraphQL Client that lets you debug GraphQL queries and implementations, available for multiple platforms including browsers like Chrome, Edge, & Firefox and OS like MacOS, Linux, & Windows. The IDE comes with an advance search for schema documentation and auto-refresh for the docs. Other strong features include multiple windows, extensive plugin system, import/export for your query collections, ability to switch between development environments (local, staging, production), etc.
Special Mention 🎁
Graphqurl—A curl like CLI for GraphQL, made with ❤️ by Hasura. It's features include:
- CLI for making GraphQL queries. It also provisions queries with autocomplete.
- Run a custom GraphiQL, where you can specify requests headers, locally against any endpoint
- Use as a library with Node.js or from the browser
- Supports subscriptions
- Export GraphQL schema
That's a wrap on our lineup of top GraphQL IDEs you should know about! Now that you know your options, try them out with Hasura Cloud. Hasura gives you instant realtime GraphQL APIs over multiple databases. Connect the GraphQL endpoint to your choice of IDE and get going with creating, running, and managing your GraphQL operations in an interactive way. 🚀
Top comments (1)
If we are talking about testing and developing GraphQL APIs, be sure to checkout Testmace (testmace.com). It's nice tool for debugging variety of different communication standards (from REST, through GraphQL, to even GRPC).