Enterprise Fashion Tech & ERP Suite

EMPI Costumes

An enterprise-grade costume hire, equipment rental, and back-office ERP platform. Engineered with a unified 3-way order engine (sales, rentals, custom commissions), caution fee deposit hold lifecycle, Socket.IO Mail Room support desk, logistics fleet dispatch, and an automated VAT & payroll suite.

Visit live site↗
Category
Full-Stack E-Commerce & Back-Office ERP
Status
Live
Core stack
Next.js 16, React 19.2, MongoDB 7.0, Socket.IO 4.8.2
Live at
empicostumes.com
empicostumes.com
EMPI Costumes — Atelier homepage
3-in-1 Engine
Order Versatility

Single schema unifying retail sales, rentals, and custom commissions

100% Automated
Deposit Tracking

Caution fee hold & return refund workflow via CautionFeeTransaction

6 Tiers
ERP Access Tiers

Super Admin, Admin, Sub-Admin, Finance, Logistics, and Mail Room

01The challenge

High-end costume ateliers handle three distinct commercial operations: retail sales, date-range rentals with security deposits, and bespoke tailoring requests. Managing these flows alongside statutory VAT filings, staff payroll, and fleet driver dispatch via disconnected tools leads to inventory double-booking and financial revenue leakage.

02The approach

EMPI Costumes unifies all commercial and back-office operations into a single platform powered by Next.js 16, React 19, and MongoDB. A single UnifiedOrder schema drives sales, rentals, and custom commissions; CautionFeeTransaction automates deposit holds and refunds; Socket.IO powers real-time admin ticketing; and a 6-tier RBAC system secures financial ledgers, VAT statutory records, and payroll runs.

03What I built

The pieces that make it work.

01Unified Commerce

3-Way Unified Order Schema (UnifiedOrder)

Single source of truth powering retail sales, date-range costume rentals with calendar reservation locks, and custom commission requests with reference uploads.

02Security Deposit Hold

Caution Fee & Security Deposit Hold Lifecycle

Automated calculation, deposit hold tracking, and return refund workflow for costume rentals (CautionFeeTransaction), preventing financial revenue leakage.

03Enterprise ERP

Back-Office ERP Suite (VAT, Payroll & Ledger)

Integrated financial suite with real-time daily operational expense ledgers, statutory VAT liability tracking (VATHistory), and employee payroll run execution (PayrollRun & PayrollStaff).

04Real-Time Communications

Real-Time Socket.IO Mail Room Support Desk

WebSocket-powered administrative ticketing system with instant message dispatching and browser push notifications for admin staff and client queries.

05Fleet Logistics

Logistics Fleet Dispatch & QR Confirmation

Driver assignment, route scheduling via Google Maps API integration, and link/QR-based delivery confirmation portal (/confirm-delivery).

06Fintech & Invoicing

Multi-Gateway Checkout & Dynamic PDF Invoices

Supports Flutterwave, Stripe, and Direct Bank Transfer payments, paired with dynamic vector PDF invoice generation and Resend email receipt delivery.

04Inside the product

Real screens, in production.

empicostumes.com
Atelier homepage
Atelier homepageThe customer-facing rental and costume storefront.
empicostumes.com
Costume catalogue
Costume catalogueProduct discovery and costume browsing.
Mobile storefront
Mobile storefrontThe shopping experience on a small screen.
Mobile product view
Mobile product viewCostume details and actions on mobile.
Mobile booking flow
Mobile booking flowA focused rental and checkout journey.
empicostumes.com
Studio operations
Studio operationsThe working interface used to manage customer activity.
05Architecture

How it's put together.

  1. Frontend Storefront & ERP Portal

    Next.js 16 App Router & React 19.2

    React Server Components with Turbopack, Tailwind CSS v4 atelier styling, Framer Motion modal micro-interactions, and Lenis 1.3 smooth scrolling.

    • Next.js 16
    • React 19.2
    • TypeScript
    • Tailwind CSS v4
    • Lenis Scroll
    • Framer Motion

  2. Real-Time & Communications

    Socket.IO 4.8.2 & Resend Transactional Email

    WebSockets for live Mail Room support tickets and real-time dispatch alerts, coupled with Resend API using Handlebars HTML email templates.

    • Socket.IO 4.8.2
    • Resend API
    • Handlebars
    • Web Push API

  3. Database & Security ERP

    MongoDB 7.0 & Mongoose 8.20 Document Schemas

    NoSQL document database managing 9 core operational models (UnifiedOrder, Product, CautionFeeTransaction, CustomOrder, Invoice, DailyExpense, VATHistory, PayrollRun, MailRoomTicket).

    • MongoDB 7.0
    • Mongoose 8.20
    • NextAuth.js v4
    • Bcryptjs

  4. Logistics & Asset Infrastructure

    Google Maps & Cloudinary Media CDN

    Google Maps API integration for delivery address autocomplete and dispatch mapping, with Cloudinary CDN for asset transformations.

    • Google Maps API
    • Cloudinary CDN
    • html2pdf.js
    • Zustand
    • React Query v5
06Stack decisions

Every tool earns its place.

Next.js 16
Framework
Storefront & Back-Office ERP Engine
Delivers rapid Server Component rendering for luxury catalogues and secure SSR for admin ERP routes.
React 19.2
UI Library
Concurrent UI Rendering Architecture
Provides smooth UI updates for date-range calendar pickers and complex financial forms.
MongoDB 7.0
Database
NoSQL Document Store & Mongoose Schemas
Flexible document model powering 9 core operational models including UnifiedOrder and CautionFeeTransaction.
Socket.IO 4.8.2
Real-time
Mail Room Support Desk WebSockets
Instant full-duplex socket channel for admin ticketing, live messaging, and dispatch alerts.
Tailwind CSS v4
UI Library
Utility Styling & Atelier Aesthetics
Modern dark/light luxury atelier theme with custom CSS variables.
Framer Motion
Animation
Modal Motion & Micro-Interactions
Fluid component animations and smooth page transitions.
Lenis
Animation
Inertial Smooth Scrolling
High-end smooth scroll experience for fashion showcase galleries.
Flutterwave & Stripe
Payments
Multi-Gateway Checkout Processing
Supports online card payments, bank transfers, and automated payment notification callbacks.
Cloudinary
Media Storage
Asset CDN & Image Transformation
Optimizes costume media uploads, showcase galleries, and inspiration photo attachments.
Resend
Email
Transactional Email Dispatch
Delivers dynamic Handlebars HTML invoice receipts and order updates.
Google Maps API
Logistics
Delivery Mapping & Geocoding
Verifies delivery addresses and visualizes fleet driver dispatch routes.
07Engineering notes

Decisions worth writing down.

01

Unified commercial schema

UnifiedOrder maps retail sales, rental date reservations, and custom commission briefs to simplify admin operational queues.

02

Caution fee security lifecycle

CautionFeeTransaction automates rental deposit holds and refund workflows to eliminate financial leakage.

03

Complete Back-Office ERP suite

Built-in daily expense ledgers, statutory VAT tracking, staff payroll runs, and Socket.IO Mail Room keep studio operations under one roof.

Building something like EMPI Costumes?

Start a project→

Next case study

NextGen Kiddies→

E-Commerce · Retail Operating System