RTK Query 알아보기 (feat.Redux Toolkit)

https://redux-toolkit.js.org/introduction/getting-started#rtk-query

Getting Started | Redux Toolkit

RTK Query 소개

RTK Query는 @redux/toolkit 패키지내에서 애드온으로 제공됩니다.

 

데이터 fetching 및 캐싱의 유즈 케이스를 해결하기 위해 개발되었으며 애플리케이션의 API 인터페이스 계층을 정의하기 위해 작지만 강력한 tool set를 제공합니다.

 

웹 애플리케이션에서 데이터를 로드하는 일반적인 경우를 단순화하여, 데이터 fetching 및 캐싱 로직을 직접 작성할 필요가 없도록 도와줍니다.

 

RTK Query는 Redux Toolkit 코어 위에 구축되며, 내부적으로 Redux를 사용합니다.

 

RTK Query를 사용하기 위해 Redux나 RTK에 대한 지식이 필요하지는 않습니다.

하지만 Redux가 제공하는 모든 추가 블로벌 store 관리 기능을 활용하려면, "Redux DevTools 브라우저 확장"을 설치해서 요청 및 캐시 동작의 타임라인을 확인할 수 있습니다.

 

RTK Query APIs:

1. createApi()

RTK Query의 핵심 기능입니다. 데이터를 가져오고(fetch) 변환하는(transform) 방법에 대한 구성을 포함해서, 엔드포인트(진입점)들에서 데이터를 찾는 방법을 기술하는 endpoint 세트를 정의합니다.대부분의 경우 "base URL에 하나의 API slice"를 원칙으로 app별로 하나씩 작성합니다.

2. fetchBaseQuery()

요청(request)를 단순화하는 것을 목표로 하는 fetch를 감싸는 래퍼(wrapper) 입니다.대부분의 사용자를 위해 createApi에서 사용할 baseQuery로 사용됩니다.

3. <ApiProvider />

Redux store가 없는 경우, 공급자로 사용할 수 있습니다.-> redux store 없이 RTK Query 사용할 경우

4. setUpListeners()

refetchOnMount 및 refetchOnReconnect 동작을 활성화하는 데 사용되는 유틸리티입니다.

 

---

 

더 자세한 내용은 다음 포스트에서 정리해 보겠습니다.

 

감사합니다.