Frontend

Promise를 사용하던 코드를 async/await으로 전환하면서 에러 처리 방식을 고민했다. try-catch의 중복을 줄이면서도 안전하게 에러를 다루는 몇 가지 패턴을 정리했다.

레거시 JavaScript 프로젝트에 TypeScript를 한 번에 적용하는 것은 위험 부담이 크다. 파일 단위로 점진적으로 마이그레이션하며 겪은 시행착오와 효과적인 전략을 정리했다.

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

프로젝트에서 비동기 처리 방식이 혼재되어 코드 일관성이 떨어지는 문제가 있었다. 팀 내 컨벤션 정립을 위해 Callback, Promise, Async/Await의 특징과 적절한 사용 시점을 정리했다.

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

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

여러 API를 동시에 호출해야 하는 대시보드 페이지를 개발하면서 Promise.all과 Promise.race를 활용했다. 각각의 특성과 에러 핸들링 방법을 정리했다.

대량의 API 요청을 Promise.all로 처리하다 서버 과부하 문제를 겪었다. 동시 요청 수를 제한하는 유틸리티를 직접 구현해 해결했다.

레거시 JavaScript 프로젝트에 TypeScript를 한 번에 전환하지 않고 단계적으로 도입하는 방법을 정리했다. allowJs 옵션과 체크 수준 조절을 활용해 기존 코드를 유지하면서 타입 안정성을 확보할 수 있었다.

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