Skip to content
WebE-Commerce / D2C Retail

Arkmantra — Ayurvedic Cosmetics E-Commerce

Full-stack D2C storefront & admin panel for premium Panchgavya-based natural Ayurvedic cosmetics

Sell online out of the box — a complete D2C storefront with cart, coupons, GST, and an admin to run it all.

arkmantra.com
Arkmantra — Ayurvedic Cosmetics E-Commerce preview

A look inside

arkmantra.com
Arkmantra — Ayurvedic Cosmetics E-Commerce — Shop — search, filters & coupons
Shop — search, filters & coupons
arkmantra.com
Arkmantra — Ayurvedic Cosmetics E-Commerce — Brand story
Brand story

An end-to-end D2C beauty commerce platform built with React 19, TypeScript, and Supabase. Customers browse a searchable, filterable, paginated catalog; read and submit verified-purchase reviews; manage a cart and wishlist; and check out through a Razorpay-style payment flow with coupon validation, GST, and shipping rules. A full admin panel offers CRUD over products, categories, coupons, and banners, plus order lifecycle management, customer insights, review moderation, a contact-message inbox, configurable site settings, and analytics charts. A signature engineering feature is a clean data-layer abstraction (lib/api) that transparently switches between a live Supabase backend and a bundled offline catalog — so the entire app, admin included, runs with or without any backend.

Features built in

Storefront

  • Home with hero banners, featured products, USP/trust band & testimonials
  • Shop with full-text search, category/price filters, sorting & pagination
  • Product detail pages: image gallery, key ingredients, benefits, how-to-use & reviews
  • Wishlist (local for guests, synced for users) and a debounced global search
  • Editorial content: Rituals, Ingredients library, Journal/Blog, Founder's Letter & a skin quiz

Cart & Checkout

  • Zustand cart with quantity controls and stock awareness
  • Coupon application with client-side validation mirroring server rules
  • Live order totals (subtotal, discount, GST, shipping) with a free-shipping progress bar
  • Checkout with address capture, mocked Razorpay payment modal & order confirmation
  • Order numbers in ARK-YYYY-XXXXX format

Accounts & Auth

  • Email/password sign-up, sign-in, password reset & Google OAuth (PKCE)
  • Session persistence with auto-refresh and role-based access control
  • Account dashboard with stats, profile management & avatar upload
  • Saved addresses (CRUD with default), order history & order detail views
  • Verified-purchase review submission

Admin Panel

  • Full CRUD over products, categories, coupons & banners with image upload
  • Order lifecycle management (status & payment) and per-customer order history
  • Review moderation (approve/reject/delete) and a contact-message inbox
  • Analytics: revenue, top products, category breakdown & order-status charts (Recharts)
  • Runtime site settings for shipping, GST, social & config overrides

Architecture & Demo Mode

  • Domain-oriented data layer (lib/api) abstracting Supabase vs bundled demo data
  • Offline mode: storefront renders from a bundled catalog, cart/orders persist to localStorage
  • Bundled catalog uses fixed UUIDs identical to seed.sql so demo and live render identically
  • Single source of truth for pricing — coupon, GST & shipping logic shared by UI and order placement
  • Supabase RLS (46 policies) plus role-gated routes and Postgres has_role/is_admin functions
React 19TypeScriptVite 8React Router v7 (lazy routes)Tailwind CSS v4 + Radix UITanStack Query v5Zustand (persist)React Hook Form + ZodSupabase (Postgres, Auth, Storage, RLS)Framer Motion + LenisRecharts (analytics)Deployed on Vercel
  • A D2C beauty or wellness brand needing a complete storefront plus admin in one codebase
  • Any retailer wanting cart, coupons, GST, shipping rules & order management out of the box
  • A team that needs to demo the full app — including admin — without standing up a backend
  • A business requiring secure, role-gated admin with RLS-enforced data access

From idea to live in 4 steps

Enquiry

Tell me what you want to build using the form below — platform, features, budget, and timeline.

Quote & Scope

Within 24 hours you get a fixed quote, a clear scope, and a delivery plan — no surprises.

Design & Build

I design and build in weekly milestones with live previews so you watch it come together.

Deploy & Support

I ship it live — web, App Store, Play Store — and stick around for support and iteration.

Common questions

Can it run without a backend?

Yes — when Supabase env vars are absent the app runs fully offline from a bundled catalog (same UUIDs as the SQL seed), with cart and orders persisting to localStorage and a demo-auth shim that grants admin access as admin@arkmantra.com.

Does it include a real admin panel?

It includes a complete admin: CRUD over products, categories, coupons, and banners, order lifecycle management, customer insights, review moderation, a message inbox, analytics charts, and runtime site settings.

How are pricing, coupons, and tax handled?

There's a single source of truth for pricing — coupon validation, 18% GST on taxable value, and shipping rules (free over ₹499, else ₹49) are shared by the UI and order placement so totals always match.

Is it secure?

Supabase Row Level Security enforces 46 policies distinguishing guest, customer, and admin access, backed by Postgres has_role/is_admin functions and role-gated ProtectedRoute / AdminRoute guards.

What payment flow does it use?

A Razorpay-style payment modal that places the order on success. It's wired as a mock by default and can be connected to a live Razorpay account during the build.

Can I rebrand it for a different catalog?

Yes — products, categories, and content live in typed data with selector helpers and a Supabase schema, so swapping in your own catalog, branding, and copy is configuration, not a rewrite.