Frontend

백엔드 API 스펙 변경에 대응하기 위해 유틸리티 타입을 활용한 타입 관리 방식을 도입했다. Partial, Pick, Omit 등을 조합해 중복을 줄이고 유지보수성을 높였다.

API 응답 처리 유틸 함수를 만들다가 Generic 타입 추론이 제대로 되지 않는 문제를 겪었다. TypeScript의 타입 추론 한계와 이를 해결한 방법을 정리했다.

레거시 프로젝트에 strictNullChecks를 점진적으로 적용하면서 겪은 문제들과 해결 과정을 정리했다. Optional Chaining과 Nullish Coalescing을 함께 사용하니 코드가 훨씬 안전해졌다.

재택근무 환경에서 레거시 프로젝트의 모달 컴포넌트가 z-index 충돌로 제대로 표시되지 않는 문제가 발생했다. React Portal을 사용해 DOM 구조를 분리하여 해결한 과정을 기록한다.

Styled-components로 작업하던 프로젝트에 Tailwind CSS를 도입했다. 초기 설정과 팀 적응 과정, 그리고 실제 개발 속도 변화를 정리했다.

재택근무 중 프로젝트 성능 이슈를 마주했다. 특정 페이지에서 input 입력 시 전체 리스트가 리렌더링되면서 타이핑이 버벅이는 문제였다. React.memo와 useCallback을 적용하며 배운 것들을 정리했다.

React 17 RC가 공개되면서 새로운 JSX Transform이 도입됐다. 더 이상 파일마다 React를 import 하지 않아도 되는 변경 사항과 실제 프로젝트 적용 과정을 정리했다.

프로젝트를 TypeScript 3.9로 업그레이드하면서 빌드 속도가 체감상 30% 이상 빨라졌다. 특히 incremental 모드에서의 개선이 눈에 띄었고, 몇 가지 tsconfig 최적화를 함께 적용했다.

프로젝트에서 Enum을 사용하다가 번들 사이즈와 타입 안정성 문제를 겪었다. Union Type으로 전환하면서 얻은 이점들을 정리했다.

재택근무 중 프로덕션에서 발생한 런타임 에러로 전체 화면이 깨지는 문제를 겪었다. React ErrorBoundary를 도입해 에러 격리와 사용자 경험을 개선한 과정을 정리했다.