본문 바로가기

전체 글

(171)
🌟[매일메일] 이벤트 전파(Event Propagation)란? (FE.250106) (개발자 강화/프론트엔드) 2025. 2. 14. 17:42 연휴엔 역시 카공이지~ ☕ 이것도 진짜 FE 근본 질문인 것 같음(25.01.26. 최초 작성 - 2025.02.14. 추가)이벤트 전파DOM 구조에서 이벤트가 발생했을 때, 어떻게 상위 요소와 하위 요소 간에 전달되는지 정의하는 매커니즘웹 페이지에서 요소 간의 상호작용을 제어하는 데 중요한 역할을 하며, 복잡한 사용자 상호작용 효율적으로 관리.  캡처링 단계 - 타겟 단계 - 버블링 단계로 구성됨. event.eventPhase를 사용하면, 현재 이벤트 흐름 단계(캡처링:1, 타깃: 2, 버블링:3)를 파악할 수 있음 기본적으로 브라우저는 이벤트 전파를 버블링 단계에서 처리하도록 설계되어 있음 [1단계] 캡처링(Capturing) 단계이벤트가 DOM 트리 최상위 요소(document)에서 시작해서, 이..
[개발, 매일메일] @tanstack/react-query v4/v5 차이...(suspense, error-boundary 처리) (개발자 강화/프론트엔드) 2025. 2. 14. 17:13 제가 직접 겪고 몸소 겪은 후 나중에 같은 실수 안반복하려고 정리합니다... React로 개발하다보면 react-query를 써야하는 경우가 있다 Q. @tanstack/react-query 왜 쓰나요?안좋은 답변: 친구들이 쓰길래요 (x) 한줄요약비동기 데이터(fetching, caching, 갱신 등)을 효율적으로 관리하고, 이로 인한 복잡도를 줄이기 위함 같은 데이터를 여러 곳에서 사용하는데 매번 api를 요청한다면... 필요없는 네트워크 트래픽이 늘어남react query는 query key로 캐시된 값을 불러와서 사용하는 등의 작업이 가능함 캐싱이 편해서 GOAT임예전에 연구실에서 개발할 때 몇 백개의 문제 데이터를 미리 가져와서 클라이언트가 들고 있어야 하는...뭐 그런 개발 시나리오가 있었는..
[매일메일] 민감한 데이터는 어디에 저장해야 할까? (FE.250211) (개발자 강화/프론트엔드) 2025. 2. 11. 15:51 localStroagesessionStorage데이터 지속성영구적 저장브라우저 닫거나, 장치 재부팅해도 유지현재 브라우저 세션 동안만 유지브라우저 탭 닫으면 데이터 삭제범위동일한 도메인 내의 모든 탭에서 데이터 공유동일한 도메인 내에서 탭 간 데이터 공유 안함예시테마 설정(다크모드)장바구니 데이터로그인 후 인증 데이터 일시 저장특정 탭에서만 사용할 데이터 관리목적장기 데이터 저장탭 단위 데이터 관리일시적 데이터 저장보안영구적으로 저장되므로 민감한 데이터 저장 주의세션 종료 시 데이터가 자동으로 삭제 되지만보안적으로 완전히 데이터를 방어할 수는 없음 Cookie데이터 지속성만료 시간 설정 가능범위동일한 도메인 내 모든 탭에서 공유예시세션 유지(로그인 상태)추적 정보 저장(광고 추적, 사용자 방문 기록)이 ..