# GeeGrid AI Developer Guide

언어 선택: [한국어](/GEEGRID_AI_DEVELOPER_GUIDE.ko.md) | [English](/GEEGRID_AI_DEVELOPER_GUIDE.en.md)

이 문서는 다른 AI가 GeeGrid 화면 소스를 생성·수정할 때 사용하는 기준 문서입니다.

## 문서 읽기 순서

1. `/llms.txt`
2. `/llms-full.txt`
3. `/doc/`
4. `/reference/grid/`
5. `/api/widget-api`
6. `/guide/`
7. `/geegrid-example.html`

## 생성 절차

1. 요구사항에서 화면, 입력, 결과 Grid, API를 분리한다.
2. 기존 `id`, `<geegrid>`, `<column>`, `<gg-layout>`, `<gg-frame>`, `<gg-layer>` 구조를 먼저 확인한다.
3. 검색 입력은 기본적으로 native `textarea`, `input`, `button`과 `addEventListener`를 사용한다.
4. 데이터 형태에 따라 `setObjectData`, `setArrayData` 중 하나를 선택한다.
5. 이벤트 속성에는 실행식이 아니라 콜백 이름만 선언한다.
6. `GeeGrid.on()`에 콜백을 등록한다.
7. API 연결 전 mock 데이터로 화면 흐름을 확인한다.
8. 실제 API 연결 뒤 정적 문법 검사를 수행한다.

## 데이터 형태 선택

| 데이터 | 사용 API |
| --- | --- |
| 객체 행 | `setObjectData(rows)` |
| 배열 행 | `setArrayData(fieldNames, rows)` |
| JSON에서 파싱된 객체 레코드 | `setObjectData(records)` |

## Grid Mock 조회 순서

```js
var grid = new GeeGrid('userGrid');

GeeGrid.on('load_users', function () {
  var records = [{ id: 1, name: '홍길동' }];
  grid.setTotalCount(records.length);
  grid.setCurrentPage(1);
  grid.setViewLength(20);
  grid.setObjectData(records);
  grid.makePaging();
});
```

## 금지 사항

- 확인되지 않은 `<cond>` 또는 임의 `data-*` 계약 생성
- 속성에 함수 실행식 직접 작성
- 정렬값을 SQL에 직접 연결
- 확인되지 않은 인증 헤더 작성
- Runtime·Builder 내부 구현을 추측해 문서화
- API 계약 없이 `fetch`, API URL, 응답 구조 생성

근거: `codex_base/GEEGRID_USAGE.md`, `codex_base/GEEGRID_API.md`, `GEEGRID_SYNTAX.md`, `geegrid-example.html`.