input 관련 문의

Question

express 로 GraphQL 사용하였을 때 코드는 아래와 같습니다.

const typeDefs = `#graphql
  input CreateBoardInput {
    writer: String
    title: String
    contents: String
  }
  type Mutation {
    createBoard(createBoardInput: CreateBoardInput!): String
  }
`;
const resolvers = {
    Mutation: {
        createBoard: (parent, args, context, info) => {
            ...
            return "게시글 등록 성공"
        }
    }

위 내용을 Nest.js - GraphQL 에 적용하였을 때 아래와 같이 구현했습니다.

@Mutation(() => String)
  createBoard(
    @Args('createBoardInput') createBoardInput: CreateBoardInput,
  ): string {
    // 1. 브라우저에서 보내준 Data 확인하기
    console.log(createBoardInput.writer);
    console.log(createBoardInput.title);
    console.log(createBoardInput.contents);
    // 2. DB접속 후, 데이터 저장 => 데이터 저장했다고 가정

    // 3. DB에 저장된 결과를 브라우저에 응답(response) 주기
    return '게시글 등록 성공';
  }

@InputType()
export class CreateBoardInput {
  // export 추가 및 클래스 이름 변경
  @Field(() => String)
  writer: string;

  @Field(() => String)
  title: string;

  @Field(() => String, { nullable: true })
  contents: string;
}

@InputType() 데코레이터: CreateBoardInput 클래스에 @InputType() 데코레이터를 적용하여, 이 클래스가 GraphQL 스키마에서 입력 타입으로 적용되게 되는데요.

InputType 데코레이터의 경우 class 파일 위에 존재해야 한다고 합니다.

지금처럼 InputType이 늘어날때마다 class 를 추가하나요?

실무에서는 어떻게 사용하나요?

노원두 · Answer

안녕하세요! gkdlsb1234 님!   하나 하나 다 직접 입력하는 경우, 복잡하기도 할 뿐더러, 타입이 일관되지 않을 수도 있어요! 따라서, 원본타입을 가져와서 추출하는 형태 로 DTO를 만들어서 사용한답니다! @InputType() export class UpdateBoardInput extends PickType( PartialType(Board), // PartialType으로 감싸주면 Board의 필드들은 필수가 아니어도 괜찮아요 [ "writer", // 이걸 뽑아서(Pick) 타입을 만들거예요 "title", ], InputType, // Board는 ObjectType인데, InputType으로 변형하여 사용 할거예요! ) { @Field(() => Int) // 이외에 추가하거나 변경해야할 필드가 있다면 덮어쓸 수 있어요!(없으면 비워놓기) contents: number; }   참고) 타입스크립트에도 비슷한 타입들이 존재 해요! => 뒷부분 타입스크립트 수업에서 유틸리티타입 을 참고해 주세요^^

인프런 AI 인턴 · Answer

안녕하세요, 인프런 AI 인턴입니다. gkdlsb1234님.

GraphQL을 사용할 때, @InputType() 데코레이터를 통해 입력 타입을 정의해 주시는 점 잘 이해하고 계신 것 같습니다. 질문 주신 내용을 바탕으로 몇 가지 정보를 드리겠습니다.

실무에서의 InputType 구성

개별 파일로 분리: 보통 프로젝트가 커지고 InputType이 많아질 경우, 각 InputType을 개별 파일로 분리해서 관리합니다. 이렇게 하면 재사용 가능성이 높아지고 변경 사항 관리가 쉬워집니다.
폴더 구조화: InputType 관련 파일들을 특정 폴더에 모아 구조화하는 것도 좋은 방법입니다. 예를 들어 src/graphql/inputs 같은 폴더에 InputType 클래스들을 저장할 수 있습니다.
공통 타입 관리: 여러 곳에서 사용되는 입력 타입이나 공통적인 부분은 공통 모듈로 관리하여 중복/유지보수 부담을 줄일 수 있습니다.

실무에서의 적용 사례

실제로 대규모 프로젝트에서는 이와 같은 방식으로 입력 타입을 관리합니다. 특히, 다양한 입력 타입이 있는 경우 이러한 구조화된 접근은 코드의 가독성을 높이고 유지보수의 용이성을 제공합니다.

참고할 만한 자료

인프런 강의: GraphQL과 NestJS로 효율적인 백엔드 구축하기 - 이 강의는 GraphQL과 NestJS를 실전에 적용하는 방법을 배울 수 있습니다.
NestJS 공식 문서 - 공식 문서를 통해 더욱 다양한 예제를 확인해 보세요.

위 내용들이 도움이 되시길 바라며, 추가적으로 궁금한 점이 있으시면 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.

인프런 커뮤니티 질문&답변