Defining Input Types and Return Values in GraphQL Mutations

1. Introduction

This tutorial will guide you through defining input types and return values for GraphQL mutations, which is the process of sending data to the server. We will focus on ensuring type safety in your mutations through proper type definitions.

By the end of this tutorial, you will learn how to:

• Define input types for your GraphQL mutations
• Define return types for your GraphQL mutations
• Ensure type safety in your mutations

Prerequisites:
- Basic understanding of GraphQL
- Familiarity with JavaScript

2. Step-by-Step Guide

GraphQL mutations require you to specify both the data you'll be sending (input) and the data you'll receive in response (return value). Defining these types ensures that your server knows exactly what data to expect and return, providing a layer of type safety.

Input Types:

Input types are special kind of objects in GraphQL. They are defined in the schema and are used to collect data from the client.

input MessageInput {
  content: String
  author: String
}

In this example, MessageInput is an input type that expects a content and an author, both of which are strings.

Return Types:

The return type defines what the client can expect to receive after the mutation is processed. This is also defined in the schema.

type Message {
  id: ID!
  content: String
  author: String
}

In this example, Message is a return type that will return an id, content, and author.

3. Code Examples

Example 1: Defining Input Types

input BookInput {
  title: String!
  author: String!
  publishedYear: Int!
}

mutation CreateBook($input: BookInput!) {
  createBook(input: $input) {
    id
    title
    author
  }
}

In this example, we defined a BookInput input type and used it in our createBook mutation. The ! after BookInput means that this input cannot be null.

Example 2: Defining Return Types

type Book {
  id: ID!
  title: String!
  author: String!
  publishedYear: Int!
}

mutation CreateBook($input: BookInput!) {
  createBook(input: $input) {
    id
    title
    author
    publishedYear
  }
}

In this example, we defined a Book return type. After the createBook mutation is processed, it will return a Book object with id, title, author, and publishedYear.

4. Summary

In this tutorial, we've learned how to define input types and return types in GraphQL mutations. Defining these types ensures type safety in your mutations, making your code more predictable and easier to debug.

To continue learning, you can explore how to handle errors in GraphQL mutations, or how to use variables in your mutations.

5. Practice Exercises

Exercise 1:

Define an input type StudentInput that expects a name (string), age (integer), and grade (string).

Exercise 2:

Define a mutation createStudent that uses the StudentInput type and returns a Student object.

Exercise 3:

Define a return type Student that includes an id (ID), name (string), age (integer), and grade (string).

Solutions:

1. StudentInput Definition:

input StudentInput {
  name: String!
  age: Int!
  grade: String!
}

1. createStudent Mutation:

mutation createStudent($input: StudentInput!) {
  createStudent(input: $input) {
    id
    name
    age
    grade
  }
}

1. Student Return Type:

type Student {
  id: ID!
  name: String!
  age: Int!
  grade: String!
}