AUD PLATFORM
페이지 트리

버전 비교

이전 버전 42

changes.mady.by.user guide

에 저장

비교대상

새 버전 현재

changes.mady.by.user guide

에 저장

키

  • 이 줄이 추가되었습니다.
  • 이 줄이 삭제되었습니다.
  • 서식이 변경되었습니다.

Image Added


01

템플릿 유형 선택 (Select Template)

아래 탭에서 원하는 양식을 선택하세요. 유형에 따라 프로세스가 달라집니다.
정보

어떤 유형을 선택해야 할까요?

Section


Column
width50%


패널
borderColor

...

#059669
bgColor

...

#f0fdf4
borderStyle

...

AUD 표준 개발 프로세스 가이드

표준 템플릿을 활용한 화면 개발부터 배포까지의 전체 프로세스

none

MX-Grid (엑셀 템플릿)

  • 추천 : 정형 리포트, 데이터 입력/수정, 경영계획
  • 장점 : 엑셀 수식/서식 활용, 빠른 개발 속도



Column
width50%


패널
borderColor

...

#3b82f6
bgColor

...

#eff6ff
01

화면 제작 방식 선택

엑셀 기반 화면 제작 또는 AUD 보고서 템플릿을 선택합니다.

borderStylenone

AUD보고서 템플릿 (Web Component)

  • 추천 : 임원용 대시보드, 시각화, 모바일 호환
  • 장점 : 자유로운 디자인, 화려한 차트 구현





▼ 원하는 유형의 탭을 클릭해 프로세스를 확인하세요 ▼

AUI Tab Group


📊 엑셀 활용 (MX-Grid(엑셀 활용)

엑셀 기반 화면 제작 프로세스


02
기존

엑셀

파일을 활용하여 화면 레이아웃을 구성하고, 데이터 매핑 및 인터랙션을 설정하는 방식입니다.
  1. 엑셀 파일 업로드 – 화면 구조가 정의된 엑셀 파일(.xlsx) 업로드
  2. 데이터 연결 – Dataset Manager 또는 DB Bot을 통한 데이터 매핑
  3. 인터랙션 구현 – Process Bot, Script Editor 활용

✔ 적용 대상

  • 기존 엑셀 화면을 웹으로 전환하는 경우
  • 정형 리포트 및 입력 화면
🎨 AUD 보고서 템플릿

AUD 표준 보고서 템플릿 활용

AUD에서 제공하는 표준 UI 템플릿을 기반으로 신규 화면을 빠르고 일관성 있게 개발합니다.

  1. 템플릿 선택 – 업무 목적에 맞는 레이아웃 선택
  2. 컴포넌트 바인딩 – Grid, Chart 등 데이터 연결
  3. 인터랙션 구현 – 버튼, 팝업, 파라미터 설정

✔ 적용 대상

  • 신규 대시보드 및 시각화 화면
  • 표준 UI 가이드 준수가 필요한 프로젝트
패널
borderColor#e5e7eb

02. 데이터 준비

화면에 표시할 데이터 소스를 준비합니다.

  • 엑셀 파일 업로드 또는 DB 테이블 확인
  • 컬럼 구조 및 데이터 타입 점검
패널
borderColor#e5e7eb

03. 데이터 연결 (Data Mapping)

Dataset Manager 또는 DB Bot을 사용하여 데이터를 매핑합니다.

  • 쿼리 작성 및 데이터셋 생성
  • 컴포넌트와 데이터셋 연결
패널
borderColor#e5e7eb

04. 인터랙션 구현

사용자 이벤트 및 화면 흐름을 구현합니다.

  • 버튼 클릭 이벤트
  • 팝업 및 화면 이동
  • 스크립트 기반 로직 처리
패널
borderColor#e5e7eb

05. 화면 디자인 및 테스트

CI/BI 가이드에 맞춰 디자인을 보완하고 기능 테스트 및 데이터 검증을 수행합니다.

패널
borderColor#e5e7eb

06. 화면 배포

완성된 화면을 포털 메뉴에 등록하고 사용자 권한을 설정하여 배포합니다.

패널
bgColor#1f2937

© 2024 AUD Platform Partner Center

파일 업로드 (Import)

다운로드 받은 엑셀 템플릿에 데이터를 연결하거나, 기존 양식(.xlsx) 그대로 업로드하세요. 작성한 서식과 수식 그대로 엑셀 파일이 웹 화면으로 변환됩니다.

엑셀의 데이터 구조와 기능을 웹 환경에서 그대로 구현할 수 있도록 지원하는 AUD플랫폼의 웹 컴포넌트 도구가 "MX-Grid" 입니다.



03

데이터 연결 (Data Mapping)

MX-Grid의 'D시트'에 DB 데이터를 연결해 출력합니다. 원하는 데이터 연결 방식을 선택하세요.


50%


#adbbc8solid

Dataset Manager (SQL쿼리 작성)

Dataset Manager에서 SQL 쿼리를 직접 작성하여 데이터를 조회합니다.



50%


#adbbc8solid

DB Bot (META 활용)

복잡한 SQL 쿼리 없이 META를 활용해 데이터를 조회합니다.




변수를 활용한 데이터 조회 방법이 궁금하신가요? 　가이드 보기 →　



04

인터랙션 구현 (Interaction)

버튼 클릭, 팝업 호출 등 동적인 동작을 정의합니다.


50%


#adbbc8solid

Process Bot

코딩 없이 클릭 만으로 이벤트 로직을 설정합니다. (No-Code)



50%


#adbbc8solid

Script Editor

JavaScrpit를 활용해 고도화된 로직을 구현합니다.




이벤트 실행 순서 및 생명 주기 (Event Lifecycle)
보고서 실행 및 조회 시 발생하는 이벤트의 순서를 확인하세요.



05

화면 디자인 적용

기업의 브랜드 아이덴티티를 반영하여 최종 결과물을 완성합니다.



#adbbc8solid

폰트 추가

기본 제공 폰트 외에 추가 폰트를 등록하여 사용할 수 있습니다.




#adbbc8solid

박스스타일 변경

템플릿에 적용된 박스스타일을 변경할 수 있으며, 신규로 등록해 사용할 수 있습니다.




#adbbc8solid

이미지 변경

서버에 업로드 된 이미지를 여러 보고서에서 사용할 수 있습니다.





06

완성된 화면 배포

개발이 완료된 화면을 다른 사용자가 조회할 수 있도록 저장할 위치를 지정하고, 사용자 그룹별 조회 권한을 부여하세요.


AUD 보고서


02

컴포넌트 데이터 연결 (Binding)

주로 사용하는 컴포넌트 별 데이터 연결 방법을 안내합니다.



#adbbc8#FCFCFCsolid

Grid


#adbbc8#FFFFFFsolid

SQL


#adbbc8#FFFFFFsolid

META






#adbbc8#FCFCFCsolid

Chart



#adbbc8#FFFFFFsolid

SQL


#adbbc8#FFFFFFsolid

Grid




#adbbc8#FFFFFFsolid

META







#adbbc8#FCFCFCsolid

ComboBox



#adbbc8#FFFFFFsolid

SQL







변수를 활용한 데이터 조회 방법이 궁금하신가요? 　가이드 보기 →　


03

인터랙션 구현 (Interaction)

버튼 클릭, 팝업 호출 등 동적인 동작을 정의합니다.


50%


#adbbc8solid

Process Bot

코딩 없이 클릭 만으로 이벤트 로직을 설정합니다. (No-Code)



50%


#adbbc8solid

Script Editor

JavaScrpit를 활용해 고도화된 로직을 구현합니다.




이벤트 실행 순서 및 생명 주기 (Event Lifecycle)
보고서 실행 및 조회 시 발생하는 이벤트의 순서를 확인하세요. 　가이드 보기 →　



04

화면 디자인 적용

기업의 브랜드 아이덴티티를 반영하여 최종 결과물을 완성합니다.



#adbbc8solid

폰트 추가

기본 제공 폰트 외에 추가 폰트를 등록하여 사용할 수 있습니다.




#adbbc8solid

박스스타일 변경

템플릿에 적용된 박스스타일을 변경할 수 있으며, 신규로 등록해 사용할 수 있습니다.




#adbbc8solid

이미지 변경

서버에 업로드 된 이미지를 여러 보고서에서 사용할 수 있습니다.





05

완성된 화면 배포

개발이 완료된 화면을 다른 사용자가 조회할 수 있도록 저장할 위치를 지정하고, 사용자 그룹별 조회 권한을 부여하세요.