Feture-based structure

최근 프론트엔드 오픈소스 프로젝트들을 살펴보는 중에 폴더 구조를 features 단위로 나누는 방식이 자주 등장한다는 점이다.

자세히 알아보기로 했다.

소프트웨어 아키텍처의 구조만 봐도 시스템이 어떤 프레임워크를 쓰는지가 아니라 ‘무슨 문제를 해결하는지’ 명확하게 드러나야 한다고 한다.

└── src/
    ├── components/
    ├── contexts/
    └── hooks/

이런 구조는 React 임이 명확하다.

└── src/
    ├── features/
    │   ├── todos/
    │   ├── ui/
    │   └── users/
    └── pages/

이런식으로 폴더 구조를 만들면 이건 Todo 앱임을 파악할 수 있다.

Feature 파일 내부 파일 구조는 밑과 같이 하는게 제일 좋아 보였다.

실제 파일구조를 나눈 예들

db 까지 조회하는 풀스택으로 개발하는게 아닌이상 프론트만 개발할때는 몇개의 서로 다른 api 들을 불러와서 데이터를 변형해서 써야한다.

이를 domain logic, service logic 이라고 한다.