Product · SaaS//2026

VINTAR

Creator commerce & D2C multi-tenant platform, simplified.

Engineering Role
Lead Product Designer & Full-Stack Developer
Delivery Timeline
5 months (Jan 2026 - May 2026)
Architectural Stack
Next.js 15, TypeScript, PostgreSQL
Release Status
ACTIVE IN PROD
Inspect Live System ↗
Vintar Commerce Gateway · Multi-Tenant Subdomain Mesh
100% HEALTHY · EDGE ROUTER ACTIVE
P99 LATENCY
<1.2s
THROUGHPUT
100% QRIS Sync
ACTIVE DAG NODES
12
ALLOC BUFFER POOL
0 bytes/op
DAG Pipeline Execution Mesh (Real-time Wire State):
Edge Subdomain Rewrite0.4ms · COMPLETED
PostgreSQL Multi-Tenant RLS1.8ms · COMPLETED
Midtrans QRIS Snap Ingestion24ms · ACTIVE
Idempotent Webhook Hash Verify0.8ms · PENDING
Automated WhatsApp Order Ping140ms · PENDING
[09:14:02.112] [INFO] [edge-middleware] Subdomain route matched: merchant-urbanstore.vintar.id
[09:14:02.145] [TRACE] [postgres-rls] RLS scope tenant_id=c829f01 validated in 1.8ms
[09:14:02.320] [PAYMENT] [midtrans-webhook] QRIS payload signature verified (SHA512 match)
[09:14:02.380] [OK] Order #VN-8849 settled · WhatsApp receipt dispatched via messaging gateway

The System Bottleneck & Problem Statement

Creators and independent sellers in Indonesia are heavily trapped by marketplace fee structures deducting up to 15-20% per transaction, while their storefront tools are disjointed across link-in-bio apps, manual WhatsApp chats, and spreadsheet reconciliation.

Architected Solution & Execution Mechanics

Built an integrated D2C commerce platform where merchants get custom subdomains, zero-friction mobile checkouts, automatic QRIS and Virtual Account settlement via Midtrans, and automated WhatsApp order notifications without exorbitant marketplace cut fees.

INTERACTIVE ARCHITECTURE FLOW (CLICK NODE TO INSPECT SPEC):
Next.js App Router

Customer Browser

SSR & ISR storefront rendering with ultra-low latency mobile layout.

Core Architecture Implementation

Production-grade architecture implementation powering VINTAR:

middleware.ts
import { NextRequest, NextResponse } from 'next/server';

export const config = {
  matcher: ['/((?!api/|_next/|_static/|_vercel|[\\w-]+\\.\\w+).*)'],
};

// Edge Subdomain Multi-Tenancy Router
export default async function middleware(req: NextRequest) {
  const url = req.nextUrl;
  const hostname = req.headers.get('host') || 'vintar.id';

  // Extract merchant subdomain from incoming hostname
  const rootDomain = process.env.NEXT_PUBLIC_ROOT_DOMAIN || 'vintar.id';
  const currentHost = hostname.replace('.' + rootDomain, '');
  
  // Pass through if request is made on apex domain or local root
  if (currentHost === 'vintar' || currentHost === 'www' || currentHost === 'localhost:3000') {
    return NextResponse.next();
  }

  // Rewrite request internally to isolated tenant storefront directory
  url.pathname = '/store/' + currentHost + url.pathname;
  const response = NextResponse.rewrite(url);
  response.headers.set('x-tenant-slug', currentHost);
  return response;
}

Key Engineering Responsibilities

[01]

Architected end-to-end multi-tenant routing using Next.js App Router middleware rewrites.

[02]

Designed an editorial, high-contrast design system inspired by Stripe & Toss with CSS tokens.

[03]

Built dynamic checkout supporting Midtrans QRIS and Virtual Account webhooks.

[04]

Engineered an AI Co-pilot interface for merchant product generation and catalog management.

[05]

Authored automated test suites in Vitest and Playwright to guarantee checkout zero-downtime.

Non-Trivial Trade-Offs & Decisions

CASE // 01

Handling Variable Payment Fees Without Confusing Customers

System Friction: Payment gateways impose flat fees on Virtual Accounts (~Rp 4,000) and percentage fees on QRIS (0.7%). Passing these naively to checkout created sudden price jumps and customer drop-offs.

Architectural Decision: Implemented a dynamic transparent breakdown modal that displays the exact gateway fee before payment selection, while recommending QRIS as the zero-admin option for small transactions.

Measured Outcome: Checkout drop-off dropped significantly during usability testing, with 85% of users opting for QRIS.

Quantified Production Telemetry

2nd Place
Community Hackathon
<1.2s
Checkout Flow Time
100%
Automated QRIS Sync
Zero
Marketplace Lock-in
SUBSEQUENT CASE STUDY
HUBZ

An automated platform orchestrating AI business intelligence, automated bespoke web generation, instant deployment API, and WhatsApp CRM pipelines.

Next Case Study →