DTO (Data Transfer Obeject)는 데이터 전송 객체를 의미한다.
주로 애플리케이션의 여러 계층 간에 데이터를 전송할 때 사용한다.
DTO는 데이터를 단순히 캡슐화하는 객체로 비즈니스 로직이 없고, 주로 데이터의 구조를 정의하는 역할이다.
특징
- 단순 데이터 구조
- DTO는 단순히 데이터를 담고 있는 객체로, 비즈니스 로직이 없다.
- 계층 간 데이터 전송
- 주로 서비스 계층과 프레젠테이션 계층 간에 데이터를 전송할 때 사용
- 직렬화 가능
- DTO는 네트워크를 통해 전송하거나 파일로 저장할 때 직렬화 가능
- 읽기 전용
- DTO는 주로 읽기 전용으로 사용, 데이터를 변경하는 로직은 포함되지 않는다.
정의
interface UserDTO {
id: number;
name: string;
email: string;
age: number;
}
DTO 사용
예를 들어 API 호출을 통해 사용자 정보를 가져오고 이를 프론트엔드에서 사용하고 싶을 때, DTO를 정의해서 데이터를 전송할 수 있다.
// 서버에서 DTO를 사용하여 데이터 전송
const getUser = async (userId: number): Promise<UserDTO> => {
const response = await fetch(`/api/users/${userId}`);
const data: UserDTO = await response.json();
return data;
};
// 프론트엔드에서 DTO를 사용하여 데이터 처리
const displayUser = async (userId: number) => {
try {
const user = await getUser(userId);
console.log(`User Name: ${user.name}`);
console.log(`User Email: ${user.email}`);
} catch (error) {
console.error('Error fetching user data:', error);
}
};
displayUser(1);
DTO의 장점
- 명확한 데이터 구조
- DTO를 사용하면 데이터 구조가 명확해지고, 코드의 가독성이 좋아진다.
- 유효성 검사
- 데이터를 전송할 때 DTO를 사용하여 유효성 검사를 쉽게 수행할 수 있다.
- 변경 용이성
- 데이터 구조가 변경되더라도 DTO를 통해 각 계층 간의 영향을 최소화할 수 있다.
마지막으로 내가 작성한 코드에 적용을 해보았다.
import instance from '@/lib/apis/axios';
interface UsersPostDataType {
email: string;
name: string;
pw: string;
age: number;
gender: string;
}
interface UserDTO {
id: number;
email: string;
name: string;
age: number;
gender: string;
}
const transformToUserDTO = (data: any): UserDTO => {
//나중에 필요한 정보 보고 수정
return {
id: data.id,
email: data.email,
name: data.name,
age: data.age,
gender: data.gender,
};
};
export const usersPost = async (
usersPostData: UsersPostDataType
): Promise<UserDTO> => {
try {
const res = await instance.post('/users', usersPostData);
const userDTO = transformToUserDTO(res.data);
return userDTO;
} catch (error) {
throw new Error('유저 생성 에러: ' + (error as Error).message);
}
};
아직 더 수정해야 할 코드지만 적용을 해봤다는 것에 의미가 있는 것 같다.
'잡다한거' 카테고리의 다른 글
| 프론트엔드 테스트 (cypress) (0) | 2024.08.03 |
|---|---|
| Jotai? (0) | 2024.07.14 |
| HOC? (0) | 2024.06.30 |
| 부트캠프를 마치며..(마지막 프로젝트를 마치며..) (0) | 2024.04.09 |
| 요즘 좋게본 시 (1) | 2024.04.07 |