Deep Dive
-
useContext (ContextAPI) 란?React 2024. 3. 12. 21:01
리액트의 기본적인 데이터 흐름은 부모 컴포넌트에서 자식 컴포넌트에 Props를 전달해주는 형식임. 프로젝트의 규모가 커지면 커질 수록 컴포넌트는 많아질 것이며, 이에 전부 props로 대처할 수는 없음. 또한 어디 한 군데에서 문제가 생긴다면 모든 부모 컴포넌트를 찾아다니며 수정해줄 수가 없음. 이를 해결하기 위해 Context를 제공해줌. 이는 props로 내려줄 필요가 없는 방법. props drilling이 일어나지 않는다는 장점이 있지만, 공식문서에는 props drilling을 피하기 위한 목적이라면 컴포넌트 합성을 먼저 고려하라는 이야기가 나옴 여러 레벨에 걸쳐 props 넘기는 걸 대체하는 데에 context보다 컴포넌트 합성이 더 간단한 해결책일 수도 있습니다. https://ko.lega..
-
모던 리액트 Deep dive - 클래스, 클로져React 2024. 2. 18. 14:04
1. 클래스란? - 특정한 객체를 만들기 위한 일종의 템플릿. 특정한 형태의 객체를 반복적으로 만들기 위해 사용되는 것이 바로 클래스. 다음은 클래스 예제이다. (우아한테크코스 로또 미션 중 일부) 1-1 정적 메서드(static)은 클래스에서 직접 호출 할 수 있다. const { ErrorMessage } = require("./Error"); class Validate { static purchase(callback) { return (amount) => { if (Number(amount) % 1000 !== 0) { throw new Error(ErrorMessage.IS_CORRECT_AMOUNT); } if (isNaN(amount)) { throw new Error(ErrorMessage...