4주 프로젝트 개.고.수 - 2

팀원들과 설계를 마치고 실제로 개발에 들어갔다.

팀의 Role은 Front-end 2명, Back-end 2명으로 시작했다.

개발을 바로 시작하진 않고 GraphQL에 대한 학습을 먼저 진행했다.

학습을 완료한 후에 같이 Back-end를 맡게된 팀원과 설계 때 정한 미들 웨어들을 설치하는 작업과

DB 구축을 같이 진행했다.

DB 구축을 완료한 후 GrpahQL-yoga를 이용하여 서버 구축을 시작했다.

GraphQL을 학습하면서 배운 폴더 분기 방법을 이용했다.

• 서버 파일

// server.js 파일 
import cookieParser from "cookie-parser";
import cors from "cors";
import dotenv from "dotenv";
import { GraphQLServer } from "graphql-yoga";
import logger from "morgan";
import passport from "passport";
import { sequelize } from "../models";
import schema from "./schema";
// import socketIo from "socket.io";

dotenv.config();
// dotenv file 에 접근 가능하게 해준다.

const { PORT } = process.env;
// process 로 env 에 요소에 접근

const server = new GraphQLServer({ schema });
// graphQLserver 는 인자로 스키마를 받는다..

server.use(logger("dev"));
server.use(cors());
server.use(cookieParser());
server.use(passport.initialize());
server.use(passport.session());
//
server.start({ port: PORT }, () =>
  console.log(`Server running on http://localhost:${PORT}`)
);

// sequelize.sync();
// sequelize.sync()가 sync 가 되는순간 models 에 있는 스키마가 DB에 생성된다!

• 레졸버 및 스키마가 저장된 파일들을 불러 오는 역할

mport { fileLoader, mergeResolvers, mergeTypes } from "merge-graphql-schemas";
// graphQL 스키마에서 사용될 모듈
import { makeExecutableSchema } from "graphql-tools";
import path from "path";

const allTypes = fileLoader(path.join(__dirname, "/api/**/*.graphql"));
// 모든 api 폴더 안에 있는 graphQL 스키마 가져오기
const allResolvers = fileLoader(path.join(__dirname, "/api/**/*.js"));
// 모든 api 폴더 안에 있는 resolver file 가져오기 (*다른 js file 이 있으면 오류발생! -> 모두 js 형식이라서)
const schema = makeExecutableSchema({
  typeDefs: mergeTypes(allTypes),
  resolvers: mergeResolvers(allResolvers)
});
// 스키마 정의 (복수의 타입과 resolver 함수를 모두 받아오려면 merge 한 함수를 사용)

export default schema;

• 레졸버 및 스키마

// 스키마 파일
type Query {
  sayHello: String!
}

// 레졸버 파일
export default {
  Query: {
    sayHello: () => "hi!"
  }
};

이렇듯 간단하게 sayHello를 쿼리로 보내면 'hi!'를 리턴하는 레졸버를 작성 완료했다.