Tu código, tuyo

Este dashboard fue expulsado — y se ejecuta en tu navegador

Un dashboard real de Vibedasher, extraído mediante el MCP como React plano y montado directamente en esta página. Sin iframe. Y cada fila que ves la calculó DuckDB-WASM en tu propia máquina — no ejecutamos ninguna consulta por ti.

44

archivos React, expulsados literalmente y sin modificar

23.7 KB

de Parquet, descargado una vez a tu navegador

0

consultas ejecutadas en nuestros servidores para mostrar esto

Cómo se construyó esta página

Tres pasos, sin pegamento a medida. Un agente de IA con acceso al MCP de Vibedasher hizo todo — igual que lo haría el tuyo.

# 1. point your AI at the Vibedasher MCP
{ "mcpServers": { "vibedasher": { "command": "vibedasher-mcp",
    "env": { "VIBEDASHER_API_KEY": "…", "VIBEDASHER_REGION": "eu-central-1" } } } }

# 2. ask it to eject the dashboard
eject_viz(viz_id=1275)
  -> 44 files: App.tsx, pages/, charts/, components/, stores/,
     tailwind.config.js, styles/dashboard.css, package.json, main.tsx

# 3. mount it in your app and hand it a query function
<App viz={viz} useSQL={useSQL} />

El árbol expulsado en esta página es idéntico byte a byte a la salida del MCP. El único archivo que escribimos es el componente de ~40 líneas que lo monta y le pasa una función de consulta.

El dashboard expulsado, en vivo

renderizado nativamente en esta página — no en un iframe

La función de consulta que inyectamos usa DuckDB-WASM leyendo un extracto Parquet del dataset. Cámbiala por el cliente del SDK de Vibedasher y exactamente los mismos componentes funcionarán contra el motor alojado — eso es lo único que cambia.