Day05: GraphQL - Types and Schema wiht node.js

把 Day04 建置好的繼續玩下去:)

1. Query types and fields

把 schema.js and index.js 加工
可以更加瞭解 GraphQL 整個的港絕~

index.js

 import express from 'express';
 import graphqlHTTP from 'express-graphql';
 import schema from './schema';

 const app = express();

 app.get('/', (req, res) => {
     res.send("GraphQL is amazing");
 });

 const root = { friend: () => {
     return {
         "id": 123456, 
         "firstName": "Marry",
         "lastName": "Henri",
         "Gender": "Male",
         "language": "English",
         "emails": [
             { email: "graphql@graphql.com"}, 
             { email: "graphql2@graphql.com"}]
     }
 }};

 app.use("/graphql", graphqlHTTP({
     schema: schema,
     rootValue: root,
     graphiql: true,
 }))

 app.listen(8080, ()=> console.log("Running server on port localhost:8080/graphql"));

schema.js

下面 emails: ! 代表必寫

import { buildSchema } from 'graphql';

const schema = buildSchema(`
    type Friend{
        id: ID
        firstName: String
        lastName: String
        gender: String
        language: String
        emails: [Email]!
    }

    type Email {
        email: String
    }

    type Query{
        friend: Friend
    }
`)

export default schema;

2. Query and Mutation types

把 schema.js and index.js 再次加工

index.js

 import express from 'express';
 import graphqlHTTP from 'express-graphql';
 import schema from './schema';

 const app = express();

 app.get('/', (req, res) => {
     res.send("GraphQL is amazing");
 });

 class Friend {
     constructor(id, {firstName, lastName, gender, language, email}){
         this.id = id;
         this.firstName = firstName;
         this.lastName = lastName;
         this.gender= gender;
         this.language = language;
         this.email = email;

     }
 }

 const friendDatabase = {}

 const root = {
     friend: () => {
         return {
             "id": 123456,
             "firstName": "Marry",
             "lastName": "Henri",
             "Gender": "Male",
             "language": "English",
             "emails": [
                 { email: "graphql@graphql.com" },
                 { email: "graphql2@graphql.com" }
             ],
         }
     },

     createFriend: ({input}) => {
         let id = require('crypto').randomBytes(10).toString('hex'); // random create id
         friendDatabase[id] = input;
         return new Friend(id, input);
     },
 };

 app.use("/graphql", graphqlHTTP({
     schema: schema,
     rootValue: root,
     graphiql: true,
 }))

 app.listen(8080, () => console.log("Running server on port localhost:8080/graphql"));
 import express from 'express';
 import graphqlHTTP from 'express-graphql';
 import schema from './schema';

 const app = express();

 app.get('/', (req, res) => {
     res.send("GraphQL is amazing");
 });

 class Friend {
     constructor(id, {firstName, lastName, gender, language, email}){
         this.id = id;
         this.firstName = firstName;
         this.lastName = lastName;
         this.gender= gender;
         this.language = language;
         this.email = email;

     }
 }

 const friendDatabase = {}

 const root = {
     friend: () => {
         return {
             "id": 123456,
             "firstName": "Marry",
             "lastName": "Henri",
             "Gender": "Male",
             "language": "English",
             "emails": [
                 { email: "graphql@graphql.com" },
                 { email: "graphql2@graphql.com" }
             ],
         }
     },

     createFriend: ({input}) => {
         let id = require('crypto').randomBytes(10).toString('hex'); // random create id
         friendDatabase[id] = input;
         return new Friend(id, input);
     },
 };

 app.use("/graphql", graphqlHTTP({
     schema: schema,
     rootValue: root,
     graphiql: true,
 }))

 app.listen(8080, () => console.log("Running server on port localhost:8080/graphql"));

schema.js

 import { buildSchema } from 'graphql';

 const schema = buildSchema(`
       type Friend{
           id: ID
           firstName: String
           lastName: String
           gender: String
           language: String
           email: String
       }

       type Query{
           friend: Friend
       }

       input FriendInput{
         id: ID
         firstName: String!
         lastName: String
         gender: String
         language: String
         email: String
       }

       type Mutation{
           createFriend(input: FriendInput): Friend
       }
 `)

 export default schema;

去看一下自己寫的然後塞入資料看看:

重構一下

新增一個 resolvers.js

 class Friend {
     constructor(id, {firstName, lastName, gender, language, email}){
         this.id = id;
         this.firstName = firstName;
         this.lastName = lastName;
         this.gender= gender;
         this.language = language;
         this.email = email;

     }
 }

 const friendDatabase = {}

 const resolvers = {

     getFriend: ({ id }) => {
         return new Friend(id, friendDatabase[id]);
     },

     createFriend: ({input}) => {
         let id = require('crypto').randomBytes(10).toString('hex'); // random create id
         friendDatabase[id] = input;
         return new Friend(id, input);
     },
 };

 export default resolvers;

schema.js

 import { buildSchema } from 'graphql';

 const schema = buildSchema(`
       type Friend{
           id: ID
           firstName: String
           lastName: String
           gender: String
           language: String
           email: String
       }

       type Query{
           getFriend(id: ID): Friend
       }

       input FriendInput{
         id: ID
         firstName: String!
         lastName: String
         gender: String
         language: String
         email: String
       }

       type Mutation{
           createFriend(input: FriendInput): Friend
       }
 `)

 export default schema;

index.js

  import express from 'express';
  import graphqlHTTP from 'express-graphql';
  import schema from './schema';
  import resolvers from './resolvers';

  const app = express();

  app.get('/', (req, res) => {
      res.send("GraphQL is amazing");
  });

  const root = resolvers;

  app.use("/graphql", graphqlHTTP({
      schema: schema,
      rootValue: root,
      graphiql: true,
  }))

  app.listen(8080, () => console.log("Running server on port localhost:8080/graphql"));