노드를 만들다.TypeScript 및 GraphQL을 포함한 NestJS가 있는 js 서버

최근에 나는 NestJS를 발견하고 바로 사랑에 빠졌다.나는 노드 프레임워크에 있는 Angular (TypeScript, 고집적인 파일 구조, 모듈, 장식기, 의존 주입 포함) 의 모든 것을 좋아한다.또한 GraphQL도 지원합니다.

저희가 시작하기 전에.


이 강좌는 초보자에게 적합하지 않다.그것은 노드의 기초 지식을 포함하지 않을 것이다.Node와 Express가 어떻게 작동하는지 알고 싶으면 했어요.또한 GraphQL 기초 지식은 포함되지 않습니다.
나는 이 블로그 문장에 근거하여 쓴 것이다.나는 이 박문을 읽고 동영상을 보는 것을 건의한다. 왜냐하면 그들은 서로 보완하기 때문이다.
본 강좌는 nest-cli 버전 6.6.4를 사용하여 2019년 9월 18일에 작성되었습니다.컨텐츠가 만료되거나 오류/차단 프로그램을 보고하는 경우 언제든지 연락하십시오.
만약 언제든지 당신이 실망감을 느낀다면, 당신은 볼 수 있다the final form of this code.

아리안 뉴욕 / nestjsgraphql 자습서


아래 설명 참조


이 모든 것이 다 지나갔으니 우리 시작합시다!

NestJS 시작


NestJS는 노드입니다.TypeScript 및 JavaScript 전용 js 프레임워크를 호환합니다.그것은 guard, pipe, interceptor 상자를 열면 바로 사용할 수 있는 브래킷을 가지고 있다.이것은 그것을 사용하기 쉽지만 기능이 매우 강하다.
시작하려면 NestJS CLI를 설치합니다.이렇게 하면 새로운 NestJS 프로젝트를 쉽게 만들 수 있습니다.
npm i -g @nestjs/cli
nest new my-node-project
여기서 my-node-project 은 노드 프로젝트의 이름입니다.NPM과 yarn이 설치되어 있으면 NestJS가 선호도를 묻습니다.프로젝트가 올바르게 작성된 경우 다음과 같은 구조를 가진 새 작성 프로젝트가 있어야 합니다.
.
├── README.md
├── nest-cli.json
├── package.json
├── src
│   ├── app.controller.spec.ts
│   ├── app.controller.ts
│   ├── app.module.ts
│   ├── app.service.ts
│   └── main.ts
├── test
│   ├── app.e2e-spec.ts
│   └── jest-e2e.json
├── tsconfig.build.json
├── tsconfig.json
├── tslint.json
└── yarn.lock
현재 이 디렉터리에 들어가서 새로 만든 노드 서버를 실행합니다.
cd my-node-project
npm run start:dev
다음으로 이동(기본값) "안녕하세요, 세상!"끝점.

http://localhost:3000 GraphQL에 뿌리기


는 API 쿼리 언어입니다.NestJS는 GraphQL 서버의 패키지인 자체 GraphQLModule 를 사용합니다.
우리가 시작하기 전에 곧 사용될 파일을 삭제합시다 ("Hello World!"끝점).더 구체적으로 말하면 @nestj/graphql, src/app.controller.ts 및 그에 상응하는 테스트 파일을 삭제하십시오.
GraphQL 및 NestJS 사용을 시작하려면 필요한 종속성을 설치합니다.
npm i --save @nestjs/graphql apollo-server-express graphql-tools graphql
패키지를 설치한 후 src/app.service.ts 에 등록합니다GraphQLModule:
import { Module } from '@nestjs/common';
import { GraphQLModule } from '@nestjs/graphql';
import { join } from 'path';

@Module({
  imports: [
    GraphQLModule.forRoot({
      definitions: {
        path: join(process.cwd(), '/src/graphql.schema.d.ts'),
        outputAs: 'class',
      },
      typePaths: ['./**/*.graphql'],
      resolverValidationOptions: {
        requireResolversForResolveType: false,
      },
    }),
  ],
})
export class AppModule {}
알아요, 알아요.여기는 많은 변화가 있다. 나는 너희들 모두에게 말한다.GraphQL 이런 변화를 설명하는 데 있어서 매우 잘한다.이것은 나의 견해다.

아폴로 그래픽 QL 모듈.forRoot()


서버에 등록됩니다/src/app.module.ts.GraphQLModule 방법은 .forRoot() 대상을 매개 변수로 한다.

NestJS GraphQL 문서 정의

options 패키지는 GraphQL 모드에서 TypeScript 정의를 자동으로 생성합니다(참조).우리는 @nestjs/graphql 대상을 사용하여 typePaths 유형의 스크립트를 어디에 저장해야 하는지를 설정합니다.기본적으로 GraphQL 유형은 로 변환됩니다.저는 개인적으로 를 더 좋아해요. definitions에서 봤어요.

인터페이스 유형 경로

path 프로젝트에서 GraphQL 파일을 찾을 위치를 알려 줍니다.

교과 과정 ResolveValidation 옵션


서버를 실행할 때 definitions.outputAsfalse와 같지 않으면 와 같은 경고를 받습니다.그래서 이것은 잘못된 것이다.
네, GraphQL로 돌아가세요.다음과 같이 프로젝트에 typePaths를 추가합니다.
type Message {
  id: Int!
  description: String!
}

type Query {
  messages: [Message]!
}

type Mutation {
  createMessage(description: String!): Message!
}
노드 서버를 다시 시작하여 로 이동하면 GraphQL 놀이터가 표시됩니다.물론, 당신이 실행하려고 시도하는 모든 조회나 변이는 오류로 끝날 것입니다. 왜냐하면 우리는 아직 해석 프로그램을 작성하지 않았기 때문입니다.

이것 NestJS로 GraphQL 해상도 작성


첫 번째 GraphQL 해상도를 작성해 보겠습니다.먼저 새 NestJS 모듈을 만듭니다.
nest generate module messages
이것은 GraphQLModule 가져오기 resolverValidationOptions.requireResolversForResolveType 와 새로운 src/schema.graphql 디렉터리를 만들 것입니다. 메시지 해석 프로그램의 업무 논리는 이 디렉터리에 있습니다. (방금 말씀드린 NestJS의 모듈화 참조)
이제 이 해상도를 만듭니다.데이터베이스로 사용되고 모든 메시지를 저장하며 모든 메시지를 되돌려주는 GraphQL 쿼리를 만드는 가상 변수 MessagesModule 를 만듭니다.AppModule:
import { Resolver, Query } from '@nestjs/graphql';

@Resolver()
export class MessagesResolver {
  // this is just for demonstration purposes
  // do NOT do this in real-life
  // this is meant as a substitute for a database
  messagesThatReallyShouldBeInADb = [
    { id: 0, description: 'The seed message' },
  ];

  @Query()
  messages() {
    return this.messagesThatReallyShouldBeInADb;
  }
}
데코더 NestJS가 제공했습니다(src/messagesmessagesThatReallyShouldBeInADb.이것은 우리가 src/messages/messages.resolver.ts 에서 성명한 Resolver 조회에 자동으로 비칩니다.우리는 지금 이 해상도를 Query 에 제공해야 한다.messages:
import { Module } from '@nestjs/common';
import { MessagesResolver } from './messages.resolver';

@Module({
  providers: [MessagesResolver],
  exports: [MessagesResolver],
})
export class MessagesModule {}
http://localhost:3000/graphql로 이동하여 페이지를 새로 고치고 메시지 조회를 실행합니다.
{
  messages {
    description
  }
}
만약 모든 것이 정확하게 완성된다면, seed 메시지를 볼 수 있을 것입니다.

이제 src/schema.graphql 돌연변이를 MessagesModule 에 추가합니다.기억http://localhost:3000/graphql.NestJS는 각 매개변수에 대해 수정자를 제공합니다.이 특정한 돌연변이에 대해 우리는 src/messages.module.ts 수식자를 사용하고 우리가 방문하고자 하는 매개 변수의 이름을 전달합니다(createMessage.
import { Mutation, Resolver, Query, Args } from '@nestjs/graphql';

@Resolver()
export class MessagesResolver {
  // this is just for demonstration purposes
  // do NOT do this in real-life
  // this is meant as a substitute for a databse
  messagesThatReallyShouldBeInADb = [
    { id: 0, description: 'The seed message' },
  ];

  @Query()
  messages() {
    return this.messagesThatReallyShouldBeInADb;
  }

  @Mutation()
  createMessage(@Args('description') description: string) {
    const id = this.messagesThatReallyShouldBeInADb.length;
    const newMessage = { id, description };
    this.messagesThatReallyShouldBeInADb.push(newMessage);
    return newMessage;
  }
}
분해기에 돌연변이를 추가한 후 에 있는 GraphQL 운동장으로 돌아가 메시지를 만듭니다.
mutation {
  createMessage(description: "This is a witty description") {
    description
  }
}
성공적으로 반환해야 합니다.
resolver type signature takes four arguments src/messages/messages.resolver.ts
우리의 새로운 변이와 모든 메시지에 대한 조회를 사용하면 메시지를 마음대로 만들 수 있습니다.

http://localhost:3000/graphql 결론


이렇게 하면 완전한 NestJS 서버와 GraphQL, 간단한 GraphQL 모드와 이 모드의 간단한 해상도 (조회와 변이 포함) 가 있습니다.만약 당신이 한 모든 것이 정확하다면, (parent, args, context, info) 조회와 @Args() 변이는 이 에서처럼 일해야 한다.마찬가지로 언제든지 길을 잃었다면 전체 프레젠테이션 항목을 보려면 를 보십시오.
다음 단계는 데이터베이스를 이 창고에 추가하는 것입니다.demo server는 GraphQL과 데이터베이스 도구를 추가로 제공하는 탁월한 솔루션입니다.이 시리즈의 다음 호에서는 Prisma를 사용하여 메시지를 저장하는 것을 깊이 있게 연구할 것입니다.
만약 당신이 이 글을 좋아한다면 다음과 같은 방식으로 저를 지지해 주십시오.

좋은 웹페이지 즐겨찾기