지식 창고

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

추상 팩토리 패턴과 팩토리 메서드 패턴에 이은 세 번째. 빌더 패턴(Builder Pattern)이다. 개인적으로 빌더 패턴은 앞의 두 패턴보다 자주 사용하고 있는데, 오늘은 design-patterns-JS의 예제를 가지고 설명을 해보도록 하겠다. 빌더 패턴은 무언가를 뭔가를 조합해주는 패턴이라 이해하면 쉽다. 웹에서 많이 사용하는 Request Query를 예를 들어보도록 하자. Request(리퀘스트)는 크게 URL, METHOD(GET, POST, PUT, DELETE), 그리고 데이터 부분으로 이루어져 있다. 이제 우리는 어떤 리퀘스트 정보를 담고 있는 클래스를 만들어 보도록 하자. class Request { constructor(url, method, data) { this.url = url..

나는 개발할 때 Chrome 개발자도구의 console을 굉장히 자주 사용하는데(대부분의 개발자들이 그럴 것이라 생각한다), 오늘은 크롬 개발자도구의 편리한 기능과 잘 쓰진 않지만 알아두면 좋은 기능들을 한 번 정리해 보고자 한다.Console OpenWindows / Linux: Ctrl+Shift+JMac: Cmd+Opt+J개발자 도구가 열린 상태: ESCConsole Clearclear() 입력Ctrl+LLog Options console 오른쪽 상단위 톱니바퀴를 누르면 옵션을 볼 수 있다. 주로 사용하는 기능은 다음과 같다.Hide network: 404 또는 500 오류 등은 보여주지 않는다.Log XMLHttpRequst: XML Request를 기록Preserve log: refresh나 탐..