프론트엔드 개발 (2) 썸네일형 리스트형 [TanStack Query / React Query] staleTime과 gcTime 이해하기: 데이터 캐싱 1. stale data 데이터의 사용 기간이 지났고, 다시 가져올 준비가(refetch) 되 있는 상태입니다여전히 데이터는 캐시 안에 있습니다데이터를 다시 검증해야 한다는 뜻데이터 새로 고침(refetch) 은 오래된 데이터( stale data )에 대해서만 트리거됩니다자동으로 데이터 새로 고침을 하는 트리거는 컴포넌트 remount 나 브라우져 창의 refocus가 있습니다staleTime 은 데이터의 최대 수명이라고 생각하면 됩니다그러므로 데이터 새로고침 기능을 컨트롤하고 싶다면 이와 관련된 useQuery 의 옵션 중 하나인 staleTime 을조절하면 됩니다(staleTime 이 2초 (2000 ms) 라면 2초 동안에는 데이터 새로 고침이 되지 않습니다 staleTime 은 default 로.. [CSS] 5-2. CSS GRID ( 2차원 레이아웃 ) CSS GRID 란?CSS Grid는 2차원 레이아웃을 구축하기 위한 CSS 속성 집합입니다.CSS Grid의 주요 아이디어는 컨테이너 요소를 행과 열로 나누어 자식 요소로 채울 수 있게 하는 것입니다.2차원 컨텍스트에서 CSS Grid를 사용하면 덜 중첩된 HTML과 더 읽기 쉬운 CSS를 작성할 수 있습니다.CSS Grid는 flexbox를 대체하기 위한 것이 아닙니다.1차원 레이아웃은 flexbox, 2차원 레이아웃은 CSS Grid를 사용하면 됩니다. Flex 와 마찬가지로 부모 태그가 container (바탕화면 또는 바닥) 역할을 하고자식 태그들이 items 가 되어 gird 안에 배치되게 됩니다.container 와 items 들은 각기 다른 속성들을 가지고 있습니다. 1. Grid 컨.. 이전 1 다음