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 more comprehensive overview of the features, watch KendoReact Product Manager Carl Bergenhem's guided tour of the React Data Grid.

Looking for getting started articles, editable examples with source code and API props? Visit the KendoReact Data Grid Documentation.

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

Presenter
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 100+ UI components that range from advanced components including the data grid, charts and gauges, rich text editor, pivot grid 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 complete KendoReact UI library.