1. AUIGrid 소개 및 사용 방법

1.1 AUIGrid 란?

AUIGrid 는 순수 자바스크립트와 HTML, CSS 로 작성된 웹 데이터 그리드(DataGrid) 입니다.

AUIGrid 는 다양한 형태의 데이터를 표현할 수 있는 고성능 데이터 그리드 컴포넌트입니다.

1.2 지원 브라우저


Chrome	Edge	Firefox	Safari	Opera	Android	iOS
Yes	Yes(IE 모드 지원 안함)	Yes	Yes	Yes	Yes	Yes

1.3 지원 개발 환경

AUIGrid는 순수 JavaScript 컴포넌트로 다양한 프레임워크에서 쉽게 사용할 수 있습니다.

순수 JS(Vanilla JS)
jQuery
Vue
React

1.4 AUIGrid 사용 방법

AUIGridLicense.js, AUIGrid.js, AUIGrid_style.css 포함
HTML에 다음과 같이 삽입


<!-- AUIGrid 라이센스 파일입니다. 그리드 출력을 위해 꼭 삽입하십시오. -->
<script src="./AUIGrid/AUIGridLicense.js"></script>
<!-- AUIGrid 라이브러리 메인 JS -->
<script src="./AUIGrid/AUIGrid.js"></script>
<!-- AUIGrid CSS 테마 파일 (원하는 테마로 변경 가능) -->
<link rel="stylesheet" href="./AUIGrid/AUIGrid_style.css" />

비상업용 버전의 CDN으로 시작하기

AUIGrid는 비상업용 버전의 CDN을 제공합니다. 정품은 CDN으로 제공하지 않습니다. 비상업용 목적의 localhost 또는 127.0.0.1 환경에서 무료로 시작할 수 있습니다.

비상업용 CDN 시작 안내에서 연결 코드와 데이터가 포함된 HTML 예제를 확인하십시오. GitHub 저장소에서 라이브러리와 React/Vue 샘플을 내려받을 수도 있습니다.

localhost 이외의 테스트 서버나 접속 도메인/IP에서 확인하려면 평가판을 내려받아 사용할 수 있습니다. 평가판 안내에서 접속 주소 입력 방법과 실행 절차를 확인하십시오.

1.5 폴더 구조

제품 패키지를 압축을 해제하면 다음 디렉토리가 보입니다.

AUIGrid: AUIGrid 라이브러리와 스타일(css)
AUIGrid-React: React.js용 서브 컴포넌트
AUIGrid-Vue: Vue.js용 서브 컴포넌트
documentation: 공식 문서 (index.html 포함)
export_server_samples: 서버 내보내기 샘플(PHP, JSP, ASP)
pdfkit: PDF 출력용 라이브러리
samples: JavaScript 샘플
samples-React.js: React 샘플
samples-React.tsx: React + TypeScript 샘플
samples-Vue.js: Vue 샘플
samples-Vue.ts: Vue + TypeScript 샘플

1.6 일반 JS 샘플 실행 방법

제품 패키지를 압축 해제한 후 해당 라이선스가 허용하는 웹 서버에 배치합니다. 비상업용 배포본은 로컬 웹 서버에 배치합니다.
/samples 또는 /documentation 폴더의 index.html을 브라우저로 실행합니다.
AUIGrid 샘플 기능을 바로 확인하고 테스트할 수 있습니다.

1.7 Vue, React 샘플 실행 방법

컴포넌트 생성, TypeScript 예제, 이벤트와 속성은 7. React, Vue 및 TypeScript에서 사용하기에서 확인하십시오.

폴더명	프레임워크	빌드 도구	실행 명령어
samples-React.js	React (JS 기반)	Vite	`npm install && npm run dev`
samples-React.tsx	React + TypeScript	Vite	`npm install && npm run dev`
samples-Vue.js	Vue 3 (JS 기반)	Vite	`npm install && npm run dev`
samples-Vue.ts	Vue 3 + TypeScript	Vite	`npm install && npm run dev`

공통 실행 흐름:

React 샘플(samples-React.js, samples-React.tsx)은 Node.js 20.19 이상(20.x) 또는 22.12 이상에서 실행합니다. 기존 npm start도 사용할 수 있습니다.


	cd [샘플폴더]
	npm install
	npm run dev

Vue 샘플(samples-Vue.js, samples-Vue.ts)


	cd [샘플폴더]
	npm install
	npm run dev