A tiny Bootstrap based data table component with support for sorting, pagination, filtering, and much more.

Basic Usage:

1. Install and import the smart table component.

import "bootstrap/dist/css/bootstrap.min.css";
import "react-next-table/dist/SmartTable.css";
import SmartTable from "react-next-table";

2. Add the smart table component to the app.

export default function Exemple() {
  return <SmartTable title="Emails" data={data} headCells={headCells} />;
}

3. Define your data.

const headCells = [
  {
    id: "email",
    numeric: false,
    label: "Email",
    width: 200,
  },
  // ...
];
const data = [
  {
    _id: "6144145976c7fe",
    email: "[email protected]",
    name: "Mina",
    phone: "+9617099995114",
    subject: "test",
    message: "ahlannn",
    date: "2021-09-17 19:10:50",
  },
  // ...
];

Preview:

Download Details:

Author: a-simplecode

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/a-simplecode/react-next-table

License: MIT