reopt designreopt design
DocsExploreToolsPricingBuilder
Start
Start
Playground
Core Concepts
Core Concepts
DataGrid
DataGrid 개요
Editable Data Entry
Operations Monitoring
Large Data
Remote Protocol
Migration Playbook
App Composition Guide
Column Playbook
Build & Operate
Skills
Release Notes
Reference
Hook Reference
Type Reference
Oopt-datagrid
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • GitHub
  • Terms of Service
  • Privacy Policy

© 2026 reopt-ai. All rights reserved.

Build & Operate
  1. Docs
  2. /
  3. Build & Operate
  4. /
  5. Skills

Skills

opt-datagrid 설치, 마이그레이션, backend contract, 업그레이드, release용 action skill을 정리합니다.

reopt design · Updated Jun 26, 2026

시작하기핵심 개념개요편집형 데이터 입력운영 모니터링대규모 데이터원격 연동 계약마이그레이션 플레이북앱 조합 가이드컬럼 설계 플레이북Skills릴리즈 노트Hook 레퍼런스타입 레퍼런스

1. DataGrid Skills는 무엇인가

opt-datagrid Skills는 @reopt-ai/opt-datagrid 의 설치, 마이그레이션, 원격 datasource backend contract, 업그레이드, release를 작업 단위로 처리하기 위한 action guide입니다.

이 페이지는 DataGrid 전용 workflow만 다룹니다. opt-ui 와 opt-editor 전용 skill은 각각 /docs/opt-ui/skills, /docs/opt-editor/skills 에서 따로 설명합니다.

2. 주요 Skills

Skill실행 위치용도
/opt-datagrid-init소비자 프로젝트설치, .npmrc, TypeScript 경로, 기본 예제 생성, migrate 모드
/opt-datagrid-upgrade소비자 프로젝트버전 감지, 영향 범위 스캔, breaking change 적용, 검증
/opt-datagrid-syncopt-ui repo타겟 grid 사용 분석 → opt-datagrid 개선 → 검증
/opt-datagrid-backendbackend 또는 consumer reporemote datasource protocol 설계와 review
/design-publishopt-ui repoopt-ui / opt-editor / opt-datagrid 통합 배포와 preflight 검증

읽기 전용 API/레시피는 node_modules/@reopt-ai/opt-datagrid/dist/docs/ 를 직접 보고, 실제 설치/변환/업그레이드/프로토콜 결정은 action skill로 처리합니다.

3. 대표 워크플로우

소비자 프로젝트에 opt-datagrid 도입

text
consumer project: /opt-datagrid-init
                 node_modules/@reopt-ai/opt-datagrid/dist/docs/
                 /opt-datagrid-upgrade

/opt-datagrid-init 는 설치, 인증, tsconfig, 기본 예제 생성까지 한 번에 처리합니다. 이후 레퍼런스는 dist/docs 에서 확인하고, 버전 업그레이드는 /opt-datagrid-upgrade 로 이어집니다.

기존 grid 라이브러리 전환

text
consumer project: /opt-datagrid-init migrate
           (기존 grid -> opt-datagrid 코드 변환)

opt-ui repo: /opt-datagrid-sync ../target-project
(타겟 사용 분석 -> 패키지 개선)

소비자 코드 전환이 목적이면 /opt-datagrid-init migrate 를 쓰고, 타겟 프로젝트 패턴을 분석해서 패키지 자체를 개선해야 하면 /opt-datagrid-sync 를 사용합니다. 둘은 위치와 목적이 다릅니다.

원격 datasource backend 계약

text
backend or consumer repo: /opt-datagrid-backend plan
backend or consumer repo: /opt-datagrid-backend review

/opt-datagrid-backend 는 openView, loadRows, saveEdits, subscribeToInvalidations 같은 protocol decision을 먼저 고정하는 데 초점을 둡니다.

사설 배포

opt-datagrid는 /design-publish 로 배포합니다. 이 스킬은 opt-ui, opt-editor, opt-datagrid 통합 배포를 지원하며, preflight와 버전 태깅은 이 경로를 기준으로 맞추는 것이 안전합니다.

4. 어떤 repo에서 실행해야 하나

/opt-datagrid-init, /opt-datagrid-upgrade 는 실제 소비자 프로젝트에서 실행합니다. 반면 /opt-datagrid-sync 와 /design-publish 는 opt-ui monorepo에서 실행해야 합니다. /design-publish 는 opt-ui, opt-editor, opt-datagrid를 함께 관리하는 통합 배포 스킬입니다. /opt-datagrid-backend 는 backend 또는 consumer repo에서 contract 설계 기준으로 사용합니다.

repo를 잘못 고르면 경로 해석, migration 대상 탐지, release 파일 생성 위치가 모두 달라집니다. 그래서 action skill은 실행 위치를 명시적으로 전제합니다.

5. 언제 Skills를 먼저 봐야 하나

  • 신규 프로젝트에 opt-datagrid를 설치하고 첫 그리드를 띄워야 하는 경우

  • glide-data-grid, ag-grid, react-data-grid에서 전환하려는 경우
  • 원격 datasource backend contract를 설계하거나 기존 API를 감사해야 하는 경우

  • 패키지 버전을 올리면서 breaking change를 안전하게 적용해야 하는 경우

  • 타겟 프로젝트의 grid 사용 패턴을 분석해 opt-datagrid 자체를 개선하려는 경우

  • 독립 release를 preflight 포함 경로로 실행해야 하는 경우

반대로 단순 props, hook 시그니처, 편집 API 예제만 필요하면 DataGrid 문서와 dist/docs 레퍼런스를 먼저 보면 됩니다. Skills 문서는 설치, 전환, 계약, 업그레이드 같은 작업 흐름을 다룹니다.

PreviousColumn Playbook도메인별 컬럼 구조, 에디터 선택, 성능 옵션 설계 원칙DataGrid
Go to Column Playbook
NextRelease Notesopt-datagrid 버전별 변경 사항과 하이라이트를 패키지 기준으로 정리합니다.Build & Operate