오픈 소스 Web Components 그리드

    Ignite UI for Web Components Grid Lite는 Infragistics 오픈 소스 UI 컴포넌트 세트의 일부로, 적극적으로 지원되고 유지 관리되고 있습니다. 웹 컴포넌트로 구축된 오픈 소스 자바스크립트 데이터 그리드로, 웹 프레임워크 유무에 관계없이 의존성 없이 사용할 수 있습니다. MIT 라이선스 하에 Angular, React, Blazor, Web Components 전반에 걸쳐 40+ OSS 제어가 제공됩니다.

    그리드 라이트는 최소한의 오버헤드와 사용자가 기대하는 성능을 갖춘 필수 데이터 표시 기능을 제공합니다. 기업용 그리드의 복잡함 없이 빠르고 가벼운 데이터 표현이 필요한 개발자를 위해 설계되었습니다.

    그리드 라이트의 특징:

    • 열 필터링
    • 숨김
    • 크기 조정
    • 정렬
    • Row Virtualization
    • 접근성
    • 테마와 스타일링
    • 열 데이터 유형

    Installation and Setup

    Installation

    Grid Lite를 설치하려면 프로젝트의 루트 폴더(package.json위치)로 가서 npm을 사용해 다음 명령을 실행하세요:

    npm install igniteui-grid-lite --save

    또는 실을 사용하기도 합니다:

    yarn add igniteui-grid-lite

    Using the Grid Lite in your Web Components code

    Grid Lite를 사용하고 싶은 파일에서, 컴포넌트 클래스나 함수가 선언되기 전에 임포트하고 등록하세요:

    <div class="grid-lite-wrapper">
    <igc-grid-lite id="grid-lite"></igc-grid-lite>
</div>

    Grid Lite in Action

    Grid Lite는 앱에서 아름다운 데이터 그리드/데이터 테이블 경험을 제공하는 데 필요한 핵심 기능을 제공하기 위해 설계되었습니다. 성능과 아름다움을 위해 설계된 Grid Lite는 어떤 프레임워크와 플랫폼에서도 작동할 수 있습니다.

    Performance Built In

    행 단위 가상화는 부드러운 스크롤로 무제한 데이터를 렌더링할 수 있게 해줍니다.

    Automatic Column Types

    컬럼 유형은 데이터 소스를 기반으로 자동으로 생성되며, 각 컬럼 유형에 맞춘 내장 필터링이 있습니다.

    Custom Column Templates

    칼럼 템플릿으로 어떤 종류의 UX든 제공하세요. 상상하는 모든 것을 그리드 열로 렌더링할 수 있습니다!

    Interactive Features

    사용자가 기대하는 모든 핵심 인터랙티브 기능: 열 필터링, 열 숨기기, 열 크기 조정, 열 정렬 등.

    Beautiful UX & Branding

    Bootstrap, Material, Fluent에 대한 내장 테마 지원과 더불어 색상 팔레트, 폰트, 높이도, 디스플레이 밀도 등 무한한 브랜딩 옵션이 제공됩니다.

    Rich Keyboard Navigation

    완전한 엑셀 스타일의 키보드 내비게이션은 사용자가 기대하는 경험을 제공하며, 대규모 데이터셋에서도 높은 성능을 제공합니다.