Seller Dashboard & Web App for a D2C Commerce Platform
A D2C retail storefront
Overview
The seller-facing web application for a direct-to-consumer commerce platform, the richer, dashboard-style counterpart to the consumer storefront. It gives sellers tools to manage their catalog, profile, and storefront, backed by Firestore, Algolia search, and Shopify commerce.
The Challenge
Beyond the shopper experience, the platform needed a full-featured seller/admin surface: onboarding flows, catalog and media management, search-driven browsing, analytics, and a guided first-run tour, all in a responsive, real-time web app.
What We Built
A React app (CRACO-configured) with screens, components, utils, a Shopify data layer
(shopify.js), and ice/store + Redux state. It is materially deeper than the storefront: Mantine
UI components, drag-and-drop ordering (@dnd-kit), forms via react-hook-form, Algolia
(algoliasearch, instantsearch.js, react-instantsearch-hooks-web) for instant catalog search,
React Query + @react-query-firebase/firestore for data, charts via recharts, image editing
(react-avatar-editor, react-dropzone), a guided onboarding tour (@reactour), HLS video
playback, phone/code verification inputs, and marketing/analytics hooks (Facebook Pixel, Hotjar,
Helmet). Error monitoring runs through Sentry.
Technologies & Approach
React with Mantine and Tailwind for a dense, data-rich seller UI; Algolia InstantSearch for fast catalog discovery; React Query over Firestore for cached real-time data; Shopify for the underlying commerce primitives; Sentry for production observability. The breadth of libraries reflects a genuine multi-feature SaaS dashboard rather than a brochure site.
Outcome / Impact
Delivered a comprehensive seller web app that pairs with the consumer storefront to form a two-sided D2C commerce platform, demonstrating substantial front-end product engineering.
Capabilities Demonstrated
- Feature-rich seller/admin dashboard in React + Mantine
- Instant search and catalog management with Algolia InstantSearch
- Real-time cached data via React Query over Firestore
- Drag-and-drop, media editing, guided onboarding, and rich forms
- Production observability and marketing instrumentation (Sentry, FB Pixel, Hotjar)