재사용 가능한 표 컴포넌트를 타입으로 잠그기
컬럼 배열에서 정렬 키 union을 파생하고, 도메인마다 다른 행 타입을 합성 컴포넌트 조각들까지 전달하면서 배운 것 — 그리고 그 과정에서 계속 튀어나온 변성 이야기
- 값에서 타입을 파생하는 문법과 const 타입 파라미터는 세트다. 하나가 빠지면 나머지도 에러 없이 조용히 무의미해진다
- const 선언에는 타입 파라미터를 못 붙이므로, 제네릭 context는 함수 클로저 안에서 만들어야 한다
날짜별 업무 및 학습 회고입니다. 매일 무엇을 했고, 무엇을 배웠는지 기록합니다.
컬럼 배열에서 정렬 키 union을 파생하고, 도메인마다 다른 행 타입을 합성 컴포넌트 조각들까지 전달하면서 배운 것 — 그리고 그 과정에서 계속 튀어나온 변성 이야기
코드 생성 도구에게 작업을 맡길 때 판정 기준을 문서로 먼저 못 박고, 코드·화면·리뷰 의견을 증거로 강등하며, 확신이 부족하면 멈추게 만드는 설계를 정리했다
분리된 확장 실행 공간에서 메시지 기반 RPC로 저장을 요청하고, 변경 신호와 쿼리 무효화로 다른 화면이 단일 원본을 다시 읽게 한 흐름을 정리했다
rewrite가 업스트림 3xx를 그대로 흘려 만든 무한 리다이렉트, 조합이 끝나기 전 확정된 한글 입력, 16:9로 추측하던 이미지 비율 — 중간 계층의 통과와 추측을 점검하며 배운 것
5년 넘은 구형 브라우저에서 앱이 통째로 죽는 버그를 고치며 배운 것 — 여러 기능이 동시에 죽으면 하이드레이션을 의심하고, 문법 다운레벨과 런타임 폴리필을 분리하고, 폴리필은 feature-detect로 옛 브라우저에만 로드하고, 스모크는 실제 인터랙션을 실행한다
네이티브 앱 같은 로딩 스플래시를 첫 페인트부터 띄우되 봇엔 숨기는 인라인 스크립트 기법, 그리고 오프라인 퍼스트에서 '내 쓰기 즉시 반영'을 staleTime이 아니라 invalidate와 durable 큐로 만드는 법
랜딩 성능을 개선하다 배운 것 — LCP가 느린데 이미지가 작으면 render delay(hydration)를 의심하고 클라이언트 JS를 빼는 것, 화려한 스크롤 모션보다 진입 스태거 리빌, 구조화 데이터는 화면과 1:1
새로고침마다 보였다 안 보였다 하는 이미지 버그를 추적하다 배운 세 가지 — objectURL 수명 레이스, 브라우저 전용 lib의 테스트 hang 방지, 서비스워커 셸 폴백을 navigation 요청으로 한정하기
가상화 무한 리스트+스크롤 복원 기능을 다른 스택으로 옮기며 배운 것 — 구현 코드가 아니라 겉보기 행동을 계약으로 적는 클린룸 방식, 그리고 무한 스크롤의 안정성을 좌우하는 offset vs keyset 페이지네이션
구조화 데이터와 가시 FAQ 일치, auth 해소 후 fetch 게이트, 분석 이벤트 팬아웃 파사드, prefers-reduced-motion JS 전환 게이트를 범용 개념으로 정리한 TIL
도구·인프라를 정비하며 마주친 셸 단어 분리, workspace 배포 재작성, CI 러너 불일치, fail-open 가드를 범용 개념으로 정리한 TIL
Canvas 별 노드, Service Worker SWR·generation 보안, CI flaky 분류, 디자인시스템 ESLint guardrail을 하루에 정리한 TIL
검색 노출용 JSON-LD 리치화, .{locale}.md 파이프라인, next-intl Link 수정, BFS 로컬 그래프, knowledge publish까지 한 축으로 정리한 TIL
GSAP 없이 sticky scrolly·CSS keyframes·view-timeline으로 TIL→Knowledge 승격 데모와 파이프라인 섹션을 구현한 하루
단일 dialog 안 document push와 @layer 기반 editor CSS 분리로 peek UX·테마 커스터마이징을 맞춘 하루
page push/peek navigator와 read-only viewer entry 분리로 포트폴리오 데모 깊이와 번들을 동시에 맞춘 하루
터치 드래그·리사이즈 안정화와 unoptimized 환경에서 이미지 프록시로 전송 바이트를 줄인 하루
불변 트리 에디터에서 한 줄만 고쳐도 전체가 다시 그려지는 문제를, 테스트로 먼저 고정한 뒤 정규화 projection과 id별 구독으로 행·컨테이너 리렌더를 줄인 과정
webpack splitChunks 함정, 하이브리드 에디터 크로스블록 범위 연산, selectionchange·scroll anchor 패턴, Context 구독 분리
fractional ordering, optimistic rebase, IME defer, keyboard undo 위임, scoped popover, Jest ESM shim 등 범용 패턴 정리