[항해플러스] 5주차 회고 - 디자인 패턴과 함수형 프로그래밍

1. 문제 (과제, 프로젝트를 진행하면서 부딪혔던 기술적인 문제)

이번 과제는 컴포넌트 안에 모든 로직이 섞여 있는 상태였기 때문에, 비즈니스 로직과 UI를 분리하는 작업이 필요했다. 하지만 어디까지 로직을 분리해야 하는지, 어떤 기준으로 models/hook/component를 나눠야 하는지 명확히 판단하기가 어려웠다.
특히 cart, product, coupon처럼 서로 엮여 있는 도메인들을 feature 단위로 나누는 것이 좋을지, 엔티티 중심으로 나누는 것이 좋을지 처음에는 많은 혼란이 있었다.

---

2. 시도

• 컴포넌트 내부 상태와 로직을 useCart, useProducts, useCoupons로 분리해 각각의 책임을 나누어 보았다.
• 할인율 계산, 장바구니 총액 계산 같은 순수 계산 로직은 models 폴더로 빼서 관리했다.
• cart, product, coupon 각각 feature 단위 폴더를 만들고, 관련 훅/컴포넌트/모델을 묶어 구조를 정리해보았다.
• CartPage 안에서도 상품목록, 장바구니 내역, 쿠폰적용, 주문요약 덩어리별로 컴포넌트를 분리했다.
• 폴더구조가 모호하게 느껴질 때는 여러 번 수정해가면서 기능과 관심사가 가장 자연스럽게 묶이는 방법을 스스로 찾아보려 했다.

---

3. 해결

• CartPage에서는 비즈니스 로직을 훅을 통해 가져오고, 각각의 컴포넌트는 필요한 props만 받아 깔끔하게 렌더링만 하도록 했다.
• 할인율, 총 금액 계산 같은 순수 함수는 models/cart.ts와 models/discount.ts로 기능에 따라 분리했다.
• cart라는 feature 하위에 상품(Product), 쿠폰(Coupon)과 관련된 컴포넌트들도 함께 묶는 구조를 선택해 의존성을 명확히 했다.
• 폴더구조를 기능 단위(feature) 중심으로 정리하면서, 프로젝트가 커져도 유지보수가 쉬운 형태로 개선할 수 있었다.

---

4. 알게된 것

• "관심사 분리"란 단순히 파일을 쪼개는 게 아니라, 어떤 데이터(상태)를 다루느냐에 따라 책임과 위치를 명확히 나누는 것이라는 걸 체감했다.
• props drilling을 피하려고 무조건 훅을 더 쪼개는 것보다는, 부모 컴포넌트가 명시적으로 props를 내려주는 구조가 오히려 명확할 때도 있다는 걸 알게 되었다.
• 엔티티 중심(hook, model)과 view 중심(UI 컴포넌트) 계층을 나누는 게 생각보다 중요하며, 프로젝트가 커질수록 이 구분이 유지보수성과 직접 연결된다는 걸 느꼈다.

---

Keep : 현재 만족하고 계속 유지할 부분

• 단순히 "테스트 통과"만을 목표로 하지 않고, 코드를 더 좋은 구조로 리팩토링하려고 스스로 계속 질문했던 과정에 만족한다.
• 폴더 구조나 컴포넌트 책임 분리에 대해 처음보다 훨씬 논리적으로 고민하고 스스로 결정을 내릴 수 있게 된 점.
• 코드만 작성한 게 아니라, 이걸 왜 이렇게 했는지 스스로 설명할 수 있는 사고 과정을 가지게 된 점.

---

Problem : 개선이 필요하다고 생각하는 문제점

P1. 여러 번 폴더구조나 로직 분리를 수정하면서 방향성을 잃고 헷갈린 경우가 있었다. 처음부터 명확한 기준 없이 구조를 잡다 보니 중간에 수정을 반복하게 되었다.

P2. 모델과 유틸리티 함수 간 구분 기준(순수 계산 vs 엔티티 관련 계산)이 아직 완벽히 자연스럽게 떠오르지 않아서 고민하는 시간이 길었다.

---

Try : 문제점을 해결하기 위해 시도해야 할 것

P1. 과제 외부의 다양한 오픈소스나 실제 기업의 리포지터리를 분석하면서, 상황별로 어떤 기준으로 구조를 잡는지 더 다양한 사례를 학습할 것.

P2. 모델과 유틸 함수 분리 기준을 더 명확히 내재화하기 위해, 앞으로도 작은 프로젝트라도 "순수함수"와 "엔티티 모델"을 항상 의식하면서 설계하는 습관을 들일 것.