Enhance your Strapi Admin Interface with Apollo Sandbox, an alternative GraphQL Explorer. Simplify development and testing of GraphQL queries and mutations directly within the Strapi Admin Interface. Explore your API schema, test queries in real-time, and iterate faster with this powerful plugin.
\n \n \n![](\"https://raw.githubusercontent.com/creazy231/strapi-plugin-apollo-sandbox/main/media/screenshot.jpeg\")
\n\n---\n\n## 💭 Motivation\n\n_There already is a GraphQL Playground plugin for Strapi, why do I need Apollo Sandbox?_ Well, the current Playground just doesn't provide a good developer experience in my opinion. Apollo Sandbox is a great alternative to the GraphQL Playground with an awesome developer experience. That's why I created this plugin.\n\n## ⏳ Installation\n\nInstall the plugin in your Strapi project.\n\n```bash\n# using yarn\nyarn add @creazy231/strapi-plugin-apollo-sandbox\n\n# using npm\nnpm install @creazy231/strapi-plugin-apollo-sandbox --save\n```\n\nAfter successful installation, you've to build a fresh package. To archive that simply use:\n\n```bash\nyarn build && yarn develop\n# or\nnpm run build && npm run develop\n```\n\nThe Apollo Sandbox plugin should appear in the Plugins section of Strapi sidebar after you run the app again.\n\n## 🔧 Configuration\n> [!IMPORTANT]\n> This plugin requires the **graphql plugin** and its **playground** to be **enabled**. You can enable it in the `./config/plugins.ts` file in your Strapi project.\n> You also need to modify the `./config/middlewares.ts` file and replace `strapi::security` with the following:\n\n```javascript\nexport default [\n // ...\n {\n name: \"strapi::security\",\n config: {\n contentSecurityPolicy: {\n directives: {\n \"frame-src\": [ \"http://localhost:*\", \"self\", \"sandbox.embed.apollographql.com\" ],\n },\n },\n },\n },\n // ...\n]\n```\n\nAfter the modification, your file should look like this:\n```javascript\nexport default [\n \"strapi::errors\",\n {\n name: \"strapi::security\",\n config: {\n contentSecurityPolicy: {\n directives: {\n \"frame-src\": [ \"http://localhost:*\", \"self\", \"sandbox.embed.apollographql.com\" ],\n },\n },\n },\n },\n \"strapi::cors\",\n \"strapi::poweredBy\",\n \"strapi::logger\",\n \"strapi::query\",\n \"strapi::body\",\n \"strapi::session\",\n \"strapi::favicon\",\n \"strapi::public\",\n];\n```\n\n### 🛠️ Plugin Configuration\nConfig can be changed in the `./config/plugins.ts` file in your Strapi project. You can overwrite the config like so:\n\n```javascript\nexport default {\n // ...\n \"graphql\": {\n enabled: true,\n config: {\n // set this to true if you want to enable the playground in production\n playgroundAlways: false,\n },\n },\n \"apollo-sandbox\": {\n // enables the plugin only in development mode\n // if you also want to use it in production, set this to true\n // keep in mind that graphql playground has to be enabled\n enabled: process.env.NODE_ENV === \"production\" ? false : true,\n config: {\n // endpoint: \"https://tunneled-strapi.com/graphql\", // OPTIONAL - endpoint has to be accessible from the browser\n }\n },\n // ...\n};\n```\n`endpoint` configuration is **optional**. If you don't provide it, the plugin will create a tunnel of your Strapi instance. This is useful if you're developing locally but still want to use the Apollo Sandbox plugin. You can still provide your own tunneled endpoint if you want to.\n\n## 🖐 Requirements\nComplete installation requirements are exact same as for Strapi itself and can be found in the documentation under Installation Requirements.\n\nSupported Strapi versions:\n\n- Strapi v4.x.x\n\nNode / NPM versions:\n\n- NodeJS >= 14.21 < 19\n- NPM >= 7.x\n\nWe recommend always using the latest version of Strapi to start your new projects.\n\n## 🤝 Contributing\nFeel free to fork and make a Pull Request to this plugin project. All the input is warmly welcome!\n\n## ⭐️ Show your support\nGive a star if this project helped you.\n\n\n ![\"Support](\"https://storage.ko-fi.com/cdn/brandasset/kofi_button_stroke.png\")
\n\n\n## 🔗 Links\n- [NPM package](https://www.npmjs.com/package/@creazy231/strapi-plugin-apollo-sandbox)\n- [GitHub repository](https://github.com/creazy231/strapi-plugin-apollo-sandbox)\n\n## 🌎 Community support\n- For general help using Strapi, please refer to [the official Strapi documentation](https://strapi.io/documentation/).\n- You can contact me on the Strapi Discord [channel](https://discord.strapi.io/) or on Twitter.\n\n## License\nMIT License Copyright (c) 2023 creazy231.\n","readmeFilename":"README.md"}![\"NPM](\"https://img.shields.io/npm/v/@creazy231/strapi-plugin-apollo-sandbox/latest.svg\")
\n ![\"Monthly](\"https://img.shields.io/npm/dm/@creazy231/strapi-plugin-apollo-sandbox\")
\n ![\"PRs](\"https://img.shields.io/badge/Pull_Request-Welcome-brightgreen.svg\"){kind=icon}
\n ![\"Repo](\"https://img.shields.io/github/stars/creazy231/strapi-plugin-apollo-sandbox?color=white&label=Github)
\n ![\"Support](\"https://img.shields.io/badge/Support_me-on_Ko--fi_☕-43D7AA\"){kind=icon}
\n