권다혜 · 설정 위저드 데모포트폴리오로 돌아가기

조합이 화면 구성을 결정하는 설정 위저드

통합 모니터링 솔루션에서 담당했던 장치·플랫폼 설정 화면의 구조를 재현한 데모입니다. 1단계에서 자원 유형과 벤더를 확정하면, 2단계에는 그 조합에 필요한 섹션과 입력 항목만 구성됩니다.

단계 사이 이동은 자유롭습니다. 초기화 안내는 1단계에서 조합을 실제로 바꿀 때, 그리고 2단계에서 상위 필드를 바꿀 때만 나타납니다. 오른쪽 패널에 어떤 조건이 어느 시점에 해석됐는지 기록됩니다.

실무 코드를 사용하지 않고 새로 구현했습니다. 벤더명과 설정 항목은 모두 일반화한 가상 값이며, 실제 프로젝트의 도메인 데이터는 포함되어 있지 않습니다.

조건이 해석되는 세 층

  1. 확정자원 유형 → 섹션 목록. 1단계 선택으로 확정되므로 조회 데이터로 관리합니다.
  2. 확정자원 유형 × 벤더 → 섹션별 컴포넌트. 같은 시점에 확정되므로 조합 표에서 조회해 주입합니다.
  3. 반응필드 값 → 하위 필드 구성. 입력 중 계속 바뀌므로 런타임 계산으로 격리합니다.
  1. 1단계자원 유형 · 벤더 선택미설정
  2. 2단계설정 입력미설정

1단계 — 자원 유형과 벤더 선택

빗금 칸은 미지원 조합
자원 유형벤더1벤더2벤더3
컴퓨트
네트워크
스토리지

조합 표는 화면 코드가 아니라 별도 데이터로 관리됩니다. 벤더가 추가될 때 화면을 수정하지 않아도 됩니다.