리액트

리액트를 배우다 보면 자연스럽게 훅(Hook)에 대해 접하게 된다. useState, useEffect 같은 기본적인 훅을 사용하며 컴포넌트의 상태를 관리하고, 생명주기를 다루는 방법을 익히게 된다. 동시에 리액트에서는 훅을 사용할 때 반드시 지켜야 할 몇 가지 규칙이 있으며, 이를 어기면 예기치 않은 오류가 발생할 수 있다는 이야기를 듣게 된다. 리액트 공식 문서에서도 이를 강조하고 있다. 훅은 최상위에서만 호출해야 하며 조건문이나 반복문 안에서는 사용할 수 없다. 반드시 리액트 함수 내에서만 호출해야 하며 클래스 컴포넌트에서는 호출할 수 없다.도전적인 개발자라면 주어진 규칙에 무조건적으로 순응하지 않는다. 대신, 그 규칙이 반드시 지켜야 할 절대적인 원칙인지, 아니면 단순한 관례인지 직접 검증해본다...

이전에 [ 합성 컴포넌트 패턴과 동적 프로퍼티 패턴 ] 포스트에서 나는 컴포넌트를 보다 유연하게 구성하고 재사용할 수 있도록 여러 하위 컴포넌트를 조합하여 만든 컴포넌트라고 소개했다. 이는 리액트 구 문서의 [ 합성 vs 상속 ]에서 제시된, 컴포넌트 내부에서 컴포넌트를 호출하는 대신 children을 포함한 다양한 props를 통해 다른 컴포넌트를 합성하는 방법에 근거한 것이었다.그런데 모 회사의 면접 도중에 '그럼 모든 리액트 개발자들은 합성 컴포넌트 패턴을 쓰는 거 아닌가요?' 하는 질문을 받았다. 나는 하위 컴포넌트를 얼마나 잘게 분해하여 재사용하는지를 이야기하였으나 '잘은 모르지만 제가 알고 있는 합성 컴포넌트 패턴은 상태를 공유하는 패턴으로 알고 있다'는 말이 돌아왔다. 내게 있어서 합성 컴포..