adapters → socket 통신 전용 ts file 담당
assets → images [json, svg, png] 등을 담당
components → 실제로 void 형식 tsx 파일 내보내기를 담당
atoms 는 실제로 여러 파일 구조에서 중복되는 컴포넌트들 혹은 단위를 보관
layout 은 전체적인 파일들의 중복적인 layout 구성시에 활용 (ex. 맨 밑에 모도코 정보를 쓰는 레이아웃들은, 기본적으로 해당 레이아웃에서 Footer를 사용)
그 외는 페이지 별로 들어가는 component 관리
안에서도 별도로 한 컴포넌트 안에 여러 컴포넌트가 소속되어 있는 경우, 파일을 분리하여 관리
그 외는 페이지 별로 들어가는 component 관리
안에서도 별도로 한 컴포넌트 안에 여러 컴포넌트가 소속되어 있는 경우, 파일을 분리하여 관리
개인적으로 한 파일당 style 이 4개 이상 넘어가면 component 분할이 필요해 보임
fonts → 폰트들 및 fonts.css 관리
hooks → 공통적으로 사용 할 수 있는 ts 파일로 나오는 hook 관리
interface → 공통적으로 사용하는 interface 관리
pages → 모도코에서 사용되는 페이지들 관리
stores → zustand 를 활용한 전역변수들 관리
styles → 전역 스타일이나 테마 같은 global 한 css 관련 관리
그 외
config.json
API URL 담당 config
*.d.ts
원래 안되는 .[] file 등 처리 할 수 있게 예외 처리해주는 파일 ex) *.svg / *.gif 등
Attachments:
image-20220805-104543.png (image/png)
image-20220805-104708.png (image/png)
image-20220805-104852.png (image/png)
image-20220805-104907.png (image/png)
image-20220805-105006.png (image/png)
image-20220805-105009.png (image/png)
image-20220805-105018.png (image/png)
