<aside> 📍 프로젝트의 전반적인 구조 및 src 폴더 하위 구조, 컴포넌트 파일의 위치, 네이밍 규칙, 관련 스타일 및 테스트 파일의 규칙, 스타일 파일의 위치, 네이밍 규칙, CSS 전처리기 사용 여부, 유틸리티와 서비스 파일 등(필요 시 추가 혹은 제외 해주세요)의 위치와 네이밍 규칙을 정의해보세요.

</aside>

프로젝트 전반적인 구조

project
├── node_modules
├── public
├── src
├── .gitignore
├── package.json
└── README.md

src 폴더 하위 구조

└─ src
 ├─ components
 ├─ css
 ├─ img
 ├─ pages
 ├─ App.js
 └─ Main.js

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

스타일 파일 구조

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

커스텀 훅 파일 구조

. ├── README.md ├── package-lock.json ├── package.json ├── public │   ├── _redirects │   ├── favicon.png │   ├── ic_share_logo.png │   ├── index.css │   └── index.html ├── src │   ├── Main.js │   ├── components │   │   ├── CreateStudyComponents │   │   │   ├── CreateBackground.js │   │   │   ├── CreateBackground.module.css │   │   │   ├── CreateFooter.js │   │   │   ├── CreateFooter.module.css │   │   │   ├── CreateForm.js │   │   │   ├── CreateForm.module.css │   │   │   ├── CreateInput.js │   │   │   ├── CreateInput.module.css │   │   │   ├── CreatePassword.js │   │   │   └── CreatePassword.module.css │   │   ├── EditStudyComponents │   │   │   ├── BackgroundSelector.js │   │   │   ├── EditStudyForm.css │   │   │   ├── EditStudyForm.js │   │   │   ├── LabeledInput.js │   │   │   ├── PasswordInput.js │   │   │   └── SubmitButton.js │   │   ├── Layout │   │   │   ├── Container.js │   │   │   ├── Container.module.css │   │   │   ├── Footer.js │   │   │   ├── Footer.module.css │   │   │   ├── Layout.js │   │   │   ├── Nav.js │   │   │   └── Nav.module.css │   │   ├── StudyDetailComponents │   │   │   ├── PasswordModal.css │   │   │   ├── PasswordModal.js │   │   │   ├── StudyDetailComponents.js │   │   │   ├── StudyHabits.css │   │   │   ├── StudyHabits.js │   │   │   ├── StudyInfo.css │   │   │   ├── StudyInfo.js │   │   │   ├── StudyName.css │   │   │   ├── StudyName.js │   │   │   ├── StudyPoint.css │   │   │   ├── StudyPoint.js │   │   │   └── StudyShare.js │   │   ├── StudyHomeComponents │   │   │   ├── Dropdown.js │   │   │   ├── Dropdown.module.css │   │   │   ├── ExploreDataFetch.js │   │   │   ├── ExploreDataFetch.module.css │   │   │   ├── ExploreStudies.js │   │   │   ├── ExploreStudies.module.css │   │   │   ├── ExploreStudiesHeader.js │   │   │   ├── ExploreStudiesHeader.module.css │   │   │   ├── RecentDataFetch.js │   │   │   ├── RecentDataFetch.module.css │   │   │   ├── RecentStudies.js │   │   │   ├── RecentStudies.module.css │   │   │   ├── StudyHomeForm.js │   │   │   └── backgrounds │   │   │   ├── ExploreBackground.js │   │   │   └── RecentBackground.js │   │   ├── TodayFocusComponents │   │   │   ├── FocusPage.css │   │   │   ├── FocusPage.js │   │   │   ├── FocusTimer.css │   │   │   ├── FocusTimer.js │   │   │   ├── FocusTop.css │   │   │   ├── FocusTop.js │   │   │   ├── TimerSettingModal.css │   │   │   └── TimerSettingModal.js │   │   └── TodayTodoList │   │   ├── HabitEditModal.css │   │   ├── HabitEditModal.js │   │   ├── HabitItem.css │   │   ├── HabitItem.js │   │   ├── HabitModalList.css │   │   ├── HabitModalList.js │   │   ├── HabitStudyComponents.css │   │   ├── HabitStudyComponents.js │   │   ├── ModalButtons.css │   │   ├── ModalButtons.js │   │   ├── NewHabitList.css │   │   ├── NewHabitList.js │   │   ├── TodoList.css │   │   └── TodoList.js │   ├── css │   │   └── reset.css │   ├── hooks │   │   ├── useExploreList.js │   │   ├── useFetchCompleteHabit.js │   │   ├── useFetchEmoji.js │   │   ├── useFetchHabit.js │   │   ├── useFetchStudy.js │   │   ├── useFocusTimer.js │   │   ├── useInputValid.js │   │   └── useRecentList.js │   ├── img │   │   ├── ImgImport.js │   │   ├── Modified complete=mobile.png │   │   ├── _status=mobile.png │   │   ├── _status=pc.png │   │   ├── background │   │   │   ├── background_1.png │   │   │   ├── background_2.png │   │   │   ├── background_3.png │   │   │   ├── background_4.png │   │   │   ├── background_5.png │   │   │   ├── background_6.png │   │   │   ├── background_7.png │   │   │   ├── background_8.png │   │   │   └── background_icon.png │   │   ├── btn_determinate.png │   │   ├── btn_plus.png │   │   ├── cancel-button=mobile.png │   │   ├── cancel-button=pc.png │   │   ├── check │   │   │   ├── ic_active1.svg │   │   │   ├── ic_active10.svg │   │   │   ├── ic_active11.svg │   │   │   ├── ic_active12.svg │   │   │   ├── ic_active13.svg │   │   │   ├── ic_active14.svg │   │   │   ├── ic_active15.svg │   │   │   ├── ic_active16.svg │   │   │   ├── ic_active17.svg │   │   │   ├── ic_active18.svg │   │   │   ├── ic_active2.svg │   │   │   ├── ic_active3.svg │   │   │   ├── ic_active4.svg │   │   │   ├── ic_active5.svg │   │   │   ├── ic_active6.svg │   │   │   ├── ic_active7.svg │   │   │   ├── ic_active8.svg │   │   │   ├── ic_active9.svg │   │   │   └── ic_inactive.svg │   │   ├── home-btn.png │   │   ├── ic_close_pw.svg │   │   ├── ic_emoji.svg │   │   ├── ic_open_pw.svg │   │   ├── ic_point.svg │   │   ├── kakaotalk_sharing.png │   │   ├── make_btn.png │   │   ├── modified complete=pc.png │   │   ├── nav_btn.png │   │   ├── nav_logo.png │   │   ├── nav_mobile_btn.png │   │   ├── nav_mobile_logo.png │   │   ├── point_icon.png │   │   ├── today-focus-btn.png │   │   └── today_focus │   │   ├── Polygon.png │   │   ├── arrow.png │   │   ├── btn_pause.png │   │   ├── btn_restart.png │   │   ├── ic_timer.png │   │   ├── img_logo.png │   │   └── stop.png │   ├── index.js │   └── pages │   ├── CreateStudyPage.js │   ├── EditStudyPage.js │   ├── FocusTimerPage.js │   ├── HabitTrackerPage.js │   ├── StudyDetailPage.js │   └── StudyRoomPage.js

7012 directories, 54926 files