[GraphQL] Graphql-tool 이란? - 파일 정리,

graphql-tools이란?

 graphql 파일들을 정리해 분리해놓으면,

다시 하나로 모아 합쳐주는 도구

 

정리해야하는 이유

코드를 전부다 한 파일에 작성하다보면,원하는 부분을 찾기가 힘들다

( 크기가 너무 커지고, 길이도 너무 길어지므로 )

수정하고 싶을때마다, 바로바로 쉽게 찾을 수 있게 하기 위해서, 파일별로 나누어 분류작업을 해놓는 것이 좋다.

 

어떤 기준으로 분류할 것인가?

다루는 데이터를 기준으로 분류하는 방법

게시글 폴더
    게시글.mutations
    게시글.queries
    게시글.typeDefs
    
댓글 폴더
    댓글.mutations
    댓글.queries
    댓글.typeDefs
    
schema
server

---

 

분류 구조 만들기

books
    books.mutations.js
    books.queries.js
    books.typeDefs.js
    // 파일이름만 보고도, 이 파일이 무엇을 의미하는지 알기 위한 작명!
    
client.js  // PrismaClient 분류하기 위한 파일 생성
schema.js  // schema 분류하기 위한 파일 생성

 

PrismaClient 분류하기

// client.js

import { PrismaClient } from ".prisma/client";

const client = new PrismaClient();

export default client;

 

Query 분류하기

// books/books.queries.js

import client from "../client";  //PrismaClient 사용하기 위해 불러오기

// export default로 Query 내용 내보내기
export default {
  Query: {
    books: () => client.book.findMany(),
    book: (_, { id }) => client.book.findUnique({ where: { id } }),
  },
};

 

Mutation 분류하기

// books/books.mutations.js

import client from "../client";  //PrismaClient 사용하기 위해 불러오기

// export default로 Mutation 내용 내보내기
export default {
  Mutation: {
    createBook: (_, { title, year, genre }) =>
      client.book.create({
        data: {
          title,
          year,
          genre,
        },
      }),
    deleteBook: (_, { id }) => client.book.delete({ where: { id } }),
    updateBook: (_, { id, title, year, genre }) =>
      client.book.update({
        where: {
          id,
        },
        data: {
          title,
          year,
          genre,
        },
      }),
  },
};

 

typeDefs 분류하기

// books/books.typeDefs.js

// 데이터 형식(typeDefs) 지정하기 위한 gql 불러오기
import { gql } from "apollo-server";

// export default 활용해 gql typeDefs 내보내기
export default gql`
  type Book {
    id: Int!
    title: String!
    year: Int!
    genre: String
    createdAt: String!
    updatedAt: String!
  }

  type Query {
    books: [Book]
    book(id: Int!): Book
  }

  type Mutation {
    createBook(title: String!, year: Int!, genre: String): Book
    deleteBook(id: Int!): Book
    updateBook(id: Int!, title: String, year: Int, genre: String): Book
  }
`;

 

graphql-tools 설치

npm install @graphql-tools/schema

npm install @graphql-tools/merge

npm install @graphql-tools/load-files



// 구버전
npm install graphql-tools@latest

 

graphql-tools 사용해서 분류한 파일 합쳐주기

// schema.js

// typeDefs, resolver 파일 합칠때 사용
import { makeExecutableSchema } from "@graphql-tools/schema";

// 조건 만족하는 파일 불러올때 사용
import { loadFilesSync } from "@graphql-tools/load-files";

// typeDefs는 typeDefs끼리, resolvers는 resolvers끼리 합칠때 사용
import { mergeTypeDefs, mergeResolvers } from "@graphql-tools/merge";


/*
  loadFilesSync로, 현재폴더(__dirname)에 있는, 모든폴더(**) 속,
  typeDefs.js로 끝나는 모든파일(*) 불러오기
*/
const loadedTypes = loadFilesSync(`${__dirname}/**/*.typeDefs.js`);


/*
  loadFilesSync로, 현재폴더(__dirname)에 있는, 모든폴더(**) 속,
  queries.js와 mutations.js로 끝나는 모든파일(*) 불러오기
*/
const loadedResolvers = loadFilesSync(
  `${__dirname}/**/*.{queries,mutations}.js`
);

// 불러온 typeDefs 합치기
const typeDefs = mergeTypeDefs(loadedTypes);

// 불러온 Queries, Mutations 합치기
const resolvers = mergeResolvers(loadedResolvers);

// 합쳐진 typeDefs, resolvers로 Schema 만들기
const schema = makeExecutableSchema({ typeDefs, resolvers });

// export defult로 최종 Schema 내보내기
export default schema;

 

분류된 파일 서버에서 사용하기

// server.js

import { ApolloServer } from "apollo-server";

// 합쳐진 최종 schema불러오기
import schema from "./schema";

// schema로 ApolloServer 만들기
const server = new ApolloServer({ schema });

server
  .listen()
  .then(({ url }) => console.log(`🚀 Server is running on ${url}`));

 

---

다른 분류 방법

// 기능 별로 resolvers, typeDefs 나누기는 방법

books
    createBook
        createBook.resolvers.js
        createBook.typeDefs.js
    deleteBook
        deleteBook.resolvers.js
        deleteBook.typeDefs.js
    ...
    
client.js
schema.js