개요

• 이번 포스팅부터는 노마드 코더의 **Uber Eats 클론코딩**을 수강하면서 공부한 내용을 작성해보려 한다. 해당 섹션에서는 **GraphQL**을 Nest 위에서 사용하기 위한 셋팅부터 시작해서 GraphQL 과 관련된 내용들에 대해 다뤄볼 것이다.

  Lecture – 노마드 코더 Nomad Coders

• 목차

Setup

Apollo Server 셋팅

Documentation | NestJS - A progressive Node.js framework

• 먼저 위에 첨부해둔 NestJS 공식 문서를 참고하며 NestJS에서 GraphQL API Server를 만들기 위한 셋팅부터 진행해보도록 하자.

• graphql 모듈 설치

  npm i @nestjs/graphql @nestjs/apollo @apollo/server graphql
  

  • GraphQL을 NestJS 위에서 사용하기 위해 @nestjs/graphql, @nestjs/apollo, @apollo/server, graphql 을 설치해보자.

• main.ts 분석

  import { NestFactory } from '@nestjs/core';
  import { AppModule } from './app.module';
  
  async function bootstrap() {
    const app = await NestFactory.create(AppModule);
    await app.listen(3000);
  }
  bootstrap();
  

  • 기본적으로 NestJs는 **AppModule**을 기반으로 **NestFactory**를 이용하여 어플리케이션을 생성한다. → **AppModule**로부터 어플리케이션이 생성되기 때문에 모든 모듈은 AppModule 안에 들어가야 한다.⭐️
  • 따라서 GraphQL 모듈도 AppModule 내에 들어가야 한다는 것이다.

파일 셋팅

• 불필요한 파일 제거

  • app.service.ts
  • app.controller.ts
  • app.controller.spec.ts

• app.module.ts

  import { Module } from '@nestjs/common';
  import { GraphQLModule } from '@nestjs/graphql';
  
  @Module({
    imports: [
      GraphQLModule.forRoot()
    ],
    controllers: [],
    providers: [],
  })
  export class AppModule {}
  
  

  • **GraphQLModule**의 forRoot() 를 통해 초기화 한 GraphQL 모듈을 반환하도록 한다.
    • 해당 함수를 통해 GraphQL 모듈에 대한 설정을 진행할 수 있다.
  • GraphQL 모듈을 통해 GraphQL 요청을 처리⭐️할 수 있다.
  • 이전에 GraphQL 기본을 다룰 때 **new ApolloServer()**를 해주던 것이 **forRoot()**가 하는 역할이다.

Schema 정의

Query 타입 정의하기

• 이전에 GraphQL을 공부할 때 우리는 **Schema**를 작성하기 위해 GraphQL 언어를 사용하여 타입을 지정해주었었다. 이번에는 **TypeScript**를 이용하여 스키마를 정의하는 방법에 대해 알아보도록 하자.
• 먼저 NestJS에서 Schema를 정의하는 방법에는 2가지 방법이 있다.

  1. 수동 graphql 파일 작성 및 등록

     GraphQLModule.forRoot<ApolloDriverConfig>({
       driver: ApolloDriver,
       typePaths: ['./**/*.graphql'],
     }),
     

  2. 자동 graphql 파일 작성

     GraphQLModule.forRoot<ApolloDriverConfig>({
       driver: ApolloDriver,
       autoSchemaFile: join(process.cwd(), 'src/schema.gql'),
     }),
     

     <aside> 👀

     process의 **cwd()**는 **current working directory**를 의미한다.

     </aside>

     • 해당 방법은 TS를 통해 스키마를 정의하면 자동으로 위의 경로로 graphql 파일이 생성되는 방법이다.