FE - 파일구조

1. 구조도

• client
  • src
    • assets
    • components
      • Footer
      • Form
        • FormStyles.js
        • user
          • LoginForm.js
          • SignupForm.js
        • Nav
    • redux
      • store
        • store.js
      • userSlice.js
    • pages
      • HomePage.js
      • LoginPage.js
      • SignupPage.js

---

2. 설명

• assets
  • 로고 이미지, 아이콘 이미지 등 레이아웃 구현에 필요한 파일들을 assets 폴더에 담습니다.
• components
  • 전역에서 공통으로 재사용 가능한 컴포넌트
  • Form 처럼 여러곳에서 다양하게 재사용되는 컴포넌트는 폴더 안의 폴더로 기능별로 관리합니다.
    • Form > user > 회원가입, 로그인폼
    • Form > FormStyle.js (여러 폼에서 재사용 가능한 styled-component 정의만 된 파일)
• pages
  • 라우팅 경로에 따라 라우팅되는 페이지 단위의 컴포넌트
  • 해당 페이지에서 사용될 재사용 가능한 컴포넌트들은 components 폴더에서 import 해옵니다.
• redux
  • store 폴더: 전역으로 상태관리하는 여러 slice들의 state가 담긴 store.js 파일을 가집니다.
  • userSlice.js : 회원가입, 로그인 관련