https://vuuminhphuoc-portfolio.netlify.app/tags/react/ReactHugoBlox Kit (https://hugoblox.com)en-usSat, 15 Feb 2025 00:00:00 +0000https://vuuminhphuoc-portfolio.netlify.app/media/sharing.pnghttps://vuuminhphuoc-portfolio.netlify.app/tags/react/https://vuuminhphuoc-portfolio.netlify.app/projects/page-builder/Sat, 15 Feb 2025 00:00:00 +0000https://vuuminhphuoc-portfolio.netlify.app/projects/page-builder/<p>An admin dashboard with a visual, drag-and-drop page builder that lets non-technical users compose and edit pages without writing code.</p> <h2 id="overview">Overview</h2> <p>Built around Craft.js for the editor engine, the dashboard provides a block-based editing experience with a polished, accessible UI.</p> <h2 id="key-features">Key Features</h2> <ul> <li><strong>Drag-and-drop page builder</strong> powered by Craft.js and dnd-kit</li> <li><strong>Accessible UI</strong> built with Radix UI primitives</li> <li><strong>Data fetching &amp; caching</strong> with TanStack Query</li> <li><strong>State management</strong> with Zustand and form handling via React Hook Form + Zod</li> <li><strong>Charts &amp; analytics</strong> with Recharts</li> </ul> <h2 id="tech-stack">Tech Stack</h2> <ul> <li><strong>Core:</strong> React, TypeScript, Vite</li> <li><strong>Editor:</strong> Craft.js, dnd-kit</li> <li><strong>UI:</strong> Radix UI, Tailwind CSS, Lucide</li> <li><strong>Data/State:</strong> TanStack Query, Zustand, React Hook Form, Zod</li> </ul>