# react-query

raverana96

react-query에서 useMutaion을 진행한 후에 queryCient.invalidateQueries() 사용하면 정삭적으로 해당 key에 대해 다시 fetching을 해온다고 했는데, 작동하지 않았음.mutation.mutate의 후속 작업(callback)

0307kwon

리액트 쿼리로 에러처리하다가 눈물 흘린 경험 😥

familyman80

공식 홈페이지 https://react-query.tanstack.com/guides/window-focus-refetching 의 내용을 주로 사용할 만한 것들을 발췌해서 작성. React Query React를 위한 강력하고 성능 좋은 데이터 동기화 "전역 상태

woohm402

글을 작성하기에 앞서, 저는 react-query를 올해 3월부터 시작해서 회사 직무에서 단 반년밖에 사용해보지 않았다는 부분을 강조드립니다.react-query는 tanstack에서 만든 서버사이드 상태 관리 라이브러리입니다. 서버사이드 상태가 뭘까요? 이들은 다음과

familyman80

마인드케어 제작당시에는 swr 로 데이터패치를 했지만,아쉬운 점이 get 요청으로만 제작되었다는 점이다.물론, axios 에서 post 요청이나 delete put 요청등을주고 난후에, mutate 의 활용으로충분히 유용하게 사용할 수 있기에, swr 도 매우좋은 툴이

familyman80

일단, Boiler Plate 를 하나 만들어 두려고 한다.어느 프로젝트에서도 항상 사용할 수 있는 것을 목적으로 한범용 템플릿을 만들 예정.Nextjs With TypeScript폴더구조components / elements (최소단위 재사용, button, inpu

yrnana

redux를 사용할때 비동기 처리가 필요하다면 툴킷에 내장된 redux-thunk를 사용하자. 그런데 만약 서버 데이터를 비동기로 받아오기 위해 redux와 비동기 미들웨어가 필요한 상황이라면 이를 redux로 해결한다는 생각을 고심해 볼 필요가 있다.

0307kwon

일관된 에러 처리는 개발자도 춤추게 한다 💃

yrnana

`react-query`는 전역 상태관리 라이브러리가 아니라 서버와 클라이언트 간의 비동기 작업을 쉽게 해주는 라이브러리다.

ypd03008

목적 : 클라이언트 상태 + 가져온 서버데이터 상태 관리를 잘 하자.(리트라이,리프레쉬,refetch,caching,invalid cache, optimistic-mutation .. etc)Global State라는 말을 쓰지 말자 : 전역 state는 Client와

cadenzah

React 앱에서 사용되는 다양한 유형의 상태를 알아보고, 이를 효과적으로 제어하기 위한 라이브러리들을 살펴봅니다.

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), 더 잘 쓰는 방법을 알려드립니다. 리덕스 말고 다른 선택지, 그리고 리덕스를 사용 할 떄 알고있으면 유용한 팁들을 다룹니다.