Interactive Architecture & Dashboard Tour

Experience how Diverge orchestrates delta deployments, header/cookie routing, database schema isolation, serverless scale-to-zero hibernation, autonomous AgentTask Macaroon sandboxes, and diverge doctor diagnostics right in your browser—before installing a single CRD.

Want to run this exact stack on a real cluster?

Every step in this interactive tour mirrors the Full-Stack Demo Monorepo (examples/fullstack-demo/), which you can spin up locally in one command (./examples/fullstack-demo/scripts/run-demo.sh) on kind or k3d.

---

Interactive 6-Step Sandbox Walkthrough

Use the step buttons below (or press ← / → when focused inside the tour) to step through the lifecycle of PR #42 (feat/instant-payouts) on a 3-service e-commerce stack (storefront-web, checkout-api, fulfillment-worker).

Diverge Control Plane Simulator Namespace: demo-staging · 3 Baseline Pods · 0 Preview Pods

← Prev Step 1 of 6 Next Step →

1 Baseline Cluster 2 Open PR #42 (Delta) 3 Cookie & L7 Routing 4 Scale-to-Zero Splash 5 AgentTask & Macaroon 6 Doctor & Teardown

Step 1 · Shared Baseline Stack (0 Open PRs)

Your Staging Cluster Before Any Pull Requests Open

Three microservices run in demo-staging alongside shared PostgreSQL, Kafka, and Flipt feature flags. All traffic flows through diverge-proxy to baseline v1.4.0 pods.

Send Live Request (GET /api/checkout)

<div class="dv-topo-grid">
  <div class="dv-node dv-node-proxy" id="dv-s1-proxy">
    <div class="dv-node-head">
      <span class="dv-badge dv-badge-orange">Ingress / L7 Router</span>
      <code>diverge-proxy</code>
    </div>
    <div class="dv-node-meta">Header &amp; <code>?_diverge_env</code> cookie aware</div>
  </div>

  <div class="dv-node" id="dv-s1-web">
    <div class="dv-node-head">
      <span class="dv-badge dv-badge-green">Baseline 1/1</span>
      <code>storefront-web</code>
    </div>
    <div class="dv-node-meta">Image: <code>v1.4.0</code> · Next.js / Go BFF</div>
  </div>

  <div class="dv-node" id="dv-s1-api">
    <div class="dv-node-head">
      <span class="dv-badge dv-badge-green">Baseline 1/1</span>
      <code>checkout-api</code>
    </div>
    <div class="dv-node-meta">Image: <code>v1.4.0</code> · Propagates <code>x-diverge-env</code></div>
  </div>

  <div class="dv-node" id="dv-s1-worker">
    <div class="dv-node-head">
      <span class="dv-badge dv-badge-green">Baseline 1/1</span>
      <code>fulfillment-worker</code>
    </div>
    <div class="dv-node-meta">Image: <code>v1.4.0</code> · Topic: <code>orders.events</code></div>
  </div>

  <div class="dv-node" id="dv-s1-pg">
    <div class="dv-node-head">
      <span class="dv-badge dv-badge-blue">PostgreSQL 16</span>
      <code>schema: public</code>
    </div>
    <div class="dv-node-meta">Table: <code>orders</code> (4 baseline rows)</div>
  </div>

  <div class="dv-node" id="dv-s1-flipt">
    <div class="dv-node-head">
      <span class="dv-badge dv-badge-purple">OpenFeature / Flipt</span>
      <code>namespace: default</code>
    </div>
    <div class="dv-node-meta">Flag: <code>instant_payouts = false</code></div>
  </div>
</div>

<div class="dv-console" id="dv-s1-console">
  <div class="dv-console-bar">
    <span>HTTP Trace &amp; JSON Response</span>
    <code id="dv-s1-status">200 OK · 14ms · Baseline Route</code>
  </div>
  <pre class="dv-console-pre" id="dv-s1-output">$ curl -s https://shop.preview.example.com/api/checkout | jq .

{ “service”: “checkout-api”, “version”: “v1.4.0”, “environment”: “baseline (demo-staging)”, “db_schema”: “public”, “feature_flags”: { “instant_payouts”: false }, “settlement_eta”: “T+2 business days” }