🏝️ TanstackQuery

: 웹 사이트 메뉴의 열림이나 닫힘, 사용자의 버튼 클릭 여부 등 UI 상태 혹은 유저가 입력 폼에 입력한 데이터 등 서버와 무관하게 웹 브라우저에서만 사용되는 데이터.: 서버에서 가져오는 데이터. 예를 들어 네이버에 접속했을 때 보이는 기사, 글 등.서버에서 데이터를

리액트 쿼리에 존재하는 두 가지 status : query status, fetch status query status: 실제로 받아온 data 값이 있는지 없는지를 나타내는 상태 값.useQuery() 결괏값에서 status 값을 통해 확인 가능.fetch stat

백엔드에서 데이터를 가져오는 일은 내 컴퓨터에 있는 데이터를 가져오기보다 시간이 오래 걸린다. 그런데 유저가 방금 확인한 데이터를 보고 또 보고 반복해서 보는 경우, 매번 데이터를 백엔드에서 받아오는 수고를 덜기 위해 이 데이터를 백엔드 요청 대신 어딘가에 저장해두었다

탠스택 쿼리는 쿼리 키를 기반으로 데이터를 캐시에 저장.포스트 전체를 받아오는 쿼리를 'posts'라는 쿼리키로 관리하는데, 왜 배열의 형태일까?현재 구현하려는 코드스터킷 사이트는 홈 피드와 내 피드로 이루어져있다.홈 피드에서는 모든 포스트를 다 받아와서 보여주고, 내

에러가 발생하면 isError 값이 true가 되고, 이에 따라 에러 메시지를 보여주도록 에러 처리를 구현한다.탠스택 쿼리에서는 에러 발생 시 기본적으로 3번의 재시도를 한다.코드를 테스트 할 때 retry 횟수를 0으로 조정하면 에러 화면을 더 빨리 볼 수 있어서 편

앞서 useMutation() 훅으로 새로운 데이터를 추가했는데, 캐시에 있는 데이터가 업데이트되지 않아 새로고침을 한 후 데이터를 확인해봐야 했다.이때 쿼리 클라이언트의 invalidateQueries() 함수를 사용할면 업로드 이후 자동 refetch가 이루어진다.

데이터를 세 개씩 끊어서 불러오고, 다음 페이지 버튼을 누르면 그 다음 데이터를 세 개씩 받아오는 동작.데이터 받아오는 api 함수가 page와 limit 값을 받도록 한다.(백엔드는 쿼리 파라미터로 page와 limit를 넘겨주면 해당 pagedml 데이터를 limi