FrontEngineer JungBam

제네릭 타입의 활용(비동기 요청값) 본문

개발일지

제네릭 타입의 활용(비동기 요청값)

정밤톨 2023. 8. 29. 11:32
서버에서 요청받는 값들을 타입을 지정해서 작업한다면 DX적으로 얼마나 편리할까?
자동완성이라던가, 다른 타입에러들이 없을텐데..
타입스크립트를 사용하면서 이런 생각들을 해봤을 것이다.

 타입 스크립트로 개발하면서 하나하나 타입을 지정하고 작업하는 것이 당연해질때즈음이면 자동완성이 뜨지 않으면 뭔가 지정하고 싶은 욕망이 생긴다. 어떻게 할 수 있을까? 제네릭 타입을 사용하는 경우의 대표적인 케이스가 이 경우가 아닐까 생각이 든다.
 아래 코드를 보면 instance(axios client)를 통해서 넘어오는 값의 타입을 명시적으로 detailPost로 지정해준 모습이다.

getDetail: async (id: number) => {
return await instance.get<detailPost>(`/api/post?id=${id}`);
}
이렇게 하면 어떤 점이 좋은데?
 당연히, 타입을 사용하기 때문에 받아온 데이터의 deps를 잘못 작성해서 렌더링이 안되는 에러가 없을 것이고, 명세서에 적힌 타입을 지정해주기 때문에 API 명세서와 서버가 보내는 값이 일치한다면 모든 값에 대해서 타입지정이 되는 것이기 때문에 반환되는 값의 타입으로 인한 에러가 없어질 것이다. 이와 마찬가지로 상태로 넘겨주는 로직이 있다면 여기에서도  타입에러를 방지할 수 있다.
 그리고 자동완성 기능을 통해 생산성 향상도 기대할 수 있다는 점!
반응형
Comments