Frontend

프로젝트 규모가 작은데 Redux를 도입하는 것이 과한 것 같아 고민하던 중, React 16.3에서 새로 개선된 Context API를 사용해봤다. Prop drilling 문제를 해결하면서도 보일러플레이트를 최소화할 수 있었다.

레거시 코드를 리팩토링하면서 대량의 데이터를 처리하는 부분에서 성능 이슈가 발생했다. forEach와 전통적인 for문의 성능 차이를 측정하고, 실무에서 어떤 선택을 해야 할지 정리했다.

여러 페이지에서 반복되는 데이터 fetching 로직을 HOC로 처리하다가 타입 추론 문제에 부딪혔다. Render Props 패턴으로 전환하면서 타입 안정성과 재사용성을 모두 확보한 과정을 정리했다.

소규모 프로젝트에서 Redux를 걷어내고 React 16.3의 Context API로 전환했다. 보일러플레이트가 줄고 번들 사이즈도 개선되었지만, 트레이드오프는 분명히 존재했다.

Angular 6로 업그레이드하면서 RxJS 6의 pipe 연산자로 전면 변경하는 작업을 진행했다. import 경로 변경과 체이닝 방식의 변화로 인해 예상보다 손이 많이 갔던 경험을 정리한다.

Angular 5에서 6으로 업그레이드하면서 RxJS 6의 변경된 import 구조 때문에 빌드가 깨졌다. 파이프 연산자 방식으로 전면 수정한 과정을 기록한다.

프로젝트를 Babel 7으로 업그레이드하면서 preset 네이밍 변경으로 인한 빌드 실패를 겪었다. @babel 스코프 패키지로의 전환과 .babelrc 설정 수정이 필요했다.

레거시 Angular 4 프로젝트를 5로 마이그레이션하면서 TypeScript strict 옵션을 점진적으로 적용했다. 기존 코드베이스에서 발견된 타입 안정성 문제들과 해결 과정을 기록한다.

프로젝트에서 간단한 전역 상태 관리를 위해 Redux를 사용했는데, 보일러플레이트 코드가 과도하다는 피드백이 있었다. React 16.3에서 정식으로 추가된 Context API를 적용해 일부 상태 관리를 단순화했다.

프로젝트에서 5단계 이상 컴포넌트를 거쳐 prop을 전달하는 문제가 있었다. React 16.3에 새로 추가된 Context API를 적용해 코드를 개선했다.