Frontend

539개의 게시물

React 16.3 새 Context API로 Props Drilling 해결

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

2018년 2월 24일

Promise.all의 에러 핸들링 문제와 해결

여러 API를 병렬로 호출하는 과정에서 Promise.all의 에러 핸들링 방식이 문제가 되었다. 하나의 요청이 실패하면 모든 요청이 중단되는 문제를 해결한 과정을 기록한다.

2018년 2월 17일

React 16.3 라이프사이클 메서드 변경 대응

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

2018년 2월 16일

React 컴포넌트 성능 최적화 - shouldComponentUpdate 실전 적용

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

2018년 2월 11일

Promise.all 병렬 처리 시 에러 핸들링 개선

여러 API를 동시에 호출하는 대시보드에서 Promise.all 사용 시 하나의 요청 실패로 전체가 실패하는 문제를 겪었다. Promise.allSettled 폴리필과 에러 핸들링 패턴을 적용해 개선한 과정을 정리했다.

2018년 2월 10일

자바스크립트 Promise 체이닝과 에러 처리 패턴

API 호출 중첩으로 콜백 지옥을 겪다가 Promise 체이닝으로 리팩토링했다. catch 블록 위치에 따라 에러 처리 범위가 달라지는 부분을 정리했다.

2018년 2월 7일

React 16의 Error Boundary로 런타임 에러 처리하기

프로덕션 환경에서 컴포넌트 에러로 인한 전체 화면 크래시가 발생했다. React 16에서 새로 도입된 Error Boundary를 적용해 사용자 경험을 개선한 과정을 정리했다.

2018년 2월 6일

React 16.2 Fragment 문법과 HOC 패턴 정리

React 16.2에서 정식 도입된 Fragment 문법을 프로젝트에 적용했다. HOC 패턴으로 인증 처리를 리팩토링하면서 겪은 문제와 해결 과정을 기록한다.

2018년 1월 31일

React 컴포넌트 리렌더링 최적화 - shouldComponentUpdate vs PureComponent

대시보드 프로젝트에서 불필요한 리렌더링으로 인한 성능 저하를 겪었다. shouldComponentUpdate와 PureComponent를 활용해 해결한 과정을 정리했다.

2018년 1월 29일

Promise.all 병렬 처리 시 에러 핸들링 문제

여러 API를 병렬로 호출하는 과정에서 Promise.all의 에러 핸들링 방식이 예상과 달라 문제가 발생했다. 하나의 Promise라도 reject되면 전체가 실패하는 구조를 개선한 과정을 기록한다.

2018년 1월 27일

Builder.shin