지식 창고

TanStack Query의 isFetching vs isLoading 차이점TanStack Query(구 React Query)는 비동기 데이터 관리를 강력하게 도와주는 라이브러리입니다. 데이터를 가져올 때 isLoading과 isFetching이라는 두 가지 상태를 제공하는데, 이 둘의 차이를 이해하는 것이 중요합니다.1. isLoading이란?isLoading은 데이터를 처음 로드할 때(initial loading) true가 됩니다. 즉, 쿼리가 처음 실행되면서 아직 캐시에 데이터가 없는 경우를 의미합니다.예제 코드isLoading이 true가 되는 경우쿼리가 처음 실행될 때캐시에 해당 데이터가 없는 경우isLoading이 false가 되는 경우데이터가 성공적으로 로드된 후에러가 발생한 경우2. ..

최근에 React 프로젝트르 세팅하다가 React-Hot-Loader 문서를 보니, React Fast Refresh라는 새로운 도구가 나온 것을 발견했다. React-Hot-Loader를 만든 페이스북 개발자 Dan Abramov는, 기존 핫 로더에 한계가 있다고 평가하면서, 앞으로는 React Fast Refresh로 대체될 것이라 생각한다고 의견을 밝혔다. 기존의 핫 로더는, 대규모 앱에서 코드변경, export/import 문제, Typescript관련 문제 등 앱이 매우 느리게 동작하는 것이 문제였다. 그 대안으로 나온게 Fast Refresh이며, 2019년 React Native 0.61에 처음 도입 되었다. 그렇다면 React Fast Refresh가 하는 일은 무엇인가? 앱 전체를 다시 ..

+ 추가SSR에 대해 아티클을 작성한지 어느덧 2년이 되어간다. 그동안 Webpack, Babel, React 버전이 올라감에 따라 프로젝트의 설정방법과 몇몇 API가 변경되었다. 따라서 가장 최신으로 SSR 프로젝트를 구성하는 방법으로 다시 글을 작성했다. Next.js 같은 좋은 프레임워크도 있지만 프레임워크에는 커스터마이징에 한계가 있으므로, 이 글에서는 직접 만들 경우엔 어떻게 하는지에 초점을 맞춘다. 소스코드는 Github에 올려두었으므로 참고하길 바라며, 사용한 라이브러리와 툴은 아래와 같다. Babel 7Webpack 4React 16.7.x 작년과 올해 들어 가장 각광받는 JavaScript Library를 뽑아보면 React도 그 안에 들어갈 것이다. React의 장점을 생각해보면 V..