Shadcn Table
This is a Shadcn table component with server-side sorting, filtering, and pagination. It is bootstrapped with create-t3-app
.
Tech Stack
- Framework: Next.js
- Styling: Tailwind CSS
- UI Components: shadcn/ui
- Table package: TanStack/react-table
- Database: PlanetScale
- ORM: Drizzle ORM
Features
- Server-side pagination
- Server-side sorting
- Server-side filtering
- Dynamic debounced search based on the searchable columns provided
- Dynamic faceted-filtering based on the filterable columns provided
Running Locally
-
Clone the repository
git clone https://github.com/sadmann7/shadcn-table-v2.git
-
Install dependencies using pnpm
pnpm install
-
Copy the
.env.example
to.env
and update the variables.cp .env.example .env
-
Start the development server
pnpm run dev
-
Push the database schema
pnpm run db:push
Codebase Overview
Watch the codebase overview video on YouTube.
Consider subscribing to Kavin's YouTube channel for more videos.
How do I deploy this?
Follow the deployment guides for Vercel, Netlify and Docker for more information.