# 키보드와 다국어

Grid는 많은 행과 열을 키보드로 탐색하는 작업 공간입니다. 셀 이동·편집·메뉴 진입과 화면 밖 앱 버튼으로 나가는 경로가 모두 이해 가능해야 합니다.

Canonical: https://grid.syidax.com/ko/docs/guides/keyboard-a11y-i18n/

<a id="understand"></a>

## 동작 원리와 선택 기준

언어 설정은 Grid 기본 문구를 바꿉니다. 열 이름·원본 데이터·앱 안내 문구는 앱이 직접 번역하고, 숫자·날짜 표시는 valueFormatter에서 목적에 맞게 처리합니다.

코드의 grid는 설치와 연결 장에서 준비한 Grid 요소입니다. 예제마다 필요한 데이터·설정을 확인하고, 코드에서 소개하는 앱 함수와 서버 주소는 프로젝트에 맞게 구현하세요.

- [설치와 연결 · 공통 예제 데이터](https://grid.syidax.com/ko/docs/guides/getting-started.md)

<a id="example-1"></a>

## 예제 1. 한국어와 키보드 탐색

한국어 안내와 키보드 탐색이 가능한 기본 환경을 구성합니다.

```javascript
grid.locale = 'ko';
grid.keyboardNavigation = true;
```

결과 확인: 기본 문구가 한국어로 표시되고 키보드 탐색을 사용할 수 있습니다. 모든 버튼과 편집기를 Tab·방향키·Enter·Escape로 확인하세요.

<a id="example-2"></a>

## 예제 2. 지원 언어 전환

앱의 언어 선택 결과를 Grid에 전달합니다.

```javascript
grid.locale = 'ja';
```

결과 확인: Grid의 내장 문구가 일본어로 바뀝니다. 주문 상태 같은 원본 값이 자동 번역되는 것은 아닙니다.

<a id="example-3"></a>

## 예제 3. 접근 가능한 업무 셀

렌더러의 버튼에 행을 구분하는 이름을 제공하고 상태 색 옆에 텍스트도 표시합니다. 표 바깥에는 결과 개수와 저장 결과를 읽을 수 있는 안내 영역을 둡니다.

결과 확인: 스크린 리더와 키보드 사용자가 현재 위치와 다음 동작을 알 수 있습니다. 대량 데이터 갱신마다 모든 셀 내용을 live region으로 읽게 만들지 마세요.

<a id="pitfalls"></a>

## 조합할 때와 문제를 해결할 때

앱이 모든 keydown을 가로채면 Grid 편집·탐색이 깨집니다. 단축키의 대상과 기본 동작 차단 범위를 제한합니다.

행 가상화는 일부 DOM만 유지합니다. DOM에 없는 행을 접근할 수 없다고 단정하지 말고 실제 탐색과 안내를 보조 기술로 확인합니다.

<a id="related-api"></a>

## 이 기능에 사용하는 API

- [locale](https://grid.syidax.com/ko/docs/options/locale.md) — 한국어·영어·일본어 프리셋 또는 기본 메시지를 덮어쓸 객체입니다. 원본 데이터와 열 제목은 앱에서 번역합니다.
- [keyboardNavigation](https://grid.syidax.com/ko/docs/options/keyboardNavigation.md) — 셀과 Grid 내부 기능을 키보드로 탐색하는 동작을 설정합니다.
- [activeCellChanged](https://grid.syidax.com/ko/docs/events/activeCellChanged.md) — 키보드·포인터 조작으로 활성 셀이 바뀌었을 때 발생합니다. 선택 범위나 행 선택과 다른 상태입니다.
- [localeChanged](https://grid.syidax.com/ko/docs/events/localeChanged.md) — Grid 언어 설정이 바뀌었을 때 발생합니다.

<a id="next"></a>

## 함께 읽기

- [행·열·ID의 관계](https://grid.syidax.com/ko/docs/guides/concepts.md)
- [결과와 이벤트 연결](https://grid.syidax.com/ko/docs/guides/data-event-access.md)
- [Features에서 살펴보기](https://grid.syidax.com/grid/keyboard-a11y-i18n) — 직접 체험 가능한 범위는 해당 가이드에 안내되어 있습니다.