Required fields with non-null (!) in GraphQL - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to make the name field required in this GraphQL type.

GraphQL

type User {
  id: ID!
  name: String[1]
  age: Int
}

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

A!

B?

D$

Attempts:

3 left

💡 Hint

Common Mistakes

Using a question mark ? which is not valid in GraphQL.

Leaving the field without any symbol, making it optional.

In GraphQL, adding an exclamation mark ! after a type makes the field required (non-null).

2fill in blank

medium

Complete the code to make the email field required and of type Email.

GraphQL

type User {
  id: ID!
  email: Email[1]
}

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

B!

C?

D$

Attempts:

3 left

💡 Hint

Common Mistakes

Leaving the field optional by not adding !.

Using invalid symbols like ? or $.

Adding ! after the type makes the email field required (non-null).

3fill in blank

hard

Fix the error in this GraphQL input type by making the password field required.

GraphQL

input LoginInput {
  username: String!
  password: String[1]
}

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

B!

C?

D#

Attempts:

3 left

💡 Hint

Common Mistakes

Leaving the field optional by missing !.

Using invalid symbols like ? or #.

The password field needs an exclamation mark ! to be required (non-null).

4fill in blank

hard

Fill both blanks to make title and content fields required in this GraphQL type.

GraphQL

type Post {
  id: ID!
  title: String[1]
  content: String[2]
}

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

A!

B?

D$

Attempts:

3 left

💡 Hint

Common Mistakes

Using different symbols for each field.

Leaving one or both fields optional by missing !.

Adding ! after the type makes both title and content required fields.

5fill in blank

hard

Fill all three blanks to make username, email, and age required fields in this GraphQL input type.

GraphQL

input RegisterInput {
  username: String[1]
  email: String[2]
  age: Int[3]
}

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

A!

B?

D#

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing symbols or leaving some fields optional.

Using invalid symbols like ? or #.

All three fields need ! to be required (non-null) in GraphQL input types.

Practice

1. What does adding ! after a field type in GraphQL schema mean?

easy

A. The field is required and cannot be null

B. The field is optional and can be null

C. The field is deprecated

D. The field is a list type

Solution

1. Step 1: Understand the role of ! in GraphQL

   In GraphQL, adding ! after a type means the field is non-nullable, so it must have a value.

2. Step 2: Interpret the meaning for data completeness

   This means the field is required and cannot be left empty or null, ensuring data completeness.

3. Final Answer:

   The field is required and cannot be null -> Option A

4. Quick Check:

   Non-null ! means required = C [OK]

Hint: Remember: ! means must have a value, no null allowed [OK]

Common Mistakes:

• Thinking ! means optional
• Confusing ! with list type
• Assuming ! marks deprecated fields

2. Which of the following is the correct syntax to declare a required string field named name in GraphQL?

easy

A. name: String

B. name!: String

C. name: !String

D. name: String!

Solution

1. Step 1: Recall GraphQL syntax for required fields

   In GraphQL, to make a field required, you add ! after the type, not before the type or after the field name.

2. Step 2: Match the correct syntax

   The correct syntax is name: String! meaning the field name is a non-null string.

3. Final Answer:

   name: String! -> Option D

4. Quick Check:

   Required field syntax = type + ! after type [OK]

Hint: Put ! right after the type, never before field name [OK]

Common Mistakes:

• Placing ! before the type
• Adding ! after the field name
• Omitting ! for required fields

3. Given this GraphQL type definition:

type User {
  id: ID!
  email: String!
  phone: String
}

Which of these queries will cause an error if email is missing in the data?

medium

A. Query requesting only phone

B. Query requesting id and phone only

C. Query requesting id and email

D. Query requesting only id

Solution

1. Step 1: Identify required fields in the type

   The fields id and email are marked with !, so they must not be null or missing.

2. Step 2: Analyze queries requesting email

   If the data is missing email, any query requesting it will cause an error because it's required.

3. Final Answer:

   Query requesting id and email -> Option C

4. Quick Check:

   Requesting missing required field causes error = A [OK]

Hint: Queries asking for missing required fields cause errors [OK]

Common Mistakes:

• Assuming optional fields cause errors if missing
• Ignoring ! meaning required
• Thinking missing required fields return null

4. Consider this GraphQL schema snippet:

type Product {
  id: ID!
  name: String!
  description: String
}

Which change fixes the error when a query returns null for name?

medium

A. Add ! to description field

B. Remove ! from name field

C. Change id type to ID without !

D. Rename name field to title

Solution

1. Step 1: Understand the error cause

   The error occurs because name is required (String!) but the query returns null, violating the non-null rule.

2. Step 2: Fix by making name optional

   Removing ! from name allows it to be null, fixing the error.

3. Final Answer:

   Remove ! from name field -> Option B

4. Quick Check:

   Null returned for required field? Remove ! [OK]

Hint: If null causes error, remove ! to allow optional [OK]

Common Mistakes:

• Adding ! to optional fields instead of removing
• Changing unrelated fields
• Renaming fields without fixing null issue

5. You have this GraphQL input type:

input NewUserInput {
  username: String!
  email: String!
  phone: String
}

You want to ensure phone is also required but keep it optional for some mutations. How can you design this?

hard

A. Create two input types: one with phone: String! and one with phone: String

B. Add ! to phone in the existing input type

C. Remove ! from username and email

D. Make all fields optional by removing all !

Solution

1. Step 1: Understand requirement for conditional field requirement

   You want phone required in some cases but optional in others, so a single input type cannot express both.

2. Step 2: Use multiple input types for flexibility

   Creating two input types--one with phone: String! and one with phone: String--lets you choose which to use per mutation.

3. Final Answer:

   Create two input types: one with phone: String! and one with phone: String -> Option A

4. Quick Check:

   Use multiple input types for conditional required fields [OK]

Hint: Use separate input types to toggle required fields flexibly [OK]

Common Mistakes:

• Trying to toggle ! dynamically in one input type
• Removing required from always required fields
• Making all fields optional losing data integrity