Web Application · Case study
Nutrifriz Admin Portal
Designed and built a complete administrative dashboard for Nutrifriz, giving staff full control over products, categories, collections, custom mixes, orders, customers, journal content, reviews, B2B leads, Crunch Cards, and business analytics — all connected to the Nutrifriz backend through admin-scoped endpoints.
- Role
- Full Stack Developer
- Timeline
- 8 weeks
- Team
- Solo developer
- Year
- 2026

The process
Problems we hit, and how we solved them
Challenge
Building a dense administrative interface that stays fast — dozens of tables, forms, and modals, all with live state and real-time updates
Solution
Built the admin as a completely separate Next.js app from the storefront, consuming only admin-scoped endpoints — no shared state between customer and staff surfaces
Challenge
Making product, collection, and journal editing feel effortless while keeping the underlying data model correct — especially for arrays (pack sizes, images, related products) that are easy to corrupt in a form
Solution
Used Zustand for local state (auth, filters, notifications) and TanStack Query for server state, so tables, forms, and modals stay fast even with large datasets
Challenge
Supporting manual order creation for phone calls, walk-ins, and offline sales without breaking the online flow or double-counting stock
Solution
Created a shared ImageUploader component used everywhere — multi-file drag and drop, primary image selection, reordering, delete, progress, and error handling in one place
Challenge
Adding bulk operations — batch image uploads, CSV import for products and customers, CSV export for reports — that handle errors, validation, and partial failures gracefully
Solution
Built bulk product and customer CSV importers with template download, per-row validation, duplicate handling, category auto-creation, and a detailed error report so admins know exactly what went wrong
Challenge
—
Solution
Implemented manual order creation with a product/collection picker, quantity controls, automatic stock deduction, and support for cash, POS, bank transfer, and offline payment methods
Challenge
—
Solution
Added a full tip-tap rich text editor for the journal with headings, lists, links, images, code blocks, and alignment — content renders cleanly on the storefront via server-side HTML
Challenge
—
Solution
Built analytics with custom date range presets (7d, 30d, 90d, YTD, all-time) and CSV export so the business can pivot on real numbers anytime
Outcome
The results
Delivered a full-featured admin portal covering the entire Nutrifriz operation — no external tools needed for catalogue, orders, content, or analytics
Reduced the time to manage a product, category, or journal post from minutes to seconds via inline dialogs and reusable forms
Enabled the team to process orders, manage content, and respond to B2B leads in a single unified interface with consistent design language
Provided real operational visibility — revenue, orders, top products, low stock, and pending reviews all surface on the dashboard within seconds
Stack
Built with
#Next.js #TypeScript #Tailwind CSS #Shadcn UI #Zustand #React Query
Visuals
Screens & details








Have a project in mind?
Let's build something with the same care and attention to detail.
Next project
Nutrifriz Web Application