[typescript] 타입스크립트를 사용한 GraphQL 서버 구축 방법

본 포스트에서는 타입스크립트를 사용하여 GraphQL 서버를 구축하는 방법에 대해 설명하겠습니다.

1. 프로젝트 설정

먼저, 타입스크립트로 GraphQL 서버를 구축하기 위해 프로젝트를 설정해야 합니다. package.json 파일에 다음과 같이 의존성을 추가합니다.

{
  "dependencies": {
    "express": "^4.17.1",
    "apollo-server-express": "^2.19.0",
    "graphql": "^15.5.0"
  },
  "devDependencies": {
    "typescript": "^4.3.5",
    "@types/express": "^4.17.11",
    "ts-node": "^10.1.0",
    "nodemon": "^2.0.12"
  }
}

그리고 TypeScript 구성 파일 tsconfig.json을 프로젝트 루트에 생성합니다.

{
  "compilerOptions": {
    "target": "ES2018",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true
  }
}

2. GraphQL 서버 구현

GraphQL 서버를 구현하기 위해 다음 단계를 따릅니다.

2.1. 스키마 정의

GraphQL 스키마를 정의합니다. 스키마 정의는 graphql 모듈을 사용하여 진행합니다. 예를 들어 schema.graphql 파일에 다음과 같이 스키마를 작성할 수 있습니다.

type Query {
  greeting: String
}

schema {
  query: Query
}

2.2. 리졸버 작성

스키마에 대응하는 리졸버를 작성합니다. 예를 들어 resolvers.ts 파일에 다음과 같이 리졸버를 작성할 수 있습니다.

const resolvers = {
  Query: {
    greeting: () => "Hello, World!"
  }
};

export default resolvers;

2.3. 서버 구동

마지막으로, 아폴로 서버를 생성하고 해당 서버를 Express 앱에 마운트하여 구동합니다.

import express from 'express';
import { ApolloServer } from 'apollo-server-express';
import typeDefs from './schema.graphql';
import resolvers from './resolvers';

const server = new ApolloServer({ typeDefs, resolvers });
const app = express();
server.applyMiddleware({ app });

const PORT = 4000;
app.listen(PORT, () => {
  console.log(`Server is running on http://localhost:${PORT}/graphql`);
});

3. 서버 실행 및 테스트

마지막으로, 타입스크립트 소스 코드를 빌드하고 서버를 실행하여 GraphQL 쿼리를 테스트합니다.

npx tsc
npx nodemon dist/index.js

브라우저나 API 도구를 활용하여 http://localhost:4000/graphql로 접속하여 GraphQL 쿼리를 실행하고 테스트할 수 있습니다.

이상으로 타입스크립트를 사용한 GraphQL 서버 구축 방법에 대해 설명했습니다.

참고 자료: Apollo Server Docs, TypeScript Docs