Data Table with TailwindCSS & AlpineJS

A dynamic and reusable datatable component built with Alpine.js and Tailwind CSS. All the data is fetched from a local JSON file and the table is generated dynamically.

This project is a modified and enhanced version of the original CodePen by @mithicher.

Features

• Dynamic Data Loading: User data is loaded from a users.json file.
• Dynamic Table Generation: The table headers and rows are generated dynamically based on the data.
• Search and Filtering: Real-time search functionality to filter users.
• Column Visibility: Toggle the visibility of table columns.
• Row Selection: Select and deselect single or multiple rows.
• Responsive Design: The table is designed to be responsive and works on different screen sizes.

Technologies Used

• Alpine.js
• Tailwind CSS

How to Use

1. Clone the repository.
2. Open index.html in your browser.
3. The user data can be modified in the users.json file.