Divyansh.
Back to Projects

Merch Factory

A professional-grade print-on-demand platform integrating Wix, MUI v7, and Konva.js.

Next.js
MUI v7
Wix SDK
Konva.js
Firebase

Merch Factory: The Evolution of Print-on-Demand

Merch Factory is a comprehensive e-commerce infrastructure designed to empower creators to launch high-quality merchandise without the overhead of inventory or logistics. This project is a result of multiple iterations, moving from a simple storefront to a complex multi-platform engine.

The Vision: Democratizing Merchandise

In the creator economy, merchandise has traditionally been a privilege of the elite—those who could afford bulk orders and warehousing. Merch Factory was built to level that playing field. Our mission was to provide a "business-in-a-box" for creators of all sizes.

By leveraging print-on-demand (POD) technology, we allow creators to upload their artwork, design products in real-time, and sync them directly to their own stores. When a customer buys a shirt, we handle the printing, quality control, and shipping automatically. This is what it means to build better products for the next-gen web.

Technical Architecture (v3.0)

For the latest iteration, we migrated to a high-performance stack that prioritizes operational depth and developer experience. This was a direct result of lessons learned from shipping previous iterations.

1. Frontend Framework: Next.js 15

We chose Next.js 15 for its superior handling of server-side rendering (SSR) and Incremental Static Regeneration (ISR). This is critical for our storefronts, where SEO and page load speed directly impact conversion rates. Using the App Router allowed us to build complex, nested layouts for the merchant dashboard while maintaining clean, maintainable logic. Our blog post on Next.js performance goes deeper into these choices.

2. UI Architecture: MUI v7 (Material UI)

Unlike our earlier prototypes that relied on custom CSS or utility-first frameworks, Merch Factory 3.0 is built on MUI v7. We needed a mature, enterprise-grade component library that could handle dense data views and complex merchant tools:

  • @mui/x-data-grid: Used for managing thousands of orders and product records with filtering, sorting, and pagination.
  • MUI System: Provides a robust theme-driven approach to styling, ensuring consistency across the dashboard and the designer tools.
  • Emotion: The underlying styling engine allowed us to build highly dynamic interfaces that respond to merchant actions and store states. This setup provides the operational depth we needed for scale.

3. High-Performance Canvas: Konva.js

The crown jewel of Merch Factory is the Product Designer. This is where technical complexity matches user experience. We used Konva.js to build a high-fidelity 2D canvas editor:

  • Real-time Manipulation: Merchants can drag, resize, rotate, and layer designs with zero lag.
  • Print-File Generation: The engine can export high-resolution assets (up to 300 DPI) directly from the canvas state, ready for the printing machines.
  • Interactive Layers: A robust layering system that mimics professional design software like Photoshop, built entirely on top of React-Konva.

Learn more about why I chose this over basic DOM manipulation in my deep dive on Konva.js.

4. Integration Hub: Wix SDK

A key differentiator for Merch Factory is our deep integration with existing e-commerce platforms. We utilized the Wix SDK to provide bi-directional syncing:

  • Wix Stores: Syncing products, inventory, and variants directly to a merchant's Wix store.
  • Order Webhooks: Every order on a connected Wix store is automatically sucked into the Merch Factory backend for processing.
  • Wix E-commerce REST API: For advanced operations like custom pricing and channel-specific discounts.

Cloud Infrastructure & Logic

The system is powered by a serverless architecture designed for horizontal scalability, as detailed in my inside merch-factory technical case study.

Firebase Backend

We use Firebase as our primary infrastructure provider:

  • Firestore: A flexible, NoSQL database for managing real-time store configurations and order tracking.
  • Cloud Functions: The operational glue of Merch Factory. From triggering print files to sending tracking notifications via WhatsApp/Email, every piece of business logic lives here.
  • Firebase Auth: Secure, managed identity for all our merchants and internal operators.

Payments & Invoicing

For the Indian market, complexity is the default. We integrated Razorpay to handle seamless payments, automatic GST invoicing, and secure payouts. This allows us to handle the full lifecycle of a transaction within the platform, including the complicated GST scenarios typical in India.

Operational Logic: The Fulfillment Engine

Most people see the designer, but the real work happens after the order is placed. Our system manages:

  • Automated Pre-Press: Validating image quality, transparency, and centering before it hits the print queue.
  • Multi-Vendor Routing: Intelligently routing orders to different fulfillment centers across India (Delhi, Bangalore, Tiruppur) based on proximity and capacity. This is critical for our Indian POD market strategy.
  • Real-time Tracking: A unified tracking interface that pulls status updates from multiple courier partners (Delhivery, Blue Dart, Ecom Express).

Future Roadmap & Expansion

We aren't stopping at T-shirts. The Merch Factory engine is built to support any customizable product. In the coming months, we are expanding into:

  • Phone Cases & Accessories: Utilizing the same Konva.js infrastructure for 3D product mapping.
  • AI Design Assistants: Helping creators generate high-quality art directly within the designer tool.
  • Shopify & WooCommerce Apps: Bringing the power of the Merch Factory fulfillment engine to the world's largest e-commerce platforms.

Final Thoughts

Merch Factory is more than just a website; it is an e-commerce operating system. It represents my belief that the next-gen web needs better products, not just more code. By focusing on deep technical excellence and a user-first philosophy, we've built a platform that creators can rely on to scale their businesses.

If you want to see the platform in action, visit merchfactory.in or read my technical guide for creators in India to understand how to leverage this infrastructure for your own brand.

Building Merch Factory has been the defining technical challenge of my career, and the lessons learned here have informed every other project in my portfolio platform.


Project byDivyansh