Back Office의 구조

...

1. 헤더(Header, Global Navigation)

2. 사이드바(SidebarSideBar)

3. 본문(BODY)

4. 푸터(Footer)

• Sidebar 상단 백오피스 목록을 선택하면 하단에 해당 백오피스의 LNB 메뉴가 출력됩니다.

• Sidebar 하단의 LNB 메뉴를 선택하면 해당 메뉴의 셋팅 화면이 BODY에 출력됩니다.

• Header(GNB)에 Header에 있는 수정 버튼아이콘(BackOffice Builder)을 이용하여 클릭하여 BODY 화면 구성을 언제든지 변경할 수 있습니다.

...

[1] 헤더

...

영역

프로젝트 타이틀 정보와 함께 환경 설정 기능과 로그인 정보로 구성되어 있습니다.

...

1. 프로젝트 타이틀

   • 프로젝트 로고와 타이틀이 출력됩니다.

2. 환경 설정

   • 수정: BackOffice Builder가 새창으로 출력되며, BODY 영역의 Component 구성을 변경할 수 있습니다.

   • 테마: 아이콘 클릭 시 Dark와 Light 테마 두 가지로 전환 가능합니다.

   • 언어: 아이콘 클릭 시 Eng와 Kor 언어 두가지로 설정 가능합니다.

3. 로그인 정보

   • 사용자 이름과 함께 Logout 아이콘이 함께 표시됩니다.

...

[2] 사이드바 영역

생성한 백오피스 목록과 LNB 메뉴로 구성되어 있으며, 사이드바 열림/닫힘 아이콘이 있습니다.

...

...

[3] 본문 영역

BackOffice Builder를 통해 Component를 조합하여 만든 백오피스 페이지가 출력되는 영역 입니다.

...