Why Are You Still Using AI to Generate Table Code? 😤

#ai #typescript #react #opensource

Every time I asked ChatGPT to create a data table, I got the same 200+ lines of code.

Filtering. Sorting. Pagination. Search. Export. Column visibility. Date pickers.

New project? Same prompt. Same code. Same debugging.

I realized something: I was paying tokens for work that never changes.

That's not what AI is for. AI is for creative problems. Repetitive boilerplate should be abstracted away.

So I built TableCraft.

What is TableCraft?

A Drizzle ORM-powered table engine that auto-generates everything from your database schema.

Backend Setup (Hono)

import { Hono } from 'hono'
import { createHonoApp } from '@tablecraft/adapter-hono'
import { defineTable } from '@tablecraft/engine'
import { db } from './db'
import * as schema from './db/schema'

const users = defineTable(schema.users)
  .hide('password')
  .search('email', 'name')
  .sort('-createdAt')

const app = createHonoApp({
  db,
  schema,
  configs: { users },
})

new Hono().route('/api/engine', app)

Frontend Setup (React)

import { DataTable, createTableCraftAdapter } from '@tablecraft/table'

const adapter = createTableCraftAdapter({
  baseUrl: '/api/engine',
  table: 'users',
})

export function UsersPage() {
  return <DataTable adapter={adapter} />
}

That's it. One component. No column definitions.

What You Get

✅ Auto-generated columns from schema
✅ Server-side filtering, sorting, pagination
✅ Global search
✅ Date range picker
✅ CSV/Excel export
✅ Column visibility & resizing
✅ URL state sync (shareable links)
✅ Role-based access control
✅ Soft delete support
✅ TypeScript type generation

Available Packages

Package	Description
`@tablecraft/engine`	Backend query engine
`@tablecraft/table`	React data table component
`@tablecraft/adapter-hono`	Hono adapter
`@tablecraft/adapter-express`	Express adapter
`@tablecraft/adapter-next`	Next.js adapter
`@tablecraft/adapter-elysia`	Elysia (Bun) adapter