React Hooks (리액트 훅)

📌 Brief Summary

"클래스의 복잡한 생명주기(Lifecycle)를 직관적인 함수의 흐름으로 평탄화하고, 컴포넌트 간 상태 로직을 마법처럼 공유하라" — React 16.8부터 도입된, 함수형 컴포넌트에서도 상태와 생명주기 기능을 사용할 수 있게 해주는 혁신적인 API.

추출된 패턴: "Logic Decoupling and Composition Over Inheritance" — UI 렌더링과 비즈니스 로직을 분리하고, 커스텀 훅(Custom Hooks)을 통해 반복되는 로직을 독립적인 단위로 재사용하는 패턴.
주요 훅과 역할:
- useState: 컴포넌트 내의 로컬 상태 관리.
- useEffect: API 호출, 이벤트 리스너 등 사이드 이펙트(Side Effects) 처리 및 클린업.
- useMemo / useCallback: 불필요한 연산과 리렌더링을 방지하는 메모이제이션(Memoization).
- useContext: 전역 상태 공유를 위한 Context API 접근.
의의: 기존 HOC(High-Order Components)나 Render Props 방식의 'Wrapper Hell' 문제를 해결하고, 코드의 가독성과 테스트 가능성을 비약적으로 향상시킴.

과거 데이터와의 충돌: 초기에는 모든 최적화에 useMemo 등을 남발했으나, 최근 React Compiler(React Forget)의 등장으로 수동 최적화의 필요성이 줄어들고 있으며, 훅은 오직 최상위 레벨에서만 호출되어야 한다는 'Rules of Hooks' 정책이 더욱 엄격해짐.
정책 변화: Antigravity 프로젝트는 모든 신규 프런트엔드 모듈에 함수형 컴포넌트와 훅 아키텍처를 강제하며, 복잡한 데이터 페칭 로직은 반드시 커스텀 훅으로 추상화하여 관리함.