Connection pattern (edges, nodes, pageInfo) in GraphQL - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to query the list of nodes in a connection.

GraphQL

query { users { [1] { id name } } }

Drag options to blanks, or click blank then click option'

Anodes

Bedges

CpageInfo

Dinfo

Attempts:

3 left

💡 Hint

Common Mistakes

Using edges instead of nodes when only items are needed.

Trying to query pageInfo for items.

The nodes field directly returns the list of items in the connection.

2fill in blank

medium

Complete the code to get the cursor for each edge in a connection.

GraphQL

query { posts { edges { [1] node { title } } } }

Drag options to blanks, or click blank then click option'

Acursor

Bid

CpageInfo

Dnodes

Attempts:

3 left

💡 Hint

Common Mistakes

Trying to get cursor from node instead of edge.

Using id as cursor.

The cursor field on each edge is used for pagination.

3fill in blank

hard

Fix the error in the query to get pageInfo's hasNextPage field.

GraphQL

query { comments { pageInfo { [1] } } }

Drag options to blanks, or click blank then click option'

Acursor

Bedges

ChasNextPage

Dnodes

Attempts:

3 left

💡 Hint

Common Mistakes

Trying to query nodes or edges inside pageInfo.

Using cursor inside pageInfo.

The hasNextPage field inside pageInfo tells if more pages exist.

4fill in blank

hard

Fill both blanks to query edges with cursor and node id.

GraphQL

query { products { edges { [1] node { [2] } } } }

Drag options to blanks, or click blank then click option'

Acursor

Bname

Cid

DpageInfo

Attempts:

3 left

💡 Hint

Common Mistakes

Putting pageInfo inside edges.

Using name instead of id inside node.

Edges have cursor and node. Inside node, id is a common field.

5fill in blank

hard

Fill all three blanks to query nodes with id and name, and pageInfo hasNextPage.

GraphQL

query { employees { [1] { id name } [2] { [3] } } }

Drag options to blanks, or click blank then click option'

Anodes

BpageInfo

ChasNextPage

Dedges

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing edges and nodes incorrectly.

Querying hasNextPage outside pageInfo.

Use nodes for items, pageInfo for pagination info, and inside pageInfo query hasNextPage.