프론트엔드 디렉토리 구조

[nyeoni]

현 디렉토리 구조에서 새로운 디렉토리 구조를 제안하고자 올리게 되었습니다.

현 디렉토리 구조는 아래와 같습니다.

.
├── App.tsx
├── assets
│   ├── styles
│   └── svgs
├── components
│   ├── common
│   ├── error
│   └── layout
├── main.tsx
├── pages
├── test
├── types
└── utils

components 안에 common, error, layout 이 있는데 이를 components 디렉토리 안에 넣지 않고, 밖으로 빼는게 어떤게 제안 드립니다.

제안드리는 디렉토리 구조는 다음과 같습니다.

.
├── App.tsx
├── assets
│   ├── styles
│   └── svgs
├── common
├── error
├── layout
├── main.tsx
├── pages
├── test
├── types
└── utils

이렇게 생각한 이유는 저희 프로젝트에서는 Presentation & Container 디자인 패턴을 사용하여 프로젝트를 구성하는데, components 디렉토리에 불필요하게 한번 더 래핑 되어있어 path alias 를 통해 접근할 때 경로가 지저분해 보입니다. ex. layout 디렉토리 내부의 파일에 접근할 때 ) @/components/layout/~ -> @/layout/~. 또한 앞으로 프로젝트를 계속 진행할 때, 디렉토리 구조를 개편하여야 파일 접근이 좀 더 간편해지고 디렉토리의 역할이 분명해질 거라고 생각합니다. 의견 주세요. @aLVINlEE9

[aLVINlEE9]

이러한 디렉토리 구조를 사용한 레퍼런스가 있나요? 보고 비교해보고싶습니다