A simple but flexible React data table. Working table in 10 lines. Sorting, selection, pagination, expandable rows, and theming are opt-in props. No atomic HTML table knowledge required.

react-data-table-component sits between "render everything yourself" headless toolkits and full "configure-the-grid" frameworks. It's for cases where the table is a means, not the product: admin panels, dashboards, internal tools, MVPs. If you need an Excel clone or a 100k-row analytics grid, there are better-suited libraries for that.

import DataTable from 'react-data-table-component';

const columns = [
  { name: 'Title', selector: row => row.title, sortable: true },
  { name: 'Year', selector: row => row.year, sortable: true },
  { name: 'Director', selector: row => row.director },
];

export default function Movies() {
  return <DataTable columns={columns} data={data} pagination />;
}

• Sorting, row selection, expandable rows, and pagination (all opt-in props)
• Themeable via CSS variables; deeply customizable via customStyles
• Accessible (role, aria-sort, aria-selected, keyboard navigation)
• Responsive (x-scroll / flex)
• TypeScript types bundled
• SSR-safe; ships "use client" for Next.js App Router (import directly into a Server Component file)
• Headless hooks exported for full markup/style control when you outgrow the defaults

The documentation contains information about installation, usage and contributions.

reactdatatable.com

React Data Table Component has been actively maintained since 2018 and is downloaded times a week. If your team ships products with it, your support keeps it maintained, bug-free, and moving forward.

Sponsoring puts your company logo in front of the developers who use it every week: in the README, the docs site, and every release. It's the right move if your team depends on this library and you want it to keep improving.

These are honest, written commitments from a solo maintainer: async and business hours. No fake 24/7 SLA.

Need commercial support, an SLA, or help with a major version upgrade? I offer direct consulting and priority support arrangements for teams that depend on react-data-table-component in production. Reach out via the support page.

Open a GitHub issue. Priority support is available for teams that sponsor the project.

Become a Gold Sponsor and your logo goes here.

Thank you to our recurring backers:

• Rich Tillman
• Simon Schick