티스토리 뷰

GraphQL의 초기 폴더구조는 기본적으로 밑의 사진과 같이 구성된다 (VS Code, Yarn사용)

 

GraphQL 폴더구조 사진

 

1) package.json

 - package.json에 정의한 dependency들은 yarn install을 통해 한번에 다운로드를 할 수 있다.

 - git으로 협업할 때, module은 보통 용량때문에 ignore되므로 package.json의 dependency 정보만 가져와서 yarn install로 다운받으면 편하다.

 

2) schema.js

 - schema.js의 코드는 기본적으로 다음과 같다.

import path from "path";
import { makeExecutableSchema } from "graphql-tools";
import { fileLoader, mergeResolvers, mergeTypes } from "merge-graphql-schemas";

const allTypes = fileLoader(path.join(__dirname, "/api/**/*.graphql"));
const allResolvers = fileLoader(path.join(__dirname, "/api/**/*.js"));

const schema = makeExecutableSchema({
   typeDefs: mergeTypes(allTypes),
   resolvers: mergeResolvers(allResolvers)
});

export default schema;

 - graphql-tools를 사용하여 .graphql(Types들)과 .js(resolver들)을 관리해준다.

 - server.js는 schema.js를 import만 하면 types와 resolvers를 인식할 수 있다.

 

3) server.js

require("dotenv").config();
import { GraphQLServer } from "graphql-yoga";
import logger from "morgan";
import schema from "./schema";

const PORT = process.env.PORT || 4000;

const server = new GraphQLServer({ schema });
server.express.use(logger("dev"));

server.start({ port: PORT }, () =>
  console.log(`✅ Server running on http://localhost:${PORT}`)
);

 - server실행과 관련된 코드를 모아놓는다.

 - server실행시에 type과 resolver를 인식해주어야하는데 schema를 import함으로써 schema에 정의된 api폴더에 있는 .graphql, .js 파일들을 인식할 수 있다.

 

4) api 폴더

 - type과 resolver들을 정의한 .graphql, .js파일을 담고 있는 폴더.

 - 각 기능별로 하위 폴더를 두어 파일들을 저장한다. 

댓글