폴더 구조 컨벤션

src 폴더

src
 ┣ assets
 ┣ components
 ┣ constants
 ┣ contexts
 ┣ hooks
 ┣ pages
 ┣ routes
 ┣ styles
 ┣ App.tsx
 ┣ index.tsx
 ┗ react-app-env.d.ts

assets 폴더

assets
 ┣ icons
 ┃ ┣ icon_xx.svg (소문자 snake_case)
 ┃ ┗ icon_cake_fill.svg # 예시
 ┗ imgs
   ┣ 해당 이미지를 사용하는 컴포넌트 첫 단어_xx.png (소문자 snake_case)
   ┗ profile_default_image.png # 예시

components 폴더

components
 ┣ common # 공통 컴포넌트
 ┃ ┗ Icon # 컴포넌트 이름 (PascalCase)
 ┃   ┣ Icon.stories.tsx # 컴포넌트이름.stories.tsx
 ┃   ┣ Icon.tsx # 컴포넌트이름.tsx
 ┃   ┣ index.tsx
 ┃   ┗ style.tsx # 컴포넌트에 사용되는 스타일
 ┣ 페이지이름 (camelCase)
 ┃ ┗ 컴포넌트 이름 # (PascalCase) 위와 동일하게
 ┗ create # 페이지이름 예시
   ┣ Cascader
   ┃ ┣ Cascader.tsx
   ┃ ┗ index.tsx
   ┗ index.tsx

hooks 폴더

hooks
 ┣ index.tsx
 ┗ useXXX.ts