본문으로 건너뛰기

1.4. UI 개요

전체 화면 구성​

OPENMARU MCM Console는 다음과 같은 주요 영역으로 구성됩니다:

UI 전체 화면
영역설명
상단바 (TopBar)로고, 검색, 사이드바 토글, 테마 전환, 전체화면, 계정 메뉴
사이드바 (Sidebar)메뉴 네비게이션, 리소스 생성 버튼, 사이드바 접기/펼치기
메인 콘텐츠 (Main Content)선택한 메뉴에 따른 콘텐츠 표시 영역

상단바 (TopBar)​

상단바는 화면 최상단에 위치하며 다음 요소들을 포함합니다:

요소 설명​

요소아이콘설명
로고OPENMARU MCM 로고클릭 시 Overview 페이지로 이동
검색창🔍리소스, 페이지, 클러스터를 이름으로 검색 (/ 키로 빠른 접근)
사이드바 토글☰사이드바 접기/펼치기
다크 모드🌙라이트/다크 테마 전환
전체화면⛶브라우저 전체화면 모드 전환
계정👤사용자 정보 및 로그아웃 메뉴

검색 기능​

검색창을 클릭하거나 / 키를 눌러 글로벌 검색을 사용할 수 있습니다.

검색 기능

검색 가능 항목:

  • 리소스 (Deployments, Pods, Services 등)
  • 페이지 (메뉴 항목)
  • 클러스터 이름

계정 메뉴​

계정 아이콘을 클릭하면 다음 옵션을 확인할 수 있습니다:

계정 메뉴
메뉴 항목설명
사용자 정보로그인한 사용자명 및 이메일 표시
설정설정 페이지로 이동
로그아웃로그아웃 및 로그인 페이지로 이동

사이드바 (Sidebar)​

사이드바는 화면 왼쪽에 위치하며 메뉴 네비게이션을 제공합니다.

사이드바 확장 상태​

사이드바 확장

메뉴 구조​

사이드바 메뉴는 다음과 같이 구성됩니다:

카테고리하위 메뉴설명
멀티클러스터 개요-대시보드 홈 화면
멀티클러스터토폴로지, 클러스터, 네임스페이스, 노드클러스터 관리
워크로드배포, 데몬 세트, 상태저장 세트, 작업, Cron 작업, 구성 맵, 시크릿, 오토스케일러, 복제 세트, 파드Kubernetes 워크로드 관리
네트워킹서비스, 인그레스네트워크 리소스 관리
스토리지PVC스토리지 리소스 관리
멀티클러스터 정책전파 정책, 오버라이드 정책멀티클러스터 정책 관리
설정-사용자 설정

메뉴 배지​

일부 메뉴 항목에는 배지가 표시됩니다:

배지의미
PPropagation - 멀티클러스터 전파 정책이 적용된 리소스
MMember Cluster - 멤버 클러스터 전용 리소스

생성 버튼​

사이드바 하단의 "+ 생성" 버튼을 클릭하면 YAML 에디터를 통해 새 리소스를 생성할 수 있습니다.

사이드바 접기/펼치기​

  • 사이드바 토글 버튼: 상단바의 ☰ 아이콘 클릭
  • 사이드바 하단 화살표: 사이드바 하단의 < 버튼 클릭
  • 접힌 상태에서는 아이콘만 표시되며, 호버 시 메뉴명이 툴팁으로 나타납니다.

메인 콘텐츠 영역​

메인 콘텐츠 영역은 선택한 메뉴에 따라 다양한 화면을 표시합니다.

공통 요소​

대부분의 페이지에서 다음 요소들이 공통으로 나타납니다:

요소설명
페이지 타이틀현재 페이지 이름과 아이콘
요약 카드리소스 상태 요약 (정상/실패 개수)
리소스 목록테이블 형태의 리소스 목록
필터/검색네임스페이스, 클러스터 필터 및 검색
새로고침데이터 수동 새로고침 버튼

상세 페이지 구성​

리소스 상세 페이지는 일반적으로 다음 탭으로 구성됩니다:

탭설명
개요리소스 기본 정보, 레이블, 주석
YAML리소스 YAML 정의 (편집 가능)
이벤트관련 Kubernetes 이벤트
클러스터멀티클러스터 배포 상태 (정책 적용 리소스)

테마​

OPENMARU MCM Console는 라이트 모드와 다크 모드를 지원합니다.

  • 라이트 모드: 밝은 배경, 기본 설정
  • 다크 모드: 어두운 배경, 눈의 피로 감소

테마는 상단바의 🌙 아이콘을 클릭하여 전환할 수 있습니다.

키보드 단축키​

단축키기능
/검색창 포커스
Esc다이얼로그/팝업 닫기

반응형 디자인​

OPENMARU MCM Console는 다양한 화면 크기에 대응합니다:

  • 데스크톱: 전체 UI 표시
  • 태블릿: 사이드바 자동 접힘
  • 모바일: 사이드바 오버레이 모드

다음 단계​