---
id: useDataGrid
title: useDataGrid
example-title: Material UI's useDataGrid Hook
example-tags: [table, mui]
---

You may use the `useDataGrid` hook to process your data with features compatible with the MUI X [DataGrid](https://mui.com/x/react-data-grid/) and [DataGridPro](https://mui.com/x/react-data-grid/) component. You can be used as an out-of-the-box feature without needing to do extra operations for sorting, filtering, and pagination.

[Refer to the `useDataGrid` hook documentation for more information. →](/docs/ui-integrations/material-ui/hooks/use-data-grid)

## With `DataGrid` Component

<CodeSandboxExample path="table-material-ui-use-data-grid" />

## With `DataGridPro` Component

<CodeSandboxExample path="table-material-ui-data-grid-pro" />
