Saleor exposes the GraphQL Playground, an interactive GraphQL editor, allowing access to your Saleor instance's API through the web browser. The Playground lets you quickly familiarize yourself with the API, perform example operations, and send your first queries and mutations.
The UI consists of three main sections:
The operation input section.
It allows you to type GraphQL operations (queries, mutations) to execute the API of your Saleor instance. The instance URL is specified at the top. This section comes with autocompletion to conveniently suggest operation names and their parameters as you type.
The result section.
The result section simply shows the result of the GraphQL operation.
The sidebar with docs & schema.
The sidebar becomes available after clicking the docs or the schema labels. The docs provide a quick way to find a GraphQL operation available in the Saleor API. The schema provides a more structured description of the available types. It can be used to auto-generate your client interface.
To view and try out the Playground instance of Saleor's demo store, visit the Saleor Demo Playground.
For more information, visit the Playground GitHub page.
To run queries as the authenticated user, you need to add headers to your request. The headers section is located at the bottom left side of the Playground. To read more, how to get auth tokens, read User documentation.
Inspectors for browsers
- You can learn about Saleor API by interacting with Dashboard or Next.js Storefront and observing requests using browser extensions:
GraphQL Code Generation can automate creation of GraphQL requests, typings and more. You can use React Storefront for reference on how to configure codegen in a Typescript project, but similar setup can be achieved in other languages.