ShowData · Algorithm Instrument
Next.js 16.2.6 (App Router) · React 19.2.4 · TypeScript 5 · Tailwind CSS v4 · Zustand 5
ShowData is a fully client-side Next.js single-page app that visualizes algorithms — sorting, pathfinding, and trees. All algorithm compute and state live in the browser; no network backend is contacted at runtime.
Generated 4 Jun 2026 · 63 files · 12 components · 5 flows
File Architecture
The full source tree as a layered graph — every file with its role, imports, exports and reverse dependencies.
System Design
Runtime topology across the five zones — client, edge, application, data and external services.
Flow Graph
The five most significant application flows, step by step — startup, auth, write, read and error recovery.
Technology
| Component | Technology | Version | Source of Detection |
|---|---|---|---|
| Framework | Next.js (App Router) | 16.2.6 | package.json |
| UI library | React / React DOM | 19.2.4 | package.json |
| Language | TypeScript | ^5 | package.json, tsconfig.json |
| Styling | Tailwind CSS + tw-animate-css | ^4 / ^1.4.0 | package.json, globals.css |
| UI primitives | shadcn / @base-ui/react / CVA | ^4.7.0 / ^1.4.1 / ^0.7.1 | package.json, components.json |
| Client state | Zustand (persist + devtools) | ^5.0.13 | entities/algorithm/store.ts |
| Animation | Framer Motion | ^12.38.0 | page.tsx, SortingVisualizer.tsx |
| Icons | lucide-react | ^1.14.0 | page.tsx, GlobalHUD.tsx |
| Forms / schema | react-hook-form / @hookform/resolvers / zod | ^7.75.0 / ^5.2.2 / ^4.4.3 | package.json (no source usage found) |
| Date utility | date-fns | ^4.1.0 | package.json (no source usage found) |
| Server state lib | @tanstack/react-query (+ devtools) | ^5.100.10 | package.json (declared, unused in src) |
| Backend SDK | pocketbase | ^0.26.9 | package.json (declared, unused in src) |
| Audio | Web Audio API (browser) | *[unresolved]* | entities/algorithm/sound.ts |
| Lint | ESLint + eslint-config-next | ^9 / 16.2.6 | eslint.config.mjs, package.json |
| Test script | tsx (verify-sorts) | *[unresolved]* | scripts/verify-sorts.mts, package.json |
| Deploy target | Vercel (SPA rewrite to /) | n/a | vercel.json |