Getting Started
Install your first UtilTools package in under a minute.
What you get with every package
- Framework-agnostic grid core + React adapter
- Full TypeScript types included
- Sorting, filtering, pagination, row selection
- ESM and CommonJS builds available
- Tree-shakeable package builds
- Semantic versioning with changelogs
1
Choose a package
Browse the packages list and pick the one that fits your need. Free packages have no sign-up required.
Browse packages2
Install via npm
Add the package to your project with npm, yarn, or pnpm.
# npm
npm install @utiltools/datagrid
# yarn
yarn add @utiltools/datagrid
# pnpm
pnpm add @utiltools/datagrid3
Render your first grid
Use the React package for a fast setup with sorting, filtering, and pagination.
import { DataGrid } from '@utiltools/datagrid';
import '@utiltools/datagrid/styles.css';
const data = [
{ id: 1, name: 'Alice', role: 'Admin' },
{ id: 2, name: 'Bob', role: 'User' },
];
const columns = [
{ key: 'name', label: 'Name', sortable: true, filterable: true },
{ key: 'role', label: 'Role', sortable: true },
];
export default function App() {
return <DataGrid data={data} columns={columns} rowKey="id" pageSize={10} />;
}