Super Simple GraphQL with Node(part 2)

Published in

Devnetwork

5 min readSep 14, 2019

I have continued my previous blog where I have discussed on GraphQL query. In this, we will be continuing with Mutation. I will be updating my code in the same repo that we have done in the previous blog.

Now let us have a short revision about what we have done in the previous blog. We have created an array of employees. Each employee contains id, name, and email. We have used GraphQL query to fetch the list of employees and employees by id.

Let us use GraphQL mutation to create a new employee in the employee list and update the employee by id.

Previously we had the schema.js file:

//schema
const { 
  GraphQLObjectType, 
  GraphQLString,GraphQLSchema,     
  GraphQLInt,
  GraphQLList, 
} = require('graphql');  
const employees = [     
  {         
    id: 1,         
    name: 'John',         
    email: 'john@test.com'     
  },     
  {         
    id: 2,         
    name: 'Sunam',         
    email: 'sunam@test.com'     
  },     
  {         
    id: 3,         
    name: 'Rushabh',         
    email: 'rushabh@test.com'     
   }
];  
const EmployeeType = new GraphQLObjectType({     
   name: 'Employee',     
   fields: () => ({         
     id: {type: GraphQLInt},         
     name: {type: GraphQLString},         
     email: {type: GraphQLString}     
   }) 
});  
const RootQuery = new GraphQLObjectType({     
   name: 'RootQueryType',     
   fields: {         
    employee: {             
      type: EmployeeType,             
      args: {                 
        id: {type: GraphQLInt}             
      },             
      resolve(parentValue, args) {                 
        for(let i=0; i<employees.length; i++) {                    
          if(employees[i].id == args.id) {                        
            return employees[i];                     
          }                 
        }             
      }         
     } 
     employees: { 
      type: new GraphQLList(),
      args: {},
      resolve() { 
        return employees
      }
    }    
   } 
});  
module.exports = new GraphQLSchema({ query: RootQuery });

Let’s import required GraphQL methods that will be used for mutation in schema.js file.

const { 
  GraphQLObjectType,
  GraphQLString,
  GraphQLSchema,
  GraphQLInt,
  GraphQLList,
  GraphQLNonNull,
  GraphQLInputObjectType,
} = require('graphql');

I have added GraphQLNonNull and GraphQLInputObjectType.

GraphQLNonNull: This will be used to validate required field in employee.

GraphQLInputObjectType: This will be used to define the schema for the employee fields for creating new employee which also will validate the employee data sent in create and update request.

Now we will be defining input schema for employee which defines rule for each employee field that is sent for creating new employee.

const EmployeeInputTypes = new GraphQLInputObjectType({
  name: 'EmployeeInput',
  fields: {
    name: { type: new GraphQLNonNull(GraphQLString) },
    email: { type: new GraphQLNonNull(GraphQLString) },
  }
});

Above schema validates against the data provided by the client for creating new employee. If data provided do not match according to our schema then it response back with suitable message.

Defining Root mutation

We will be defining root mutation where we will be adding `addEmployee` resolver which will create new employee in Employees array.

Let’s add some code in our schema.js file for creating new employee using mutation.

const RootMutation = new GraphQLObjectType({
  name: 'RootMutationType',
  fields: {
    addEmployee: {
      type: EmployeeType,
      args: {
        data:{
          name: 'data',
          type: new GraphQLNonNull(EmployeeInputTypes)
        }
      },
     resolve(root, params, options) {
       const data = { ...params.data };
       data.id = employees.length + 1;
       employees.push(data);
       return data;
     }
   }
  }
});module.exports = new GraphQLSchema({
  query: RootQuery,
  mutation: RootMutation,
});

Now, let’s create new employee

After we have created new employee let’s check list of employee for newly added employee

We can see the new created employee in the list. Now let’s add one more function to the root mutation which will update the employee information by id.

updateEmployee: {
  type: EmployeeType,
  args: {
      id: { type: new GraphQLNonNull(GraphQLInt) },
      data: {
        name: 'data',
        type: new GraphQLNonNull(EmployeeInputTypes)
      }
  },
  resolve (root, params, options) {
    const data = { ...params.data }
    employees.map(employee => {
      if (params.id === employee.id) {
        employee.name = data.name;
        employee.email = data.email;
      }
    });
  data.id = params.id;
  return data;
 }
}

Update request sent using GraphiQL to update employee detail by id. We have updated the name of the employee using the id of the employee.

Here is full code in schema.js file after updating the mutation code.

const {
  GraphQLObjectType,
  GraphQLString,
  GraphQLSchema,
  GraphQLInt,
  GraphQLList,
  GraphQLNonNull,
  GraphQLInputObjectType,
} = require('graphql');const employees = [
  {
    id: 1,
    name: 'John',
    email: 'john@test.com',
  },
  {
    id: 2,
    name: 'Sunam',
    email: 'sunam@test.com',
  },
  {
    id: 3,
    name: 'Rushab',
    email: 'rushab@test.com',
  }
]const EmployeeType = new GraphQLObjectType({
  name: 'Employee',
  fields: () => ({
    id: { type: GraphQLInt },
    name: { type: GraphQLString },
    email: { type: GraphQLString },
  })
});const EmployeeInputTypes = new GraphQLInputObjectType({
  name: 'EmployeeInput',
  fields: {
    name: { type: new GraphQLNonNull(GraphQLString) },
    email: { type: new GraphQLNonNull(GraphQLString) },
  }
});const RootQuery = new GraphQLObjectType({
  name: 'RootQueryType',
  fields: {
    employee: {
      type: EmployeeType,
      args: {
        id: { type: GraphQLInt }
      },
    resolve(parentValue, args) {
      for(let i=0; i < employees.length; i++) {
        if(employees[i].id === args.id) {
          return employees[i];
        }
      }
    }
   },
  employees: {
    type: new GraphQLList(EmployeeType),
    args: { },
    resolve() {
      return employees;
    }
   }
  }
});const RootMutation = new GraphQLObjectType({
name: 'RootMutationType',
fields: {
  addEmployee: {
    type: EmployeeType,
    args: {
      data:{
        name: 'data',
        type: new GraphQLNonNull(EmployeeInputTypes)
      }
    },
    resolve(root, params, options) {
      const data = { ...params.data };
      data.id = employees.length + 1;
      employees.push(data);
      return data;
    }
  },
  updateEmployee: {
    type: EmployeeType,
    args: {
      id: { type: new GraphQLNonNull(GraphQLInt) },
        data: {
          name: 'data',
          type: new GraphQLNonNull(EmployeeInputTypes)
        }
    },
    resolve (root, params, options) {
      const data = { ...params.data }
      employees.map(employee => {
        if (params.id === employee.id) {
          employee.name = data.name;
          employee.email = data.email;
        }
      });
      data.id = params.id;
      return data;
    }
   }
  }
});module.exports = new GraphQLSchema({
  query: RootQuery,
  mutation: RootMutation,
});

Conclusion

In this blog, we have learned how we can use GraphQL mutation for creating new employee and updating the existing employee.
My next blog will be focused on GraphQL subscription for real-time data change till then happy coding!!

Here is the link for the github repo where you can find all above code.

Super Simple GraphQL with Node(part 2)

Defining Root mutation

Conclusion

Written by john sunam