The Best React Data Grid/Table Libraries with Material Design in 2023 - MRT Blog

1

MUI X

AG Grid is also in a similar situation as MUI X DataGrid, where some of the features are only available in the paid Enterprise version. However, the free version is still very feature-rich and will take you very far in most projects. AG Grid is one of the few high-quality OSS projects out there where it is probably worth every penny to pay for the Enterprise version if you really need it.

#Design Tools #UI Design #Data Grid 1 user reviews

2

AG Grid

The "AG" in AG Grid stands for "Agnostic Grid," which means that the library works in multiple JavaScript Frameworks besides React. On the same note, though, AG Grid does not use Material UI under the hood like all of the other libraries on this list. However, it does stick very close to Material Design, so it will not stick out too far from the rest of the components in your Material UI project.

#Design Tools #UI Design #JavaScript Tools 10 social mentions

3

Material React Table

The final library on this list is Material React Table. This is a relatively new library that was first released in September 2022. Unlike the two previously mentioned libraries, Material React Table is 100% free to use with the MIT license. It is also built directly on top of Material UI v5 and exclusively uses Material UI components under the hood, so it will fit right in with the rest of your Material UI project. Almost all of the Material UI components that are used internally have their props exposed for you to customize and style, so you should not run into many problems where you cannot customize something that you need to.

#Design Tools #UI Design #Data Grid

4

TanStack Table

The main advantage of this project is that it is also built on top of TanStack Table v8 (formerly known as React Table) and TanStack Virtual v3 (formerly known as React Virtual), which are powerful headless UI libraries for efficiently rendering react table components with virtualization. This also means the the APIs to customize the behavior of the table are standardized with TanStack Table's comprehensive API. Compared to other data grid/table libraries, Material React Table is very customizable and flexible.

#Design Tools #UI Design #Data Grid 5 social mentions

5

material-table

Material-Table is a library that I used to use a lot. It was awesome. Unfortunately, the maintainer does not seem to be active on GitHub anymore, and the project is no longer being actively maintained. It went a couple of years without getting any updates, and you will receive some glaring NPM audit security warnings if you install this in your project.

#Design Tools #UI Design #Data Grid

6

MUI-Datatables

MUI-Datatables is a library that is good overall, visually well designed, and even still maintained enough to stay up to date with Material UI v5. However, it lacks good documentation and can be hard to figure out how to use. It no longer has a documentation site, so the API section in the README is the only documentation that you get. It is also worth noting that at the time of writing, there are almost 600 open and unresolved issues in the GitHub repo, and none of the issues seem to get any attention from the maintainers. Overall, I would not recommend starting new projects with this library in 2023.

#Design Tools #UI Design #Data Grid