프로젝트/KimsBoard

서버사이드 DTO만들기, 프론트측 DTO(API)만들기

NandaNanda 2024. 5. 14. 10:25

도움: https://thalals.tistory.com/268

 

대원칙중 지켜야 할 것은 서버측에서만 DTO를 만드는 것이 아닌 프론트 측에도 똑같이 DTO에 해당하는 API를 만들어 주어야 하는 것에 있다.

 

서버측 DTO로 reuqest, response가 별도로 있다. 프론트측도 마찬가지로 request, response가 별도로 있어야 한다.

 

클라이언트 측에서는 DTO라고 하지 않고 apis라고 해주었다.

요약: ResponseEntity란 Httpentity를 상속받는 클래스로써 결과 데이터와  HTTP상태코드를 직접 제어할 수 있는 클래스이다. ResponseEntity에는 사용자의 HttpRequest에 대한 응답 데이터가 포함된다. 또한 HTTP아키텍쳐 형태에 맞게 Response를 보내주는 것에도 의미가 있다. 에러 코드와 같은 HTTP상태 코드를 전송하고 싶은 데이터, 헤더값과 함께 전송할 수 있기 때문에 좀 더 세밀한 제어가 필요한 경우 사용됨. 즉 정리하자면 RestAPI를 사용하면서 ResponseEntity를 통해 HTTP프로토콜 형식을 만족하여 클라이언트로 부터온 Request에 맞게 Response를 보내 주는 것이 ResponseEntity클래스이다. 

ResponseEntity에서 HTTP의 message body(entity.getBody()), header부분의 content type(entity.getHeaders().getContentType()), HTTP의 Status ine의 요소인 상태코드(entity.getStatusCode())를 ResponseEntity에서 뽑아오고 있다.

 

===========================================================================================

Front측에서도 서버와의 데이터 통신을 위해 Response.dto를 만들어 주었다. 여기서 파일 구조의 특징중 하나 알고 넘어가야 할 것이 파일이름이 index라고 하면 index파일에서 export 한 클래스가 다른 곳에서 쓰일 수 있다는 것이다. 기억해야 할것은 반드시 파일이름이 index인 곳에서 export해야 한다는 것이다. 아래는 type파일의 enum파일안의 index.ts파일에서 export한 ResponseCode를 import한 코드이다.