Daily Front_Minhhk

📌 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function. 컴포넌트가 언마운트된 후에 상태 업데이트를 시도하기 때문에 발생한다. 컴포넌트가 언마운트될 때 진행 중인 비동기 작업을 취소하거나, 컴포넌트의 상태를 업데이트하지않도록 해야한다. → useEffect훅 안에서 클린업 함수를 반환하여, 컴포넌트가 언마운트되기 전에 필요한 정리 작업! → dataFet..

💡 tanstackQuery 가 데이터를 캐싱 한다는 점이 중요!! isLoading 및 isFetching 속성은 데이터의 로드 상태를 나타내는 데 사용한다 isFetching 비동기 쿼리 함수가 해결안된 상태 → true (데이터를 가져오는 상태) isLoading isFetching 참이면서, 쿼리에 대한 캐시된 데이터가 없는 상태 isLoading 이 참이면, isFetching 도 참이다! 요약하면 isLoading 은 처음 data Fetching 을 할 때, isFetching은 data Fetching 요청을 다시 할 때 (캐시된 데이터가 있을 때,,) 📌 즉, 결론적으로 isLoading과 isFetching은 비슷하게 '로딩' 이라는 개념을 사용하지만 기존에 캐시된 데이터가 있느냐 에 ..

초기값 : 초기에 렌더링 되는 값 가장 먼저 렌더링될때 순간적으로 보여질 수 있는 값이기도 하다. 초기값 지키지 않을 경우? 렌더링 이슈, 무한 루프, 타입 불일치로 의도치 않는 동작 => 런타임 에러 넣지 않으면? undefined 상태를 CRUD => 상태를 지울때도 초기값을 잘 기억해놔야 원상태로 돌아간다. 빈값? null 처리를 할때 불필요한 방어코드도 줄여준다! 업데이트 되지 않는 상수나 참조객체 들은 컴포넌트 외부에 빼둔다. 플래그 값을 이용해서 랜더링, 하나하나의 조건의 state에 두고 분기처리 보단 낫다 * 플래그 값 * 프로그래밍에서 주로 특정 조건 혹은 제어를 위한 조건을 불리언으로 나타내는 값 function FlagState() : Element { const isLogin = h..

부모 요소 div 에 relative 를 추가 해주자! 자식 요소에 absolute 사용 했으니 useRef 로 적용할 툴팁의 부모 요소에 ref 걸어주고, bubbleTop 의 state를 활용하여 적용! const [bubbleTop, setBubbleTop] = useState(false); const bubbleRef = useRef(null); useEffect(() => { { const handleClickOutside = e => { if (bubbleRef.current && !bubbleRef.current.contains(e.target)) setBubbleTop(false); }; document.addEventListener('mousedown', handleClickOutside..

📌 소스코드를 실행하는데 필요한 환경을 제공하고 코드의 실행 결과를 실제로 관리하는 영역 식별자(변수, 함수, 클래스)를 등록하고 관리하는 스코프와, 코드 실행 순서 관리를 구현한 내부 메커니즘 → 모든 코드는 실행 컨텍스트를 통해 실행되고 관리된다. 식별자와 스코프는 실행 컨텍스트의 렉시컬 환경 으로 관리 코드실행 순서는 실행 컨텍스트 스택으로 관리 실행 컨텍스트의 구조_ variable Environment (Environment Record, Outer Lexical Environment Reference)자신의 외부 환경에 대한 참조를 갖고 있고, 호이스팅 된 변수 들의 정보가 포함선언된 변수들을 포함한 환경을 나타내는 객체. lexical Environment (Environment Record..

빌트인 객체 표준 빌트인 객체 표준 빌트인 객체는 ECMASCript 사양에 정의된 객체를 말하며. 애플리케이션 전역의 공동 기능을 제공한다. 표준 빌트인 객체는 ECMASCript 사양에 정의된 객체이므로 자바스크립트 실행 환경(브라우저 또는 Node.js 환경)과 관계없이 언제나 사용할 수 있다. 표준 빌트인 객체는 전역 객체의 프로퍼티로서 제공된다. 따라서 별도의 선언 없이 전역 변수처럼 언제나 참조할 수 있다. 호스트 객체 호스트 객체는 ECMASeript 사양에 정의되어 있지 않지만 자바스크립트 실행 환경 (브라우저 환경 또는 Node.js 환경에서 추가로 제공하는 객체를 말한다. 브라우저 환경에서는 DOM. BOM, Canvas. XMLHttpRequest. fetch, requestAnima..