아키텍처 개요

Akan.js는 현대적인 웹 애플리케이션 개발을 가속화하기 위해 설계된 풀스택 프레임워크입니다. 백엔드, 프론트엔드, 데브옵스 시스템을 하나의 통합된 개발 경험으로 원활하게 결합하는 응집력 있는 아키텍처를 제공합니다.

🎯 핵심 철학

"한 번 작성하면 어디서나 사용" - 데이터 모델을 한 번 정의하면, Akan.js가 GraphQL API, 데이터베이스 스키마, TypeScript 타입, 프론트엔드 스토어, UI 컴포넌트를 자동으로 생성합니다.

시스템 구성 요소

📦도메인 모듈

도메인 주도 설계를 구현하는 표준화된 폴더 구조입니다. 각 비즈니스 도메인(예: User, Product)에 대한 백엔드, 프론트엔드, 공통 로직을 독립적인 모듈로 캡슐화합니다.

🖥️백엔드 시스템

Nest.js 기반으로 구축되었으며, 견고한 서버 클러스터 아키텍처(페더레이션 및 배치 모드)를 특징으로 합니다. 영속성을 위해 MongoDB를, 캐싱/구독을 위해 Redis를 사용합니다.

🎨프론트엔드 시스템

Next.js 15 App Router를 기반으로 합니다. 빠른 UI 개발을 위해 자동 생성된 스토어(Zustand)와 포괄적인 컴포넌트 라이브러리(Unit, View, Edit, Zone)를 특징으로 합니다.

🌍환경 설정

baseEnv와 baseClientEnv를 통한 중앙 집중식 설정입니다. 다양한 환경(Local, Debug, Develop, Main)과 모드(SSR/CSR) 전반의 설정을 관리합니다.

도메인 아키텍처

Akan.js의 핵심에는 각 데이터 모델이 독립적인 모듈이 되는 모듈 기반 아키텍처가 있습니다. 이 구조는 전체 애플리케이션에서 코드 구성, 재사용성, 유지보수성을 촉진합니다.

각 모듈은 특정 책임을 처리하는 특화된 파일들로 구성됩니다:

1Constant & Scalar

내장 스칼라(String, Int)와 커스텀 스칼라(ID, JSON)를 사용하여 데이터 모델, 타입, 열거형을 정의합니다. 이것이 단일 진실의 원천입니다.

2Document & Service

백엔드 레이어. Document는 MongoDB 작업과 스키마 검증을 처리합니다. Service는 비즈니스 로직을 포함하고 데이터 흐름을 조율합니다.

3Signal (API)

GraphQL 엔드포인트(Slice, Endpoint)를 정의하는 공유 인터페이스. 백엔드 구현과 프론트엔드 소비자 사이의 계약 역할을 합니다.

4Store & Components (Zone, View, Unit)

프론트엔드 레이어. Store는 Zustand를 통해 상태를 관리합니다. 표준화된 컴포넌트(Zone, View, Unit)는 모델에 대한 일관된 UI 렌더링을 제공합니다.

5Dictionary & CSS

지원 레이어. Dictionary는 i18n 텍스트를 처리합니다. TailwindCSS와 akanjs/ui 시맨틱 토큰이 스타일링 기반을 제공합니다.

Akan.js는 사용자 상호작용에서 데이터베이스 영속성까지, 그리고 다시 UI로 돌아오는 예측 가능한 데이터 흐름을 보장합니다.

End-to-End 흐름

UI (Page/Zone)

→

Store

→

Signal (GraphQL)

→

Service

→

Document

→

MongoDB

각 레이어에 대한 자세한 설명은 사이드바 메뉴의 특정 문서 섹션을 참조하세요.