Last updated Aug 16, 2023

Rate this page:

Using the AGG Playground

The AGGS Playground offers syntax highlighting, intellisense autocompletion, automatic documentation, and much more.

The UI is divided into three pieces:

  • The left sidebar has buttons to open plugin panes and change settings
  • The left side is where you write your queries
  • The right side is where the results of your queries will be displayed

The left sidebar has a top and bottom section. The top has buttons for the documentation explorer, history, query explorer, and query exporter. The bottom sidebar buttons allow you to re-fetch the schema, see the keyboard shortcuts, and change settings.

AGG Playground UI

Adding a Header

Once you have created a header for authentication you can add it to the the request in the form of JSON:

1
2
{
    "Authorization": "Basic ZW1haWw6YXBpX3Rva2Vu"
}

Adding a header to AGG Playground UI

Viewing the Docs Explorer

The Documentation Explorer provides context when it comes to what fields are available to fetch and which queries or mutations are available. Additional comments may also be provided in some instances down to the field level. The Documentation Explorer icon is located at the top left of the UI - it opens an interactive side pane where you can drill into certain types or search globally.

Search schemas globally Searching AGG Docs

Explore and drill into query response or input filter types Exploring AGG Docs

Writing a GraphQL Query

The query editor allows you manually type out a query and provides autocompletion - making quick work of creating queries. In the query editor, begin typing:

1
2
query fetchCatalog {

}

Now, inside the curly braces, Ctrl + Space (or use Shift + Space as an alternate keyboard shortcut) to bring up the autocomplete window:

Query autocomplete

From there, build out a query and execute by clicking the play button. Query results will be displayed on the right side.

Query autocomplete

The GraphQL Explorer can also be used to quickly build a query by selecting the fields to return

GraphQL Playground

Rate this page: