☘️ 시작하기 앞서 현재 진행하고 있는 프로젝트를 구현하면서 사용한 React Query(Tanstack Query) 의 staleTime 에 대해 알아 볼 것이다. 이를 사용하면서 불필요한 API 요청을 줄일 수 있으며 매우 유용하다 생각이 들어 글로 작성하게 되었다. 그 밖에도 React Query 를 사용하여 단순하게 데이터를 요청하는 게 아니라 유용한 기능들이 있다는 것을 직접 사용하면서 알게 되었다. 특히 프로젝트를 진행하기 전에 공식문서를 한국어로 번역한 깃허브 글을 본 것이 매우 도움이 되었다! 혹시 React Query 를 사용한다면 이 글을 정독하는 것을 추천한다 GitHub - ssi02014/react-query-tutorial: 😃 TanStack Query(aka. react qu..

☘️ 시작하며...React 18 의 기능으로 Suspense 가 있다. 그러면 Suspense 가 무엇일까? Suspense하단에 있는 일부 컴포넌트가 아직 렌더링할 준비가 되지 않은 경우 로딩을 나타낼 수 있도록 해주는 것[출처]: 공식문서이러한 Suspense 를 서버 상태관리 라이브러리인 TanStack Query(React Query) 와 함께 안정적으로 사용할 수 있다. 그래서 어떻게 사용하지는 지 알아볼 예정이다. ☘️ Suspense만약 TanStack Query 에 대해 잘 모를 경우 해당 게시물에서 이에 대한 내용을 확인할 수 있다. Suspense 세팅React 에 내장된 Suspense 을 import 해주고import React, { Suspense } from 'react';Su..

시작하며...내 블로그에 [React] 리액트 쿼리(React-Query) 사용 방법 이런 게시물이 있다.그리고 당시 했던 프로젝트를 보니깐 React Query 의 버전이 3이었다. 그러나 현재 V5 까지 있으며, React 이 외에도 Vue 등에서도 사용이 가능해지면서 TanStack Query 로 이름을 바꿨다고 한다. 그래서 더 자세히 공부할 겸 새로운 내용들을 알기 위해 글을 작성하기로 했다. TanStack Query V5정의TanStack Query 란 무엇일까? TanStack Queryit makes fetching, caching, synchronizing and updating server state in your web applications a breeze.웹 애플리케이션에서 서버..

[React] TanStack Query(리액트 쿼리) V5☘️ 시작하며... 내 블로그에 [React] 리액트 쿼리(React-Query) 사용 방법 이런 게시물이 있다. 그리고 당시 했던 프로젝트를 보니깐 React Query 의 버전이 3이었다. 그러나 현재 V5 까지 있으며, React 이jjang-j.tistory.com현재 게시물보다 위에 게시물 추천  시작하며...지난 동아리 프로젝트때 React-Query + recoil 조합으로 개발을 하였다.그래서 간단하게 React-Query를 활용해서 api 데이터를 요청하고 보내는 방법에 대해 설명하기 위해 글을 작성하기로 했다.(React-Query를 사용했던 경험으로 글을 작성하는 거라서 자세한 내용은 공식 문서에) TanStack Query ..