
[React] 비동기 데이터 상태 관리와 TanStack-Query 라이브러리
·
React
대게, 프론트엔드에서 상태관리 하는 데이터를 두 가지로 구분할 수 있다.1. 일반 데이터특징:앱 내부에서 바로 생성되거나 사용되는 데이터.사용자 입력, UI 상태(모달 열림/닫힘, 탭 선택 등), 선택된 아이템 등.비교적 단순하며, 비동기 작업이 필요하지 않음.useState, useReducer 훅을 이용하여 상태 관리2. 비동기 데이터특징:외부 API, 데이터베이스 등에서 가져오거나 저장하는 데이터.일반적으로 서버와 통신해야 하므로 비동기 작업(Promise, async/await)이 필요함.단순할 경우 useEffect, fetch 를 통하여 상태 관리복잡하면 SWR, TanStack Query 등 라이브러리를 이용하여 상태 관리프론트엔드에서 외부 API를 사용하여 데이터를 받아오는 경우는 일반적이..