[Prisma] GraphQL & Prisma 연동

GraphQL과 Prisma로 연동하기

GraphQL의 Mutation을 사용해, DB를 수정하는 나만의 명령어를 만들고,

Prisma Client를 사용해 그 명령어를 실행하는 방식!

 

GraphQL이란? / 본 게시글에서 사용할 GraphQL 서버

[Node.js] GraphQL, Apollo 란? / 사용법 ( GraphQL 서버 만들기 )

 

Prisma Client란?

[Prisma] Prisma Client란? / 사용법

---

GraphQL 명령어로, DB에 데이터 추가하기

데이터를 추가하는 것 (Create) 이므로, GraphQL의 Mutation을 사용한다.

 

1. 모델에 추가한 데이터 형식에 맞게, GraphQL Schema 형식 추가하기

// GraphQL프로젝트/index.js

// ...중략

  type Book {
    id: Int!
    title: String!
    year: Int!
    genre: String
    createdAt: String!
    updatedAt: String!
  }
  
// ...중략

 

DB의 데이터 유형과 일치하도록, GraphQL Schema 유형 맞춰주기

 

Prisma와, GraphQL 데이터 유형 만들때 유의점

Prisma는 기본적으로 모든 데이터를 "필수적"으로 받아온다.

// 선택적으로 사용하고 싶은 데이터는, "?" 문구를 붙여서 사용한다.


GraphQL은 기본적으로 모든 데이터를 "선택적"으로 받아온다.

// 필수적으로 사용하고 싶은 데이터는, "!" 문구를 붙여서 사용한다.

 

2. Mutation 명령어 형식 만들기

// index.js

//... 중략

const typeDefs = gql`
  type Mutation {
    // title, year, genre를 인자로 받는 createBook 명령어를 사용할 것이라고 GraphQL에게 알려주는 것
    createBook(title: String!, year:Int!, genre: String): Book 
  }
  ...
`;

 

3. resolver로 GraphQL에 명령어 추가하기

// index.js

Mutation: {

    // createBook 명령어가 감지되면, 인자를 받아 함수로 전달한다.
    createBook: (_, { title, year, genre }) =>
    
      // PrismaClient이용해서, 전달된 인자로 새로운 Book 만들기! (return : Book)
      client.book.create({
        data: {
          title,
          year,
          genre,
        },
      }),
    ...
}

 

4. 적용한 명령어 사용하기 ( GraphQL Playground )

mutation {
  createBook(title:"명상록", year:2021, genre:"인문,고전"){
    title
    year
    genre
  }
}

/* 
  title, year는 GraphQL typeDefs에서 필수로 설정해 주었으니, 필수적으로 작성해야한다.

  createBook 명령어는, PrismaClient를 이용해 Book을 만들어 돌려주므로,
  
  {}를 사용해 만들어진 Book 내용을 확인해야한다. 
*/

Mutation을 사용해 DB에 데이터를 추가했다!

---

GraphQL 명령어로, DB 데이터 불러오기

데이터를 불러오는 것 (Read) 이므로, GraphQL의 Query를 사용한다.

 

1. Query 명령어 형식 만들기

// index.js

//... 중략

const typeDefs = gql`
  type Query {
    // Book이 여러개 들어있는 배열을 가져오는 books 명령어를 사용할것이라고 GraphQL에게 알려주는 것
    books: [Book]
    // id를 인자로 받아, 해당하는 Book을 가져오는 book 명령어를 사용할것이라고 GraphQL에게 알려주는 것
    book: (_, { id }) => client.book.findUnique({ where: { id } })
  }
  ...
`;

 

2. resolver로 GraphQL에 명령어 추가하기

// index.js

Query: {
    // PrismaClient이용해서, Book 전부다(findMany) 불러오기 (return : [Book])
    books: () => client.book.findMany()
    
    // PrismaClient이용해서, 해당하는 Book (findUnique) 불러오기 (return : [Book])
    book: (_, { id }) => client.book.findUnique({ where: { id } })
}

 

3. 적용한 명령어 사용하기 ( GraphQL Playground )

{
  books{
    title
    year
    genre
  }
}

{
  book(id:1){
    title
    year
    genre
  }
}

/* 
  title, year는 GraphQL typeDefs에서 필수로 설정해 주었으니, 필수적으로 작성해야한다.

  books, book 명령어의 응답(return) 형식은 Book 이므로, 어떤 정보를 가져오고 싶은지
  
  {} 를 사용해서 나타내 주어야 한다.
*/

Query를 사용해, DB 데이터를 불러왔다!

 

 

---

GraphQL 명령어로, DB에 데이터 삭제하기

데이터를 삭제하는 것 (Delete) 이므로, GraphQL의 Mutation을 사용한다.

 

1. Mutation 명령어 형식 만들기

// index.js

//... 중략

const typeDefs = gql`
  type Mutation {
    // id를 인자로 받는 deleteBook 명령어를 사용할 것이라고 GraphQL에게 알려주는 것
    deleteBook(id:Int!): Book 
  }
  ...
`;

 

2. resolver로 GraphQL에 명령어 추가하기

// index.js

Mutation: {

    // deleteBook 명령어가 감지되면, 인자를 받아 함수로 전달한다.
    deleteBook: (_, { id }) =>
    
      // PrismaClient이용해서, id에 해당하는 Book 삭제하기! (return : Book)
      client.book.delete({
        where: {
          id
        },
      }),
    ...
}

 

3. 적용한 명령어 사용하기 ( GraphQL Playground )

mutation {
  deleteBook(id:1){
    id
    title
    year
    genre
    ...
  }
}

/* 
  deleteBook 명령어는, PrismaClient를 이용해 Book을 만들어 돌려주므로,
  
  {}를 사용해 만들어진 Book 내용을 확인해야한다. 
*/

Mutation 사용해서 DB 데이터 삭제!

 

Query 사용해서 삭제되었는지 확인

 

---

GraphQL 명령어로, DB에 데이터 수정하기

데이터를 수정하는 것 (Update) 이므로, GraphQL의 Mutation을 사용한다.

 

1. Mutation 명령어 형식 만들기

// index.js

//... 중략

const typeDefs = gql`
  type Mutation {
    // 변경할 데이터의 id를 인자로 받는 updateBook 명령어를 사용할 것이라고 GraphQL에게 알려주는 것
    updateBook(id:Int!, title:String, year:Int, genre:String): Book
  }
  ...
`;

 

2. resolver로 GraphQL에 명령어 추가하기

// index.js

Mutation: {

    // updateBook 명령어가 감지되면, 인자를 받아 함수로 전달한다.
    updateBook: (_, { id, title, year, genre }) =>
    
      // PrismaClient이용해서, id에 해당하는 Book 수정하기! (return : Book)
      client.book.update({
        where: {
          id
        },
        data: {
          title,
          year,
          genre
        }
      }),
    ...
}

 

3. 적용한 명령어 사용하기 ( GraphQL Playground )

mutation {
  updateBook(id:1, title:"아주작은 습관의 힘", year:2020, genre:"자기계발"){
    id
    title
    year
    genre
    ...
  }
}

/* 
  updateBook 명령어는, 수정된 Book을 돌려주므로,
  
  {}를 사용해 만들어진 Book 내용을 확인해야한다. 
*/

Mutation을 사용해 DB데이터 수정!

 

Query 이용해 수정되었는지 확인