Frontend/React Query2 useQuery React Query의 useQuery는 React 어플리케이션에서 데이터를 관리하고 서버와의 통신을 효율적으로 처리할 수 있도록 도와주는 훅입니다. useQuery는 데이터를 가져오는 과정과 상태관리를 간소화하며, 캐싱, 리패칭, 로딩/에러 상태 관리 등을 자동으로 처리해줍니다. useQuery(queryKey, fetchFunction, options); 첫번째 매개변수로 쿼리키 query key - 데이터를 구분하기 위한 키입니다.- 배열로 작성됩니다.- 예를 들어, ['posts'] 두번째로 데이터를 가져오는 함수 fetch function- 데이터를 가져오는 비동기 함수입니다. 세번째로 옵션 객체 option object 를 받을 수 있습니다. 옵션들을 보겠습니다. 1. enabled- 기.. 2024. 12. 13. Suspense, ErrorBoundary 그리고 React Query 항상 코드 짤때마다 고민이 많았다.주로 데이터를 가져올 때 try...catch를 사용하는 경우가 많았는데 이 경우에 문제(?) 점이 있다. "하... 이게 맞나.." 하는 생각이 든다는 것이다. 해당 api를 선언하는 함수를 만들어주고, 그 안에 try...catch...를 때려박아주고 아닐 시의 UI 처리까지 그걸 매번 반복해야했다. 그리고 그 뿐인가 api를 호출할 때, 데이터를 지금 가져오고 있는지.. 가져오는데 실패했는지.. 이것 또한 UI에서 보여주어야 하기 때문에 보일러 플레이트 코드가 계속 늘어났다. 이번에 리액트 19버전이 나왔다고 해서 봤는데 useTransition을 쓰거나, use를 쓴다던지 이런 불편함을 해소하는데에 많이 초점이 맞춰져 있는 것 같았다. 그래서 아예 하는김에.. 2024. 12. 12. 이전 1 다음