[Setting/Arch] 프로젝트 아키텍처 재편 및 컴포넌트 기반 모달 시스템 구축 #8

New Issue

Taehoon · 2026-04-15T14:03:23+09:00

Taehoon commented

2026-04-15 14:03:23 +09:00

📋 작업 개요

프로젝트 규모 확장에 따른 유지보수 효율을 높이고, 다수의 개발자가 협업할 때 발생하는 파일 충돌(특히 index.html)을 원천 차단하기 위해 시스템 아키텍처를 전면 재편했습니다.

🛠️ 주요 작업 내용

핵심 엔진 분리 (Core Decoupling)
- 전역 상태 관리, 데이터 파싱, 데이터 생성 로직을 src/core/ 디렉토리로 격리하여 데이터 비즈니스 로직과 UI 로직의 관심사를 분리했습니다.
독립형 모달 컴포넌트 도입 (Componentization)
- index.html에 몰려있던 거대 HTML 구조를 각 모달(.ts) 파일 내부 템플릿으로 이관했습니다.
- 각 모달이 자신의 UI와 로직을 스스로 관리하는 독립 컴포넌트 구조를 구축했습니다.
Index.html 최적화 (Slimming)
- 기존의 거대 파일 구조를 탈피하여 최소한의 레이아웃만 유지하는 슬림한 Shell 구조로 최적화했습니다.
전역 코드 안정화
- 파일 구조 변경에 따른 import 경로를 일괄 업데이트하고, 한글 인코딩 깨짐 문제를 전수 해결하여 빌드 무결성을 확보했습니다.

📂 변경된 아키텍처 구조

src/core/: 핵심 상태 및 데이터 엔진
src/components/Modal/: 독립형 모달 UI/로직 컴포넌트
src/views/: 페이지 단위 메인 렌더링 로직
index.html: 최적화된 앱 Shell

본 이슈는 setting 브랜치에서 진행된 아키텍처 재편 작업을 기반으로 작성되었습니다.

### 📋 작업 개요 프로젝트 규모 확장에 따른 유지보수 효율을 높이고, 다수의 개발자가 협업할 때 발생하는 파일 충돌(특히 `index.html`)을 원천 차단하기 위해 시스템 아키텍처를 전면 재편했습니다. ### 🛠️ 주요 작업 내용 1. **핵심 엔진 분리 (Core Decoupling)** - 전역 상태 관리, 데이터 파싱, 데이터 생성 로직을 `src/core/` 디렉토리로 격리하여 데이터 비즈니스 로직과 UI 로직의 관심사를 분리했습니다. 2. **독립형 모달 컴포넌트 도입 (Componentization)** - `index.html`에 몰려있던 거대 HTML 구조를 각 모달(`.ts`) 파일 내부 템플릿으로 이관했습니다. - 각 모달이 자신의 UI와 로직을 스스로 관리하는 독립 컴포넌트 구조를 구축했습니다. 3. **Index.html 최적화 (Slimming)** - 기존의 거대 파일 구조를 탈피하여 최소한의 레이아웃만 유지하는 슬림한 Shell 구조로 최적화했습니다. 4. **전역 코드 안정화** - 파일 구조 변경에 따른 import 경로를 일괄 업데이트하고, 한글 인코딩 깨짐 문제를 전수 해결하여 빌드 무결성을 확보했습니다. ### 📂 변경된 아키텍처 구조 - `src/core/`: 핵심 상태 및 데이터 엔진 - `src/components/Modal/`: 독립형 모달 UI/로직 컴포넌트 - `src/views/`: 페이지 단위 메인 렌더링 로직 - `index.html`: 최적화된 앱 Shell --- *본 이슈는 `setting` 브랜치에서 진행된 아키텍처 재편 작업을 기반으로 작성되었습니다.*

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: Taehoon/ITAM#8