Developing GraphQL Queries Using pos-cli gui
This guide will help you quickly develop GraphQL queries using the
pos-cli gui serve command.
pos-cli gui serve command is very useful when:
You are developing a new query and you want to be sure it is working - it communicates with the database directly, so you are eliminating errors stemming from other layers and features of the system.
You are debugging an error - because you have direct control over a query and instant feedback after your changes, you can strip everything that you don't need, manipulate arguments passed, etc.
So that you can follow the steps in this tutorial, you have to have the pos-cli installed, an environment configured, and the codebase set up. You should be familiar with Pages, and the technologies behind platformOS, especially Liquid.
- Quickstart Guide or Get Started tutorials: help you get access to our platform, set up a site, install the pos-cli, set up the required directory structure, and deploy to your site.
Developing GraphQL queries using pos-cli gui is a two-step process:
Step 1: Start pos-cli gui serve
pos-cli gui serve staging Server is listening on 3333 Resources Editor: http://localhost:3333/gui/editor GraphQL Browser: http://localhost:3333/gui/graphql
staging with the environment name you want to develop on. To list all available environments use
pos-cli env list
Step 2: Write / update query
To write your query go to the second link: http://localhost:3333/gui/graphql
You will be greeted with the graphiql editor.
- On the right side, you can open sidebar with graphql schema documentation.
- When you don't know what to type, try pressing
ctrl + space- this will open the suggestion box and usually help you decide.
- To quickly run the query, press
ctrl + enter(or
cmd + enteron a Mac).
- To pass arguments to a query, open
Query variablespanel on the bottom and write them in JSON format (see image above)