React - 구조

송용준·2025년 3월 24일

프로젝트 구조

├── public/ # 정적 파일들
│ └── assets/ # 이미지, 폰트 등
├── dist/ # 배포 코드
├── node_modules/ # 설치된 외부 패키지
├── src/ # 소스 코드
│ ├── components/ # 재사용 가능한 컴포넌트
│ ├── styles/ # 스타일 파일
│ ├── assets/ # 이미지, 폰트 등
│ ├── services/ # API 호출 및 비즈니스 로직
│ ├── utils/ # 유틸리티 함수
│ ├── hooks/ # 커스텀 후크 관
│ ├── views/ # 렌더링할 페이지나 템플릿리
│ ├── store/ # 상태 관리
│ ├── App.css/ # css
│ ├── main.jsx # 애플리케이션의 진입점
│ └── App.jsx # 루트 컴포넌트
├── index.html # 메인 HTML 파일 (루트 디렉토리에 있어야 함)
├── .gitignore # Git에 포함되지 말아야 할 파일
├── package.json # 프로젝트 설정
├── package-lock.json # 의존성 트리 고정 파일
├── vite.comfig.js # vite 설정
├── eslint.comfig.js # eslint 설정
└── README.md # 프로젝트 설명서

실행 흐름

index.html > vite.config.js > main.jsx > App.jsx


어우 복잡

이거 이곳저곳에서 Import 해서 쓰는 경우가 많아서 구조를 확실히 정리해서 어디서 가져올지 확실히 정의 해야겠다 생각함

+++ 수정 예정임 많이 바귐

profile
용용

0개의 댓글