Using The Graph Playground

In this post, I show you how to query data using The Graph playground. My goal is to get you to understand it from a non-technical perspective.

I’ll be demonstrating with the PoolTogether subgraph.

There are three areas that make up The Graph playground:

• On the left-hand side is where you write your GraphQL query.
• The middle is the indexed data it returns from the graph node.
• The right-hand side is the subgraph schema.

Fig 1 — PoolTogether subgraph

Subgraph Schema

In fig 2, I show you the schema of the PoolTogether subgraph. Think of the schema as an instruction manual on where to find all the data you can query from the subgraph. I created a different post where I talked about what a subgraph schema is.

Fig 2— PoolTogether subgraph schema

Clicking on Draw in Fig 2, shows me the fields we can query. Think of Draw as a content inside the instruction manual and inside this content you’ll find several like fields we can query like id, drawID, feeBeneficiary, winnings, secretHash. These fields will all return data when you query them. Fig 3 shows the fields you can query from Draw.

This will make a lot more sense when we write the queries. I’ve color coded them, so you see how it all relates.

Fig 3— Contents of Draw

Query

The query is how you get those data from the instruction manual. It is written in GraphQL.

Fig 4— PoolTogether subgraph example query

I explain below, what each line of code means.

draws{ — curly braces opens or navigate into the content (Draw)
id — field inside the content (Draw)
secretHash — field inside the content (Draw)
winner — field inside the content (Draw)
rewardedAt — field inside the content (Draw)
winnings — field inside the content (Draw)
} — closes or navigate out of the content (Draw)
(first: 5) — Think of this as a way to filter or sort the data you want to receive from that content (Draw) in the instruction manual.

Posting this example query returns only the data you requested as we can see in Fig 5. It returns only the first 5 records of content(Draw) with the 5 fields we requested. Feel free to run this query in the Graph playground.

Fig 5— Indexed Data

Additional Resources

Visit the GraphQL website to learn more.

The Graph docs

If you have any questions, email me: jerrycreative@live.co.uk