Data Transfer Objects(DTO) 구현

[habbiness]

어떤 기능인가요?

데이터 처리를 개선하고 레이어 간의 안전하고 최적화된 데이터 전송을 보장하기 위해 DTO 구현.

작업 상세 내용

• TODO

논의 사항(선택)

[Jake1152]

JS에서는 DTO 어떻게 구현하시나요 궁금하네요:)

[habbiness]

제가 DTO를 직접 구현해 본 경험이 없습니다.. 또한 dto 부분은 전혀 생각지도 못한 부분이라 어제 멘토님께 코드 리뷰 받고 조금 많이 당황했었네요😅 일단 피드백을 주셔서 그에 대한 개념 숙지를 위해 아주 간단히 찾아보기만 하였고, 제가 알아본 방식들이 정확한지에 대해서는 저도 잘 모르겠습니다.
사실 서비스 완성이 목표라서 서비스 완성 후 리팩토링 시에 DTO를 구현할 계획이지만, 지금까지 제가 알아본 방법들을 간단히 설명드릴게요.

1. 클래스 형식 : 클래스 형식으로 구현하면 객체 지향적인 접근도 가능하고 타입 안정성도 확보가 가능하다고 합니다. (아래는 그저 예시입니다)

// dtos/userDto.js
class UserDto {
  constructor({ name, email }) {
    this.name = name;
    this.email = email;
  }
}

export default UserDto;

2. 함수형 방식 : 함수형 방식으로 구현하면 함수 호출로 간단하게 dto 객체를 생성 가능하다고 합니다.

// dtos/userDto.js
const createUserDto = (user) => {
  return {
    id: user.id,
    name: user.name,
    email: user.email,
  };
};

export default createUserDto;

3. 라이브러리 사용 : 아직 자세히 찾아보지는 않았습니다
4. 타입 스크립트 사용 : 인터페이스와 클래스 기반으로 더욱 안전하다고 하네요

// dtos/userDto.ts
interface IUserDto {
  id: number;
  name: string;
  email: string;
}

class UserDto implements IUserDto {
  id: number;
  name: string;
  email: string;

  constructor(user: IUserDto) {
    this.id = user.id;
    this.name = user.name;
    this.email = user.email;
  }
}

export default UserDto;

많이 찾아본 것도 아니고 임시로 정리해본 것이라 정확한 정보를 보장할 수 없습니다. ㅠㅠ dto 구현에 대해서는 서비스 완성 후 리팩토링 시에 다시 고민해보려고 합니다!!

https://dev.to/tareksalem/dtos-in-javascript-118p
https://dev.to/mdmostafizurrahaman/simplifying-dto-management-in-expressjs-with-class-transformer-56mh
https://www.linkedin.com/pulse/dto-json-payload-expressjs-validation-middleware-imran-younas
https://quokkaman.medium.com/layered-architecture%EC%97%90%EC%84%9C-%EB%8D%B0%EC%9D%B4%ED%84%B0-%ED%81%B4%EB%9E%98%EC%8A%A4-%EB%B6%84%EB%A5%98-dto-entity-vo-%EC%A0%81%EC%9A%A9%EA%B3%BC-dto%EC%99%80-request-response-%EA%B0%9D%EC%B2%B4-%EB%B6%84%EB%A6%AC-ff2d0ea925d6

repository에서 데이터를 조회한 후 DTO를 반환하도록 변경하고(직접 받은 데이터를 필요한 속성만 가지는 객체로 변환), service와 controller에서 dto를 활용하여 응답을 반환하도록 하는 것으로.. 이해를 하고 있는데요 이게 정확한지도 잘 모르겠습니다.. spring이나 nestjs에 비해서 정보가 많이 부족하더라고요

일단 제가 참고한 사이트들 링크를 드릴게요!
정확성과 완성도는 보장할 수 없지만, 제 답변이 조금이나마 도움이 되었으면 좋겠습니다. 나중에 기회가 되면 더 공부해서 정확한 답변을 드리겠습니다!

[Jake1152]

와 이렇게 상세하게 답변 주실 줄 몰랐는데 고맙습니다 :)
저는 타입스크립트로 나중에 리팩터링 해야겠다 정도만 생각했어요
타입 있는 언어 쓰면 DTO를 자연스럽게 쓰는 거 같더라고요
JS는 "10" + 10 => 1010이 되는 그런 언어니까 타입 확인하기 더욱 어렵겠다 싶었어요
저도 추후에 더 알게 되면 이야기 글 남기겠습니다ㅎ