디렉터리 구조

디렉터리 구조

📁 public

• assets

📁 src

구조 설명

컴포넌트 폴더 구조

• 해당 컴포넌트에서 쓰일 공통된 로직 (constants, hooks, types, utils)은 폴더로 생성한다.

• 컴포넌트 아래에 다른 depth 를 가진 하위 컴포넌트가 생기더라도 같은 레벨에 폴더를 생성한다.

• @emotion/Styled 컴포넌트는 분리한다. (파일명:컴포넌트명.style.ts)

 

index.ts 파일

• index.tsx 가 아닌 index.ts 를 사용한다.

• index.ts는 해당 폴더의 컴포넌트를 모아서 export 해주는 용도로만 사용한다.

import DotBadge from './DotBadge';
import StackBadge from './StackBadge';

export { DotBadge, StackBadge };