React

프로젝트에서 5단계 이상 props를 내려주는 컴포넌트 구조가 유지보수를 어렵게 만들고 있었다. React 16.3에서 정식 출시된 새로운 Context API를 도입해 props drilling 문제를 해결했다.

레거시 프로젝트에서 사용하던 구 Context API를 16.3에서 정식 릴리즈된 새 Context API로 마이그레이션했다. 기존 방식보다 타입 안정성과 가독성이 개선되었다.

React 16.3에서 정식으로 추가된 새 Context API를 프로젝트에 적용했다. 기존 Redux를 전부 대체하진 않았지만, 테마나 언어 설정같은 전역 상태 관리에 유용했다.

기존 Context API의 불편함을 개선한 React 16.3의 새로운 Context API를 프로젝트에 적용했다. prop drilling 문제를 해결하면서도 Redux보다 가벼운 상태 관리가 가능해졌다.

프로덕션에서 발생한 컴포넌트 에러로 전체 앱이 크래시되는 문제를 겪었다. React 16의 Error Boundary를 도입해 예외 처리를 개선한 과정을 정리했다.

React 16.3에서 공식 Context API가 개편되었다. 기존의 불안정한 context를 대체할 수 있는 새로운 API를 프로젝트에 적용하면서 겪은 경험을 정리했다.

다층 컴포넌트 구조에서 props를 계속 넘기는 문제를 겪고 있었다. React 16.3에서 새로 추가된 Context API를 도입해 해결한 과정을 정리했다.

React 16.3에서 정식으로 공개된 새로운 Context API를 프로젝트에 적용했다. 기존 Redux로 관리하던 단순 전역 상태를 Context로 전환하면서 불필요한 boilerplate를 줄일 수 있었다.

React 16.3에서 componentWillMount, componentWillReceiveProps, componentWillUpdate가 deprecated 되었다. 레거시 코드베이스에서 이를 대응하는 과정을 정리했다.

대시보드 프로젝트에서 불필요한 리렌더링으로 인한 성능 문제를 겪었다. shouldComponentUpdate와 PureComponent를 활용해 렌더링 횟수를 70% 가량 줄인 과정을 정리했다.