# react-query

kimbiyam

React Query 패키지와 http 통신을 위한 axios 패키지를 설치합니다.react-query를 사용 하기 위해선 우선 사용하고자 하는 컴포넌트를QueryClientProvider 컴포넌트로 감싸주고 QueryClient 값을 Props로 넣어줘야 합니다.앱

woohm402

Query react-query에서 query는 다음과 같이 정의된다. > declarative dependency on an asynchronous source of data that is tied to a unique key unique한 key값에 의해 결정

woohm402

react-query에는 분명하게 알아둬야 할 default한 사항들이 있다. 모르고 넘어가면 나중에 왜 안 되는지 골치아플 확률이 높으니 분명하게 알아두자.useQuery vs useInfiniteQuery이 둘의 차이는 데이터를 얼마나 오래 믿고 가지고 있을 거냐는

woohm402

최근 리덕스를 쓰던 중 리덕스 미들웨어의 자기모순적인 태도와 방대한 보일러플레이트 코드 때문에 다른 상태관리 툴을 고려해보았고, 최근 유행인 React-Query를 공부해 보기로 했다.이 시리즈는 react-query의 공식문서를 적당히 요약하고 필자의 뇌피셜을 합하여

yrnana

A 쿼리 인스턴스가 mount 됨네트워크에서 데이터 fetch 하고 A라는 쿼리키로 캐싱함이 데이터는 fresh 상태에서 staleTime(기본값 0) 이후 stale 상태로 변경됨A 쿼리 인스턴스가 unmount 됨캐시는 cacheTime(기본값 5min) 만큼 유지

commitnpush

개요 애플리케이션의 상태는 클라이언트 자체의 상태와 서버에서 전달받는 상태로 구분할 수 있다. 일반적으로 두 종류의 데이터를 모두 contextAPI, redux, mobx 등의 전역 상태 관리 도구로 함께 관리하는데 react query는 이러한 편견에서 벗어날 수

sv002

낙관적 업데이트로 서버업데이트시 UI에서도 어차피 업데이트 할것이란 (낙관적인) 가정으로 미리 UI를 업데이트 시켜주고 서버를 통해 검증을 받고 업데이트 Or 롤백하는 방식이다.react-query를 쓰면서 장점이라 느낀 것 중 하나

eomttt

개인프로젝트를 진행하는것을 좋아하는데, 이유는 일단 내가 만들고 싶은것을 만들기 때문에 흥미가 생기고, 새로운것들을 많이 시도해 볼 수 있어서 좋아합니다.이번에는 Poke API 를 사용하여 간단한 포켓몬 도감을 만들어 보려고 합니다.일단 사용하려는 stack 은 AP

aspalt85

위의 영상을 복습하는 글이다.

velopert

40% 이상의 개발자들이 리액트 프로젝트에서 사용하고 있는 리덕스(Redux), 더 잘 쓰는 방법을 알려드립니다. 리덕스 말고 다른 선택지, 그리고 리덕스를 사용 할 떄 알고있으면 유용한 팁들을 다룹니다.

yaytomato

SWR is a React hooks library for data fetching built by vercel (maintainer of Next.js). Enables fast, lightweight, reusuable data fetching with built-