Frontend

기술 기록

리액트 이전의 프론트엔드 상태관리 역사 정리

리액트가 등장하기 전, 순수 JS부터 jQuery, Backbone, Knockout, AngularJS까지 상태관리가 어떻게 진화해왔는지 정리한 학습 노트다.

Swiper v11에서 slideTo(0)이 일으킨 페이지 스크롤 부작용을 피하려고 setTranslate + updateActiveIndex 조합으로 우회한 기록.

인스타그램·카카오톡 인앱브라우저에서 무너지던 소셜 로그인·본인인증·결제 플로우를 User-Agent 분류와 듀얼 채널 통신 패턴으로 다시 세운 작업 회고.

Pages Router 기준 SSR·SSG·ISR이 매번 헷갈렸다. 셋을 한자리에 두고 동작 방식과 트레이드오프를 정리했다.

채팅 UI에 역방향 무한 스크롤을 붙이며 scrollHeight 측정 타이밍, instant 캐스팅, overflow-anchor 대안까지 짚었다.

코드 한 블록의 실행 시간을 잴 때 performance.now()를 어떻게 쓰고, Date.now()와는 무엇이 다른지 정리했다.

DNS 조회부터 Composition까지, 브라우저가 웹사이트를 띄울 때 내부에서 벌어지는 흐름을 Construction과 Operation 두 단계로 짚어봤다.

ToDo 리스트를 만들면서 Redux Toolkit을 처음부터 끝까지 한 번 깔아본 기록. 스토어·타입·액션·리듀서·셀렉터·디스패치까지 7단계로 정리했다.

store 하나에 상태를 모으고 dispatch·reducer·subscribe로만 손대게 만드는 Redux의 동작 원리를 따라가며 정리했다.

todo 아이템을 마우스로 끌어 왼쪽으로 밀어내는 슬라이드 동작을, React 마우스 이벤트와 transform으로 구현했다.