폴더 구조 관련 제안 (10.28)

[KingNono1030]

@yongb2n

📁 폴더 구조 제안

TanStack Query 사용 시

• queries 디렉토리 아래에 각 도메인별 폴더로 분기하여 관리
• 예시:
  • queries/group/index.ts: 그룹과 관련된 쿼리 함수들을 관리하는 메인 파일
  • queries/group/member.ts: 그룹 내 멤버 관련 쿼리 함수들을 별도 파일로 분리하여 관리
• 상세한 기능별로 쿼리를 분리하여 index.ts 외에 필요한 파일들을 추가해, 쿼리 함수를 체계적으로 관리

---

API 요청 함수 관리

• API 요청 함수는 services 디렉토리에서 관리
• 각 도메인에 해당하는 API 요청 함수를 별도의 파일로 나누어 구성

예시:

📂 services
├── auth.ts        # 인증 관련 API 함수
├── group.ts       # 그룹 관련 API 함수
└── user.ts        # 사용자 관련 API 함수

---

컴포넌트 관리

• 공용 컴포넌트: 여러 페이지에서 공통으로 사용되며 도메인 맥락이 없는 컴포넌트는 components/common 폴더에 배치
• 도메인 컴포넌트: 특정 도메인 맥락이 있는 컴포넌트는 components/[domain] 폴더에 배치
• 예시:
  • components/common/Button.tsx: 공통 버튼 컴포넌트
  • components/auth/LoginForm.tsx: 인증 관련 도메인 컴포넌트
• Container 컴포넌트 도입 가능성: 페이지와의 연결 및 데이터 핸들링이 필요한 Container 컴포넌트를 도입
• 여러 페이지에서 사용되지만 도메인 맥락이 있는 경우, 도메인 컴포넌트로 두는 것이 좋습니다.