목록reactQuery (2)
공부혜옹
MSW(Mock Service Worker) 사용이유 react query 테스트 코드 작성 중 실제 api를 호출해서 실제 db에 접근하는것을 방지해야겠다는 생각을 하였고 mock server를 어떻게 구성할까 서치하던 중 msw를 발견하였다. MSW의 기본 컨셉 test시 실제 api 호출이 일어나면 해당 호출을 가로챈 후 내가 커스텀해놓은 mock server code를 통해 reponse를 돌려 준다 따라서 실제 data에 접근하지 않는다. MSW 라이브러리 설치 $ npm i -D msw server setup 나는 test 폴더 하위에 mock 폴더를 생성하여 mockserver setup과 그 과정에서 사용할 mock data를 정의해주었다. 아래와 같이 특정 api 주소를 호출 시 어떤 r..
React-Query는 캐싱을 위해 유니크한 query key를 사용하는데 한 컴포넌트에서 쿼리를 실행한 후 다른 컴포넌트에서 동일한 쿼리를 실행했을때 캐싱되어있는 쿼리가 있다면 가져온다. 이렇게 동일한 캐싱된 데이터를 Key하나로 여기저기서 사용할 수 있는데 이때 쿼리값을 대부분 useQuery(["test"],fetch) 이런식으로 문자열 배열과 같은 값들을 하드코딩 해준다. 내가 생각한 문제 이때 나는 의문이 들었다. 여러 컴포넌트에서 사용할 Key인데 어떻게 무결성을 유지하며 사용할까..? useQuery(["test"],fetch) useQuery(["tast"],fetch) 다양한 컴포넌트에서 동일한 query를 사용해야할때 오타가 난다면? 내가 가져올 데이터를 위한 Query Key가 이미 ..