[GraphQL] 스키마 작성하기

Graphql 스키마 확장하기

Github Code

paullee714/graphql-study

Schema 확장하기

우리가 가진 Schema, Resolver

type Query{
    name: String!
}

// resolve query
const resolvers = {
    Query : {
        name: () => "wool"
    }
};

export default resolvers

위의 Query와 Resolver는 name : String 을 돌려주는 형태이다

여러 데이터들을 담고 읽기 위해서 Schema를 확장 해 보자

schema.graphql

schema를 확장해 준다.

type Person {
    id:Int!
    name: String!
    age: Int!
    gender: String!
}

type Query{
    people : [Person]!
        person(id:Int!):Person
}

• 데이터의 유형을 하나 더 선언했다 → Person
• Person은 id, name, age, gender를 가지는 객체이다
• Query에서 people을 호출하면, Array에 담긴 Person이 리턴된다
• person에 id를 담아 호출하면, 해당하는 id를 가진 Person이 리턴된다. → 없을 수도 있기 떄문에 ! 없음

임시 DB생성

dummy data가 필요해서 생성했다 > https://www.generatedata.com/#t1

db를 넣을 js파일을 생성했다. db내에 dummy.js를 만들었다.

export const people = [
    {
        "id": 1,
        "name": "Jenna",
        "age": 30,
        "gender": "male"
    },
....
    {
        "id": 100,
        "name": "Mari",
        "age": 24,
        "gender": "male"
    }
]

resolvers.js 수정

import  {people}  from "../db/dummy"

// resolve query
const resolvers = {
    Query : {
        people: () => people
    }
};

export default resolvers

Query 테스트

localhost:4000에 접속해서 쿼리에 원하는 컬럼을 넣으면 return받아온다.

query{
  people{
    age
    name
    id
    gender
  }
}

Query에 인자 넣고 받아오기

getById

흔히 말하는 id(index)를 가지고 사람을 불러오려고 한다

dummy data가 들어있는 javascript파일 가장 아래에 추가 해 준다

export const getById = id =>{
    const filteredPeople = people.filter(person => person.id === id);
    return filteredPeople[0]
}

resolvers.js 수정

import  {people, getById}  from "../db/dummy"

// resolve query
const resolvers = {
    Query : {
        people: () => people,
        *person:(_, {id}) => getById(id)*
    }
};

export default resolvers

• person:(_, {id}) => getById(id) 를 추가 해 준다

Query에 인자 전달받기

• graphql 의 쿼리를 보면 아래와같이 persion(id:Int!)가 되어있다

type Person {
    id:Int!
    name: String!
    age: Int!
    gender: String!
}

type Query{
    people : [Person]!
    person(id: Int!): Person
}

즉, person쿼리는 int 변수가 필수적으로 들어와야 하고, 해당하는 id에 맞는 Persion이 return되는 것이다

localhost:4000에서 쿼리 테스트를 해보자!

query {
  person(id: 2) {
    id
    name
    age
  }
}