[React] React Query를 사용하는 이유

1. React Query의 특징

1. 캐싱에 대해서 자동적으로 다루고, axios를 통하여 데이터 패칭을 하면 우리가 데이터 필요할때마다 새로 얘가 데려옴 (새로고침을 해야함). 새로고침의 횟수를 몇초에 한번 이상 안하더라도 깨끗한 데이터로 가정할 수 있는 시간을 axios로 사용할 수 없다 (캐싱을 수행해줌)

2. useQuery를 통하여 패칭을 해야 하는 함수를 이야기한다.
   로딩스테이트, 에러에 대한 처리, 넘어온 데이터 값을 일일이 확인하지 않고, 하나의 Hook이 응답을 해줄 수 있다!

function Example() {
   const { isLoading, error, data } = useQuery('repoData', () =>
     fetch('https://api.github.com/repos/tannerlinsley/react-query').then(res =>
       res.json()
     )
   )
 
   if (isLoading) return 'Loading...'
 
   if (error) return 'An error has occurred: ' + error.message
 
   return (
     <div>
       <h1>{data.name}</h1>
       <p>{data.description}</p>
       <strong>👀 {data.subscribers_count}</strong>{' '}
       <strong>✨ {data.stargazers_count}</strong>{' '}
       <strong>🍴 {data.forks_count}</strong>
     </div>
   )
 }

이렇게 말이다.. isLoading을 통하여 로딩에 대한 처리, error를 통하여 에러에 대한 처리를 하나의 Hook으로 처리 가능하게 됨. LoadingState나, errorState를 만들 필요가 없다는 것이지.
코드의 가독성을 높일 수 있다. 좋다!!

https://react-query.tanstack.com/
위의 사이트 참고!