Dashwise - AI Native Dashboard Components
Ship your admin panel in minutes, not weeks.Live demo → dashwise.netlify.appYou know the drill. You have a SaaS, a client project, or an internal tool that needs an admin dashboard. You could spend three weeks building it from scratch — wrestling with table sorting, drag-and-drop Kanban boards, multi-step wizards, auth flows, dark mode, and responsive layouts. Or you could buy Dashwise, drop it into your project, and be live before the week is out.Dashwise is a production-ready admin dashboard kit built on the modern Next.js 16 + React 19 + Tailwind CSS v4 stack. Every page is real, every interaction is polished, every component is the kind of code you'd be proud to ship. This is not a demo. This is the foundation your app has been waiting for.What You Get10 fully built dashboard pages: Dashboard Home — live-updating stats cards, line/bar/area/pie charts, activity feed, top-performers list Data Tables — multi-column sorting, global search, column-level filtering, pagination, bulk row selection, export (TanStack Table) Forms — Create form, multi-step Wizard with progress tracking, Settings form with six tabbed sections (react-hook-form + zod) Charts & Analytics — full suite of Recharts visualizations: line, bar, area, pie, properly responsive Calendar — date picker, event list, add-event modal Kanban Board — drag-and-drop task cards across swimlanes (@dnd-kit) Inbox — split-pane layout: conversation list on the left, message thread on the right User Profile — edit mode toggle, scrollable activity timeline Settings — general, notifications, team, billing, API keys, danger zone — all tabbed and validated Changelog — versioned timeline layout 5 auth pages, each with two layout variants: Login Register (with password strength indicator) Forgot Password Email Verification Two-Factor Authentication (full 6-digit code input) Every auth page ships with both a centered card layout and a split-screen hero layout — toggle between them with a single prop.Theme Customizer: six color presets and four font options, persisted to localStorage. Brand it in under a minute.Production-ready details: Dark mode with system preference detection, smooth transitions Loading skeletons for every page — no layout shift, no blank screens View Transitions (React 19 + Next.js 16) for page-to-page animation Fully responsive: desktop, tablet, mobile tested Cmd+K command palette with keyboard shortcuts Collapsible sidebar with mobile drawer 30+ shadcn/ui component primitives pre-installed and configured Feature HighlightsThe data table alone is worth the price. Building a production-quality table from scratch — with sorting, filtering, pagination, selection, and export — typically takes two to four days. The one in Dashwise is done. Column definitions live in their own file. You add a new column in about 30 seconds.The Kanban board is the real thing. Not a CSS trick with position: absolute. Full @dnd-kit integration with keyboard accessibility, drag handles, smooth animations.Auth flows that don't embarrass you. Most dashboard kits ship one login page and call it auth. Dashwise ships five pages, each with two layout modes. Looks like a real product because it is.The mock data pattern saves you hours. Every data-fetching point is marked with a // TODO: Replace with your API call comment. TypeScript types are already defined. Replace one import — the component stays the same. No spaghetti to untangle.Tech Stack Next.js 16.1 — App Router, Turbopack, Server Components, View Transitions React 19.2 — current stable TypeScript 5+ — strict mode throughout, no any shortcuts Tailwind CSS v4 — oklch color space shadcn/ui — 30+ components, pre-installed Recharts 3.7 — composable, responsive charts TanStack Table 8.21 — headless, type-safe data tables react-hook-form 7 + zod 4 — form state and validation @dnd-kit — accessible drag-and-drop next-themes — dark mode with zero flash Lucide React — consistent icons Runs with npm install && npm run dev. No Docker, no database, no external services.AI-Native: Built for Claude Code and CursorThis is the feature no other dashboard kit ships. Dashwise includes a complete set of CLAUDE.md files throughout the codebase — structured documentation that AI coding assistants (Claude Code, Cursor, GitHub Copilot) read automatically when you open the project. Root CLAUDE.md — project overview, architecture, common tasks, gotchas src/app/CLAUDE.md — routing, how to add pages, Server vs Client component rules src/components/CLAUDE.md — component patterns, what not to touch, how to extend src/lib/CLAUDE.md — data layer, utilities, schema conventions src/hooks/CLAUDE.md — hook patterns and state management You open Dashwise in Claude Code, describe what you want to add, and the AI already understands the codebase. Spend your time on your product, not re-explaining your codebase to your AI.FAQLicense? MIT. Personal projects, client work, SaaS products, internal tools — no royalties, no attribution, no per-seat fees. Only thing you can't do is resell Dashwise itself.Updates? Yes. Purchase once, get all future updates via Gumroad re-download.Support? Email support for setup questions and bugs. Reply within 24h.Requirements? Node.js 20.9+. npm install && npm run dev and you're running.Production-ready or just a demo? Code is clean, typed, follows real architectural patterns. Dashwise is a frontend kit — you connect your own API. Every connection point is labeled with a TODO: Replace comment.Client work? Yes, MIT covers it.The MathA senior frontend developer costs €100–150/hour. Building a dashboard like this from scratch — tables, charts, drag-and-drop Kanban, auth flows, settings, dark mode, responsive layout, keyboard shortcuts — takes a minimum of three weeks. That's €12,000–20,000 of engineering time, conservatively.Dashwise is €45. If it saves you two days of work, it has paid for itself twenty times over.Buy once. Ship forever.
Get it → agileturtles.gumroad.com