GraphQL vs REST comparison - Interactive Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to define a GraphQL query that fetches a user's name.

GraphQL

query { user(id: "1") { [1] } }

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

Apassword

Bname

Cemail

Daddress

Attempts:

3 left

💡 Hint

Common Mistakes

Using fields like email or password instead of name.

The field name is used to fetch the user's name in GraphQL queries.

2fill in blank

medium

Complete the code to specify the HTTP method used by REST to retrieve data.

GraphQL

fetch('/api/users', { method: '[1]' })

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

AGET

BDELETE

CPUT

DPOST

Attempts:

3 left

💡 Hint

Common Mistakes

Using POST or PUT instead of GET for data retrieval.

REST uses the GET method to retrieve data from the server.

3fill in blank

hard

Fix the error in the GraphQL query to fetch a user's email.

GraphQL

query { user(id: "1") { [1] } }

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

Aemail

Bmail

CuserEmail

Demails

Attempts:

3 left

💡 Hint

Common Mistakes

Using plural or incorrect field names like emails or mail.

The correct field to fetch a user's email in GraphQL is email.

4fill in blank

hard

Fill both blanks to complete the REST API call that updates a user's name.

GraphQL

fetch('/api/users/1', { method: '[1]', body: JSON.stringify({ name: '[2]' }) })

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

APUT

BJohn

CGET

DDELETE

Attempts:

3 left

💡 Hint

Common Mistakes

Using GET or DELETE instead of PUT for updates.

REST uses PUT to update data, and the new name is John.

5fill in blank

hard

Fill all three blanks to complete a GraphQL mutation that updates a user's email.

GraphQL

mutation { updateUser(id: "1", input: { [1]: "[2]" }) { [3] } }

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

Aemail

[e-mail]

Dname

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong field names or returning the wrong field.

The mutation updates the email field with the new email and returns the updated email.