사람함께에이전트▾
사람 — 직접 정하고 책임지는 비즈니스 규칙과 흐름. 직접 읽어보세요.
함께 — 개념은 알아두고, 세부 규칙은 에이전트가 따릅니다.
에이전트 — 에이전트가 따르는 규칙과 레퍼런스. 필요할 때 찾아보세요.
모듈 규칙▾
Model.View.tsx
Model.View.tsx 파일은 적절한 모델(Full Model)의 포괄적인 프레젠테이션을 전담하는 전문 서버 컴포넌트입니다. 요약(Light Model)을 표시하는 Unit과 달리, View는 도메인 엔터티의 전체 상세 정보를 렌더링하는 역할을 하며, 주로 상세 페이지의 메인 콘텐츠로 사용됩니다.
💎전체 상세 정보
View는 본문 내용, 상세 배열 또는 Light Model에 없는 민감한 데이터를 포함하여 모델의 모든 속성에 액세스할 수 있습니다.
View vs Unit: 차이점 이해하기
깨끗한 아키텍처와 최적의 성능을 유지하기 위해 View와 Unit 컴포넌트를 구별하는 것이 중요합니다.
Comparison설명
Model.View
전체 모델(cnst.Model)을 렌더링합니다. 메인 페이지에 사용됩니다.
Model.Unit
라이트 모델(cnst.LightModel)을 렌더링합니다. 목록/카드에 사용됩니다.
파일 위치
File Structure
구현
View는 일반적으로 'General' 컴포넌트와 기타 전문 레이아웃을 내보냅니다. 이들은 상수에 정의된 전체 Model 타입을 받습니다.
1. Interface Definition
전체 Model 타입(예: cnst.LightProduct가 아닌 cnst.Product)을 사용하여 props를 정의하세요.
2. General Component
상세 페이지에서의 사용
View는 전체 모델이 로드되는 동적 라우트(예: [id]/page.tsx)에서 제공되도록 설계되었습니다.
Load.Page 사용
최적의 성능과 비동기 데이터의 깔끔한 처리를 위해
Load.Page 유틸리티를 사용하세요.app/[lang]/shop/product/[productId]/page.tsx
Load.View
클라이언트 컴포넌트(Zone 또는 탭 레이아웃 등) 내에서 View를 사용할 때, 단순히 props를 전달하면 하이드레이션 불일치가 발생할 수 있습니다.
Load.View 유틸리티는 모델 상태를 스토어에 안전하게 하이드레이션하여 이 문제를 해결합니다.패턴: Zone.View 래퍼
ClientView 객체를 받아 Load.View를 사용하여 View를 렌더링하는 특수한 Zone 컴포넌트를 정의하세요.lib/product/Product.Zone.tsx
구성 전략
이상적으로 View는 복잡한 로직이나 방대한 코드를 포함하지 않아야 합니다. View의 주된 역할은 Unit(데이터), Utility(동작), Zone(레이아웃)과 같은 작은 조각들을 조립하여 완성된 페이지를 만드는 것입니다.
View (Parent)
레이아웃, 구조적 그리드, 제목
⬇️
Children
- Unit: 하위 항목, 뷰 내의 목록
- Util: 상호 작용 버튼 (좋아요, 공유)
- Zone: 복잡한 하위 섹션 (댓글)