How to Implement a React Data Grid: Getting Started with the KendoReact Grid

The Data Grid is a fundamental UI component used in most business applications. Learn how to get started with the KendoReact Data Grid and how to implement some of its most used features.

In this video, you’ll find an example of how to implement the KendoReact Grid and how to work the following features:
- Theming and styling
- Paging
- Filtering

The React Data Grid has numerous other features, such as:
- Editing
- Grouping
- Sorting
- Virtualization
- Export to Excel & PDF
- Accessibility
- Globalization
- And many more!

For a full list of features, editable examples with source code and API props, visit the KendoReact Grid Documentation.

And here you can find the code in this video (GitHub repository).

TJ VanToll, KendoReact Developer Advocate

About the KendoReact UI Library
KendoReact is a commercial UI library designed and built for developing business applications with React. Every UI component in the KendoReact suite has been built from the ground-up specifically for React.

All KendoReact components are distributed through npm packages. Please keep in mind that in order to use the npm packages you should either sign up for a 30-day free trial or be a licensed developer. The trial also grants free access to our outstanding technical support.

The KendoReact library contains UI components that range from advanced components including the data grid, charts and gauges, rich text editor, and scheduler – to form elements such as date pickers, dropdowns, and various inputs. There are also helper libraries such as PDF and Excel processing packages.

All components in KendoReact are fully accessible and come with compliance for WCAG 2.0, Section 508, and WAI-ARIA accessibility standards.

Check out the full KendoReact UI library.