An ecommerce admin dashboard built with Nuxt 4, UI Thing, Tailwind CSS v4 and TypeScript. The UI and a typed mock API live in one repo and run on generated data, so there is nothing to set up.
Try the live demo: on the sign-in page, click Fill demo credentials to enter as an admin.
Coming from the YouTube tutorial? The app from the July 2023 video is still here: open the original version (the
tutorial-2023branch). This repository is a ground-up rebuild of it.
- A real product surface: dashboard and analytics, customers, orders, products and staff with search, filters, CSV export and bulk actions, a team page with invitations, billing, settings and help. See all features
- Roles that are enforced: admin, manager and support see different pages and can do different things, in the navigation, the route guards and the API (401 and 403). Roles
- Full-stack in one repo: forms and API share the same zod schemas, and a mock REST API serves seeded data from memory. Architecture · API
- Built to be maintained: strict TypeScript, almost 400 unit, API and browser tests, GitHub Actions CI, lint and format hooks, conventional commits. Testing
- Polished details: a command palette (
Ctrl/Cmd + K), a notification bell, light and dark mode, loading, empty and error states, and layouts that work down to a phone.
A demo, not a product. Sign-in is simulated, nothing is charged and no email is sent. Data lives in server memory and resets when the server restarts.
bun install
bun run devOpen http://localhost:3000 and click Fill demo credentials (demo@analytics.test, an admin). To see what the other roles can do, sign in with any team member's email from the Staff list (any password of 8 or more characters). More in Roles.
| Script | What it does |
|---|---|
bun run dev |
Start the dev server |
bun run build |
Build for production |
bun run test |
Unit, API and browser tests (details) |
bun run lint |
Lint with oxlint (format:check and typecheck too) |
| Variable | Default | What it does |
|---|---|---|
NUXT_PUBLIC_IDLE_TIMEOUT_MS |
300000 (5 min) |
Default inactivity time before a user is signed out. Each browser can change it in Settings |
| Dark mode | Bulk actions |
|---|---|
 |
 |
| Analytics | Command palette |
 |
 |
| Team and invitations | Billing |
 |
 |
Features · Roles · Architecture · Mock API · Testing and CI · Contributing · Original tutorial version