프로젝트 전반적인 구조

src 폴더 하위 구조

컴포넌트 구조 (공통 컴포넌트 및 일반 컴포넌트)

스타일 파일 구조

유틸리티 및 서비스 파일 구조

커스텀 훅 파일 구조

랜딩페이지

/auth
│   /login
│   /signup

(protected)
		/gallery           # 마이 갤러리 (내가 가진 포토 카드 조회)
│   └────/create       # [포토카드 생성 버튼] -> 포토카드 생성 페이지
|   └────/complete     # 성공/실패 페이지
│   /selling
│   └────/create       # 마갤 - 포토카드 생성
│   └────/list         # 나의 판매 포토카드 페이지(판매 중)
|		└──  /[id]/        # 마켓플레이스 페이지 - 판매 포토카드 상세
│		
│   /market-place
│    └──/판매자        # [판매하기 버튼] -> 판매 카드 선택 모달
│    └──/[id]/          # 포토카드 상세 (구매자/판매자 다르게)
│    └──/sell-detail   # 판매 포토카드 상세
│
└──    ---/complete     # 성공 / 실패 페이지

(public)
│   /market-place      #마켓플레이스 - 퍼블릭
│

/components
│
├── /common
│   └── /header
│       └── Header.jsx
│       └──/프로필
│       └──/알림
├── /ui
│   ├── /button
│   │   └── button.jsx
│   ├── /card
        ---- Card.jsx
│   └── /point-draw
│   │     └── Pointdrow.jsx
│   └── /info           # 내 닉네임 및 포인트 조회jsx
│   ----/toast
|
│── /modal
│			└── 공통 모달 
│ 

캐밥케이스 - routing

컴포넌트 - Pascal

컴포넌트폴더명 - Kebab

에셋(예시)

• 이미지: Img_logo.png
• 아이콘: Ic_check.svg

--breakpoint-sm: 375px; --breakpoint-md: 768px; --breakpoint-lg: 1920px;

/assets

/images

/fonts

/Icons