useSWR 사용하기.

useSWR은 먼저 캐시로부터 데이터를 반환한 후 fetch 요청을 하고 최종적으로 최신화된 데이터를 가져올 수 있다. 

또한 useSWR은 한 줄의 코드로 프로젝트 내에서 데이터 가져오기 로직을 단순화 할 수 있다.

Next.js에서 만든 팀이 만들었기 때문에 공식문서가 자세하고 편하게 되어있다.

 

공식문서에 따르면 

• 빠르고, 가볍고, 재사용 가능한 데이터 가져오기
• 내장된 캐시 및 요청 중복 제거
• 실시간 경험
• 전송 및 프로토콜에 구애받지 않음
• SSR / ISR / SSG support
• TypeScript 준비
• React Native

 

yarn add swr

or

npm install swr

 

자세한 예제는 아래의 공식 문서에서 확인하면 된다.

한글화가 잘 되어 있기때문에 문제 없이 볼 수 있다.

 

https://swr.vercel.app/ko

데이터 가져오기를 위한 React Hooks – SWR