project nestjs typescript CLI 계획 모듈 module 컨트롤러 controller decorator api client rest client

Nest CLI로 프로젝트 생성하기

계획과 모듈, 컨트롤러 생성

App setup

이번엔 이전과 다르게 Nest CLI를 이용해 프로젝트를 시작해보겠다.

새로운 디렉토리에서 시작하자. 새 폴더를 만들고 터미널에서 이동한다.

npm install -g @nestjs/cli 를 입력하자. 오류뜨면 맨앞에 sudo를 추가한다.

설치가 끝나면 nest new {프로젝트이름}을 입력하고 npm을 선택한다. messages라는 이름으로 짓겟다.

끝나고 나면 우리가 일일이 만들었던 저번보다 훨씬 많은 파일이 자동적으로 생성된 것을 볼 수 있다!

계획

이번에 만들 앱(모바일 X)은 일반 JSON 파일에 저장된 메시지를 검색하고 저장하는 것.

3개의 route가 예상된다. 각 route가 pipe, guard, controller, service, repository 중 무엇이 필요한지 생각해보자.

  1. 모든 메시지 조회
    • 컨트롤러 : 메시지를 보여주는 함수로 연결
    • 서비스 : DB에 접근하여 모든 메시지를 가져오는 논리
    • 저장소 : 메시지를 저장하는 파일
  2. 메시지를 생성
    • 파이프 : 생성해달라고 보내온 데이터의 유효성을 검사해야함
    • 컨트롤러 ( 2개씩 만들지 않고 모든 요청을 처리할 수 있는 하나의 컨트롤러, 서비스, 저장소를 만든다.)
    • 서비스
    • 저장소
  3. ID로 메시지 조회
    • 컨트롤러
    • 서비스
    • 저장소

따라서 서버에는

하나의 모듈(MessageModule로 이름을 짓는다.) 내에

  • Pipe (메시지 생성을 위해)
  • MessagesController (3가지 route를 위한 컨트롤러)
  • MessagesService (3가지 route를 위한 서비스)
  • MessagesRepository (3가지 route를 위한 저장소)

를 만들어야 한다.

설정

npm run start --dev로 서버를 실행하면 프로젝트가 변경될 떄마다 서버를 재시작할 필요 없이 바로 반영된다.

위와 같은 명령어는 package.json의 scripts에서 확인할 수 있다.

.eslintrc.js는 오류를 잡아주는 모듈이다. 하지만 우린 typescript가 있으니 굳이 꼭 필요하진 않으니 이 파일의 module.exports ={내부} 의 내를 전체 각주처리한다.

(물론 안해도됌)

새로운 나의 모듈 만들기

src 디렉토리 내에 자동으로 컨트롤러, 모듈, 서비스 파일이 생성되어있다.

위에서 계획을 세운대로 만들기 위해

app.controller.spec.ts, app.controller.ts, app.module.ts, app.service.ts 4개 파일은 지운다.(이용해도 무방)

main.ts 파일을 가보면 ./app.moude 의 import가 오류가 발생한다.

터미널에

nest generate module messages

를 입력하면 src/messages 경로 내부에 messages.module.ts가 새롭게 만들어진다. 끝에 messagesmodule라고 입력하면 클래스 이름이

messagesmodulemodule로 되니 조심하자.

main.ts의 import 문을 import { MessagesModule } from './messages/messages.module'로 바꿔주면 오류가 사라진다.

물론 밑의 AppModule도 MessageModule로 바꿔준다.

컨트롤러 만들기

터미널에 nest generate controller messages/messages --flat을 입력해보자.

컨트롤러 파일이 만들어지고 기존의 모듈에 새로 만든 컨트롤러가 자동으로 추가된다!

nest generate {만들 클래스의 타입} {파일을둘폴더이름}/{클래스이름} 으로 만든 명령문이다.

–flat 은 controllers라는 추가적인 폴더를 만들지 말라는 옵션이다. controller 파일을 따로 묶으려면 만들어도 된다.

컨트롤러와 decorator 구성

옵션 1 : @Controller() 내에 @Get(‘/messages’), @Post(‘/messages’), @Get(‘/messages/:id’) 로 구성하기

옵션 2 : @Controller(‘/messages’) 내에 @Get(), @Post(), @Get(‘/:id’) 로 구성하기 (나의 계획)

messages.controller.ts 파일의 컨트롤러 내에 decorator와 메서드를 만든다.

1
2
3
4
5
6
7
8
9
10
11
12

// messages.controller.ts
import { Controller, Get, Post } from '@nestjs/common';

@Controller('messages')
export class MessagesController {
  @Get()
  listMessages() {}
  @Post()
  createMessage() {}
  @Get('/:id')
  getMessage() {}
}

API 클라이언트 설정

postman과 VSCODE 확장 프로그램이 있는데, postman은 구글링하면 잘 나와있다.

rest client 라는 extension을 설치한 후 root 디렉토리에 requests.http 파일을 만들자.

사용법

파일에 GET http://localhost:3000/messages를 입력하면 바로 위에 Sent Request라는 버튼이 뜬다.

버튼을 누르면 오른쪽에 창이 뜨면서 결과를 볼 수 있다. 서버 키는것 잊지 말자.

이번엔

POST http://localhost:3000/messages

content-type: application/json

{

“content”: “리빅아”

}

도 입력해보자. 빈 줄은 일부러 만든 것이다.

CATALOG
    nestjs