아키텍처 구성요소 체크리스트 - ChoDragon9/posts GitHub Wiki

아키텍처를 구성할 때 필요한 요소들에 관한 내용이다. 구조나 설계자마다 폴더명을 작명하는 것이 다르다. 그래서 역할과 폴더 예제를 통해서 기술하겠다.

아키텍처 체크리스트

컴파일되지 않은 에셋들을 포함하는 구성요소가 있는가?
정적 파일들을 포함하는 구성요소가 있는가?
페이지나 컴포넌트에 접근하기 전에 실행할 사용자 정의함수를 정의하는 구성요소가 있는가?
테스트 파일들을 포함하는 구성요소가 있는가?
라우터를 정의하는 구성요소가 있는가?
상태관리를 하는 구성요소가 있는가?
외부 라이브러리를 애플리케이션에 사용하도록 연결하는 구성요소가 있는가?
상수를 정의하는 구성요소가 있는가?
컴포넌트를 포함하는 구성요소가 있는가?
컴포넌트 볼륨을 줄일 수 있는 구성요소가 있는가?
페이지 단위를 분리할 수 있는 구성요소가 있는가?
프로젝트 환경 설정을 포함하는 구성요소가 있는가?

운영

서비스 장애 모니터링을 포함하는 구성요소가 있는가?
사용률를 기록할 수 있는 구성요소가 있는가?
성능 개선 포인트를 찾기 위한 디버깅 전략이 있는가?

사례

Angular와 Nuxt의 아키텍처를 빌딩한 사례이다. 기본적으로 Angular와 Nuxt에서 제공한 기능들이 있다. 하지만 미흡한 부분은 추가적으로 추가작업을 진행했다.

Angular

├─ e2e
│  └─ src
├─ src
│  ├─ app
│  │  ├─ app.module.ts
│  │  ├─ constants
│  │  ├─ modules
│  │  │  └─ feature
│  │  │     ├─ feature.module.ts
│  │  │     ├─ feature.page.ts
│  │  │     ├─ feature.page.html
│  │  │     ├─ pipes
│  │  │     ├─ directives
│  │  │     ├─ shared
│  │  │     │  ├─ feature.helper.ts
│  │  │     │  ├─ feature.state.ts
│  │  │     │  └─ child.state.ts
│  │  │     └─ components
│  │  │        ├─ child.ts
│  │  │        ├─ child.html
│  │  │        ├─ child2
│  │  │        ├─ child2.spec.ts
│  │  │        ├─ child2.ts
│  │  │        └─ child2.html
│  │  ├─ core
│  │  │  ├─ core.module.ts
│  │  │  ├─ apis
│  │  │  ├─ guards
│  │  │  ├─ helpers
│  │  │  └─ states
│  │  └─ shared
│  │     ├─ shared.module.ts
│  │     ├─ components
│  │     ├─ directives
│  │     └─ pipes
│  ├─ assets
│  └─ environments

[assets] 컴파일되지 않은 에셋들을 포함하는 구성요소가 있는가?
[assets] 정적 파일들을 포함하는 구성요소가 있는가?
[guards] 페이지나 컴포넌트에 접근하기 전에 실행할 사용자 정의함수를 정의하는 구성요소가 있는가?
[e2e/src, *.spec.ts] 테스트 파일들을 포함하는 구성요소가 있는가?
[app.routing.ts] 라우터를 정의하는 구성요소가 있는가?
[states, *.state.ts] 상태관리를 하는 구성요소가 있는가?
[*.helper.ts] 외부 라이브러리를 애플리케이션에 사용하도록 연결하는 구성요소가 있는가?
[constants] 상수를 정의하는 구성요소가 있는가?
[shared/components, modules] 컴포넌트를 포함하는 구성요소가 있는가?
[helper, pipe, directive] 컴포넌트 볼륨을 줄일 수 있는 구성요소가 있는가?
[feature.module.ts] 페이지 단위를 분리할 수 있는 구성요소가 있는가?
[src/enviroments] 프로젝트 환경 설정을 포함하는 구성요소가 있는가?

Nuxt

├─ nuxt.config.ts
├─ assets
├─ components
├─ constants
├─ directives
├─ filters
├─ layouts
├─ middleware
├─ pages
├─ plugins
├─ static
├─ store
└─ test

[assets] 컴파일되지 않은 에셋들을 포함하는 구성요소가 있는가?
[static] 정적 파일들을 포함하는 구성요소가 있는가?
[middleware] 페이지나 컴포넌트에 접근하기 전에 실행할 사용자 정의함수를 정의하는 구성요소가 있는가?
[test] 테스트 파일들을 포함하는 구성요소가 있는가?
[pages, Auto Routing] 라우터를 정의하는 구성요소가 있는가?
[store] 상태관리를 하는 구성요소가 있는가?
[plugins] 외부 라이브러리를 애플리케이션에 사용하도록 연결하는 구성요소가 있는가?
[constants] 상수를 정의하는 구성요소가 있는가?
[components] 컴포넌트를 포함하는 구성요소가 있는가?
[directives, filters] 컴포넌트 볼륨을 줄일 수 있는 구성요소가 있는가?
[pages] 페이지 단위를 분리할 수 있는 구성요소가 있는가?
[nuxt.config.ts 프로젝트 환경 설정을 포함하는 구성요소가 있는가?