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" /> 

주의: AUIGrid는 현재 공식 CDN을 제공하지 않음

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 샘플 실행 방법

1. 제품 패키지를 압축을 해제한 후 웹 서버에 FTP 또는 파일 복사 방식으로 업로드합니다.
2. /samples 또는 /documentation 폴더의 index.html을 브라우저로 실행합니다.
3. AUIGrid 샘플 기능을 바로 확인하고 테스트할 수 있습니다.

1.7 Vue, React 샘플 실행 방법

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

공통 실행 흐름:

cd [샘플폴더]
npm install
npm start   // 또는 npm run dev / serve