95bef976a5
- 여러 문서의 내용을 업데이트하여 최신 정보를 반영하였습니다. - 컴포넌트 개발 가이드와 관련된 문서의 목차를 재구성하고, V2 및 Zod 레이아웃 시스템에 대한 내용을 추가하였습니다. - 화면 컴포넌트 개발 가이드를 개선하여 핵심 원칙과 패턴을 명확히 설명하였습니다. - 불필요한 문서 및 가이드를 삭제하고, 통합된 가이드를 통해 개발자들이 쉽게 참고할 수 있도록 하였습니다.
6.9 KiB
6.9 KiB
Phase 0: 컴포넌트 사용 현황 분석
분석 일시
2024-12-19
분석 대상
- 활성화된 화면 정의 (screen_definitions.is_active = 'Y')
- 화면 레이아웃 (screen_layouts)
1. 컴포넌트별 사용량 순위
상위 15개 컴포넌트
| 순위 | 컴포넌트 | 사용 횟수 | 사용 화면 수 | V2 매핑 |
|---|---|---|---|---|
| 1 | button-primary | 571 | 364 | V2Input (type: button) |
| 2 | text-input | 805 | 166 | V2Input (type: text) |
| 3 | table-list | 130 | 130 | V2List (viewMode: table) |
| 4 | table-search-widget | 127 | 127 | V2List (searchable: true) |
| 5 | select-basic | 121 | 76 | V2Select |
| 6 | number-input | 86 | 34 | V2Input (type: number) |
| 7 | date-input | 83 | 51 | V2Date |
| 8 | file-upload | 41 | 18 | V2Media (type: file) |
| 9 | tabs-widget | 39 | 39 | V2Group (type: tabs) |
| 10 | split-panel-layout | 39 | 39 | V2Layout (type: split) |
| 11 | category-manager | 38 | 38 | V2Biz (type: category) |
| 12 | numbering-rule | 31 | 31 | V2Biz (type: numbering) |
| 13 | selected-items-detail-input | 29 | 29 | 복합 컴포넌트 |
| 14 | modal-repeater-table | 25 | 25 | V2List (modal: true) |
| 15 | image-widget | 29 | 29 | V2Media (type: image) |
2. V2 컴포넌트별 통합 대상 분석
V2Input (예상 통합 대상: 891개)
| 기존 컴포넌트 | 사용 횟수 | 비율 |
|---|---|---|
| text-input | 805 | 90.3% |
| number-input | 86 | 9.7% |
우선순위: 1위 - 가장 많이 사용되는 컴포넌트
V2Select (예상 통합 대상: 140개)
| 기존 컴포넌트 | 사용 횟수 | widgetType |
|---|---|---|
| select-basic (category) | 65 | category |
| select-basic (null) | 50 | - |
| autocomplete-search-input | 19 | entity |
| entity-search-input | 20 | entity |
| checkbox-basic | 7 | checkbox |
| radio-basic | 5 | radio |
우선순위: 2위 - 다양한 모드 지원 필요
V2Date (예상 통합 대상: 83개)
| 기존 컴포넌트 | 사용 횟수 |
|---|---|
| date-input (null) | 58 |
| date-input (date) | 23 |
| date-input (text) | 2 |
우선순위: 3위
V2List (예상 통합 대상: 283개)
| 기존 컴포넌트 | 사용 횟수 | 비고 |
|---|---|---|
| table-list | 130 | 기본 테이블 |
| table-search-widget | 127 | 검색 테이블 |
| modal-repeater-table | 25 | 모달 반복 |
| repeater-field-group | 15 | 반복 필드 |
| card-display | 11 | 카드 표시 |
| simple-repeater-table | 1 | 단순 반복 |
우선순위: 4위 - 핵심 데이터 표시 컴포넌트
V2Media (예상 통합 대상: 70개)
| 기존 컴포넌트 | 사용 횟수 |
|---|---|
| file-upload | 41 |
| image-widget | 29 |
V2Layout (예상 통합 대상: 62개)
| 기존 컴포넌트 | 사용 횟수 |
|---|---|
| split-panel-layout | 39 |
| screen-split-panel | 21 |
| split-panel-layout2 | 2 |
V2Group (예상 통합 대상: 99개)
| 기존 컴포넌트 | 사용 횟수 |
|---|---|
| tabs-widget | 39 |
| conditional-container | 23 |
| section-paper | 11 |
| section-card | 10 |
| text-display | 13 |
| universal-form-modal | 7 |
| repeat-screen-modal | 5 |
V2Biz (예상 통합 대상: 79개)
| 기존 컴포넌트 | 사용 횟수 |
|---|---|
| category-manager | 38 |
| numbering-rule | 31 |
| flow-widget | 8 |
| rack-structure | 2 |
| related-data-buttons | 2 |
| location-swap-selector | 2 |
| tax-invoice-list | 1 |
3. 구현 우선순위 결정
Phase 1 우선순위 (즉시 효과가 큰 컴포넌트)
| 순위 | V2 컴포넌트 | 통합 대상 수 | 영향 화면 수 | 이유 |
|---|---|---|---|---|
| 1 | V2Input | 891개 | 200+ | 가장 많이 사용 |
| 2 | V2Select | 140개 | 100+ | 다양한 모드 필요 |
| 3 | V2Date | 83개 | 51 | 비교적 단순 |
Phase 2 우선순위 (데이터 표시 컴포넌트)
| 순위 | V2 컴포넌트 | 통합 대상 수 | 이유 |
|---|---|---|---|
| 4 | V2List | 283개 | 핵심 데이터 표시 |
| 5 | V2Layout | 62개 | 레이아웃 구조 |
| 6 | V2Group | 99개 | 콘텐츠 그룹화 |
Phase 3 우선순위 (특수 컴포넌트)
| 순위 | V2 컴포넌트 | 통합 대상 수 | 이유 |
|---|---|---|---|
| 7 | V2Media | 70개 | 파일/이미지 |
| 8 | V2Biz | 79개 | 비즈니스 특화 |
| 9 | V2Hierarchy | 0개 | 신규 기능 |
4. 주요 발견 사항
4.1 button-primary 분리 검토
- 사용량: 571개 (1위)
- 현재 계획: V2Input에 포함
- 제안: 별도
V2Button컴포넌트로 분리 검토- 버튼은 입력과 성격이 다름
- 액션 타입, 스타일, 권한 등 복잡한 설정 필요
4.2 conditional-container 처리
- 사용량: 23개
- 현재 계획: 공통 conditional 속성으로 통합
- 확인 필요: 기존 화면에서 어떻게 마이그레이션할지
4.3 category 관련 컴포넌트
- select-basic (category): 65개
- category-manager: 38개
- 총 103개의 카테고리 관련 컴포넌트
- 카테고리 시스템 통합 중요
5. 다음 단계
- 데이터 마이그레이션 전략 설계 (Phase 0-2)
- sys_input_type JSON Schema 설계 (Phase 0-3)
- DynamicConfigPanel 프로토타입 (Phase 0-4)
- V2Input 구현 시작 (Phase 1-1)