It's been 2 months of , throughout this time I have been discussing with so many folks about their GraphQL usage and experience with Playground. Firecamp's GraphQL playground launching I am so privileged to have meaningful insights and have great feedback from the community, and based on that we implemented new features, changed DX and put a focus on accessibility. This week we have launched a new revamped version of GraphQL playground with all these following productive and time-saving features. So, here is the list of weapons to stay prepared for the GraphQL war. Magical Playground Single/Multiple File upload Query collection (One-click save playground queries) Interactive Query Variables Query Documents Save & Export GraphQL request Let me go through with all these goodies one by one. 1. Magical Playground It's a query-writing area, where we can write any query and hit cmd+enter to execute it. The takeaway is we can write N number of queries. To execute one query from the playground, just bring the cursor to the query area and hit the play button. That query will become an active query and get executed on the play-button click. means, to set any query as active query, just bring the cursor to its context area in a playground (set cursor in-between start and end line of per query) 2. Single/Multiple File upload Uploading a file with GraphQL is a bit hurdle at this moment as it's not mature for file handling but the community is seriously trying to fill this gap. supports file uploading with this community-driven specifications. To upload a file, just select files from the bottom section of the playground and use the $files variables in a query as variable. see this live-action from the below video. Firecamp GraphQL playground 3. Query collection (One-click save playground queries) Query collection is the previously saved query's list, which helps us to avoid the repetition task of writing the query again and again. and also it 's sharable by exporting the GraphQL request configuration. If the area having 2 queries and 3 mutations then to save them in a collection we just need to click on the Save to collection button. All the queries, mutations and subscriptions will get saved with their original name. playground 4. Interactive Query Variables Variables vary with query by query. As shown in the below video, By changing the active query, the variable section will get reflect with new active query's variables. We can edit those variables like JSON editor, JSON-like-form or Table form. just change the option from caret shown on the right side. 5. Query/Schema Documentation As of now, is using a modified version of GraphiQL's query Document. It's pretty neat and clean. It shows the entire schema documentation of the GraphQL server implementation. Firecamp GraphQL playground 6. Save & Export GraphQL request focuses on persistency. It's configurable, sharable, and storable for future usage and collaboration purpose. Firecamp GraphQL playground Here we can add queries to the collection, and save the request within the project. Anytime later we can have single-click access to our saved GraphQL queries. and start executing in a matter of seconds. Team collaboration feature is in private beta, Apply for Team Access Thank you so much for reading this blog. Feel free to share anything you want that improves developer productivity. Please follow on Twitter and I would be happy to connect for discussion @FirecampHQ @Nishchit14

Here is the Fastest GraphQL Playground

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Postman Alternative: Firecamp - Lightweight and Minimal API Testing Client

Code Smell 09 - What Should You Do With Dead Code?

No Mouse 30: A Quiet Experiment in Keyboard-First Work

Google Just Killed LeetCode: Why AlphaEvolve is the End of the "Algorithm Interview"

The "Concrete Foundation" Fallacy: Why Your Quick-and-Dirty Database Schema is a Ticking Time Bomb

3 Common Misconceptions Fintech Founders Have About Engineering Teams

Postman Alternative: Firecamp - Lightweight and Minimal API Testing Client

Code Smell 09 - What Should You Do With Dead Code?

No Mouse 30: A Quiet Experiment in Keyboard-First Work

Google Just Killed LeetCode: Why AlphaEvolve is the End of the "Algorithm Interview"

The "Concrete Foundation" Fallacy: Why Your Quick-and-Dirty Database Schema is a Ticking Time Bomb

3 Common Misconceptions Fintech Founders Have About Engineering Teams

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps