ji-frontdev

프론트엔드 개발자로서 4~5년 전 React 프로젝트를 진행하면서 Container/Presentational 패턴을 사용했던 경험이 있다.당시에는 패턴에 대해 깊이 이해한 상태는 아니었지만, 로직과 UI 코드가 얽혀 유지보수가 어려워지자 자연스럽게 관심사를 분리해야겠다는 필요를 느꼈고, 이 패턴을 도입했다.돌아보면 그 선택은 꽤 합리적이었다. 그리고 최근 React의 패턴 흐름을 공부하면서,과거의 구조와 현재의 방식이 어떻게 변화해왔는지를 다시 되짚어보게 되었다.🧩 Container/Presentational 패턴이란?1. 왜 나왔는가?React가 등장한 초기에는 컴포넌트 안에서 로직, 상태, UI 모두를 처리하는 방식이 일반적이었다.하지만 점점 규모가 커지고 협업이 늘어나면서, 다음과 같은 문제가 ..

📌 Custom Hook 패턴 개요1️⃣ Custom Hook이란?Custom Hook은 React의 기존 Hooks(useState, useEffect, useContext 등) 을 조합하여반복되는 로직을 재사용 가능하도록 추출한 함수.컴포넌트 내부에서 자주 사용되는 로직을 별도의 함수로 분리함으로써 코드의 가독성과 유지보수성을 향상시킴.✅ 특징✔️ use 접두사를 반드시 붙여야 React가 Hook으로 인식함✔️ JSX를 반환하지 않음 (UI가 아닌 로직만 다룸)✔️ 다른 Hook(useState, useEffect, useMemo 등)을 내부에서 사용할 수 있음2️⃣ 왜 Custom Hook이 필요한가? (기존 React 개발 방식의 문제점)기존 방식에서는 반복되는 로직이 있을 경우, 여러 컴포넌..