nest 강의 수강

최수민·2023년 8월 11일
0

TIL

목록 보기
11/41

다음 최종 프로젝트시 팀원분들이 nest로 하기를 원하는데 제가 하지 못하면 민폐일거 같아서 수강하고 있습니다.

nest 약자를 잘 모를 경우 아래와 같이 검색하면 나온다고 합니다.

nestjs cli usage 검색 결과

간단히 게시물 crud를 작성을 할건데 lodash라는 패키지를 사용한다고 합니다.
해당 패키지는 express와 같이 인기있는 패키지입니다.

  • lodash는 Javascript로 코딩할 때 유용하게 사용할 수 있는 유틸성 패키지입니다.

lodash doc

  • loadsh 설치 명령어
npm i lodash

-tsconfig.json 속성 추가

"esModuleInterop": true

controller 작성

  
import { Controller, Get, Post, Put, Delete } from '@nestjs/common';
import { BoardService } from './board.service';

@Controller('board') //routing path is /board -> e.g. http://localhost:3000/board
export class BoardController {
  constructor(private readonly boardService: BoardService) {}

  //게시글 목록을 가져오는 api
  @Get('/articles')
  getArticles() {
    return this.boardService.getArticles();
  }

  //게시글 상세 보기
  @Get('/articles/:id')
  getArticleById() {
    return this.boardService.getArticleById(id);
  }

  //게시글 작성
  @Post('/articles')
  createArticle() {
    return this.boardService.createArticle();
  }

  //게시글 수정
  @Put('/articles/:id')
  updateArticle() {
    return this.boardService.updateArticle(id);
  }

  //게시글 삭제
  @Delete('/articles/:id')
  deleteArticle() {
    return this.boardService.deleteArticle(id);
  }
}

위와 같이 작성을 했는데, 해당 부분에서 post와 put에서 받는 값이 안보여 당황했습니다.
보통 저희가 배웠던 부분에서는 req.body로 값을 받아올 수 있었지만, nest는 DTO를 사용한다고 합니다.

이제 dto를 사용하기 전에 아래 클래스를 다운받도록 하겠습니다.

npm i class-validator class-transformer

class-validator는 입력값 유효성 검사를 위해 정말 다양한 기능을 제공합니다.(-수업자료)

class-transformer는 TypeScript 진영에서 직렬화와 역직렬화를 위해 자주 활용되는 라이브러리(-인터넷검색결과)

이제 dto를 사용해보려합니다.
먼저 아래 사진과 같이 craete-article.dto.ts 파일을 만들어줍니다.

dto를 작성중 계속 아무것도 없는 곳에서 Delete 'cr'이라는 오류들이 생겼습니다.
찾아보니 .eslintrc.js 파일에서 rules안에 아래 코드를 넣어주면 해결되는 문제였습니다. 참고 사이트

'prettier/prettier': [
   'error',
   {
     'endOfLine': 'auto',
   }
 ]
PartialType을 상속받아 사용하는 이유 - 수업자료 내용 중.. -

DTO를 3개 작성한 이유는 각각의 요청마다 해당 요청으로부터 전달을 받는 데이터가 조금씩 다 다르기 때문에 통상적으로 요청 1 : 1 DTO 비율을 유지합니다. 그런데, update-article.dto.ts는 create-article.dto.ts에서 사실상 다를게 없죠? 이럴 때는 코드 복사 + 붙여넣기도 좋지만 @nestjs/mapped-types의 PartialType을 상속받으면 이를 깔끔하게 해결할 수 있습니다.

조금만 더 설명을 해보면 게시물을 수정할 때도 title, content, password를 동일하게 받아야 합니다. 이것을 PartialType을 상속받아서 해결하면 UpdateArticleDto는 CreateArticleDto 클래스의 부분집합이다. 라고 선언을 하게 되는 것이고 코드 복사 + 붙여넣기를 하지 않아도 동일한 효력을 가질 수 있습니다! 부분집합은 해당 필드가 전부 포함되어도 성립되고 특정 필드들이 생략이 되어도 성립이 되니까 문제가 없습니다!

그렇다면, DeleteArticleDto도 동일하게 할 수 있을까요? 네. 당연합니다! 하지만, 게시물을 삭제하는데 title, content를 굳이 선택적으로 받게끔 여지를 줄 필요는 없겠죠? 이럴 때는 더욱 더 단호하게 @nestjs/mapped-types의 PickType을 상속받아 나는 이 부모 클래스에서 이 필드만 필요해!를 선언하는 것이 더욱 더 깔끔합니다.

그렇다면, UpdateArticleDto, DeleteArticleDto 클래스를 수정해볼까요? 그 전에, 우리는 위에서 얘기했던@nestjs/mapped-types 을 설치해야 합니다. @nestjs/mapped-types는 DTO를 변환시키는 것을 도와주는 패키지입니다. 일단 아래의 명령어 복사 + 붙여넣기 고고하시죠!

@nestjs/mapped-types 설치 명령어

npm i @nestjs/mapped-types

만약, class-validator 의존성 이슈로 설치에 실패한다면 다음과 같이 시도를 해주시기 바랍니다.

npm uninstall class-validator
npm i @nestjs/mapped-types
npm i class-validator

updateArticleDto 수정한 결과

import { PartialType } from '@nestjs/mapped-types';
import { CreateArticleDto } from './create-article.dto';

export class UpdateArticleDto extends PartialType(CreateArticleDto) {}

다음 수업인 typeORM은 다른 페이지에서 마저 작성하겠습니다.
typeORM_1 수업


수업 자료
nestjs 수업 git

0개의 댓글