Founding Member: $499/mes de por vida
Micare
Trucos técnicos

Tablero interactivo con permisos sobre tu almacén de datos

Un método (workflow) para sumar a tu app interna una pantalla donde tu equipo explora un dato de tu almacén (Postgres/Supabase): tabla, filtros, orden, indicadores, gráficas y detalle, detrás de login y con permisos por fila (RLS), sin exponer la llave maestra.

WorkflowPremiumTrucos técnicosintegraciones

🌱 Empieza aquí · Tablero interactivo con permisos sobre tu almacén de datos

¿Tienes datos guardados en tu almacén (una base Postgres gestionada con Supabase) que hoy solo salen por Excel, y quedan viejos el mismo día? Esta semilla le da a tu asistente un método paso a paso para agregar a tu app interna una pantalla donde un usuario de negocio explora ese dato solo: tabla con filtros, orden y búsqueda, indicadores, gráficas y detalle. Todo detrás de login y respetando quién puede ver qué (permisos por fila).

Lo mejor: el método viene con los guardrails de seguridad ya puestos (la llave maestra nunca llega al navegador, los permisos por fila se respetan por rol) y con una regla de oro para no cantar victoria antes de tiempo (se verifica viendo la pantalla, no con que el build compile).

Para instalarla

Abre esta carpeta con Claude Code o Cowork y dile a tu asistente:

"Siembra esta semilla 🌱"

Con eso basta de tu parte. Tu asistente hace todo lo demás y al final te dice cómo comprobar que quedó. Vas a ver algunas palabras en inglés en la pantalla (RLS, Server Component, deploy); ni caso, tu asistente te las traduce cuando toque.

¿Otras formas de pedírselo? "instala esta semilla", "deja lista la receta para hacer un tablero en mi app", "haz el setup de esto". Te entiende igual.


Para el asistente que siembra 🤖

Este componente es un workflow (un método de trabajo que se invoca cuando hay que construir un módulo de visualización), no un programa ejecutable ni un hook. No lleva chmod, no lleva entrada en settings.json y no ejecuta ningún script al instalarse. "Sembrarlo" es dejar el método donde tú, el asistente, lo puedas leer y aplicarlo cuando la persona te pida un tablero interactivo sobre su almacén.

El kernel trae dos archivos:

  • kernel/tablero-interactivo-app-interna.md — el método completo (las 4 fases, los guardrails de seguridad y el criterio de aceptación).
  • kernel/plantilla-tablero.ejemplo.md — una plantilla para aterrizar el método al caso real de esta persona (alcance, modelo de acceso, interacciones, números de control).

1. Coloca el método donde lo tengas a la mano

Tienes dos opciones, según qué tan seguido lo vaya a usar la persona:

Opción A · como receta bajo demanda (recomendada para la mayoría). Guarda el método dentro del repo de la app de la persona (el proyecto Next.js donde va a vivir el módulo), en una carpeta de recetas, y agrégale un puntero en el archivo maestro de instrucciones para saber que existe. Ojo: si abriste la carpeta de la semilla para instalar, primero ubícate en la raíz del proyecto de la app (si no sabes cuál es, pregúntale a la persona) antes de copiar; los comandos de abajo dejan el método ahí, no dentro de la semilla:

mkdir -p workflows
cp kernel/tablero-interactivo-app-interna.md workflows/tablero-interactivo-app-interna.md
cp kernel/plantilla-tablero.ejemplo.md workflows/plantilla-tablero.ejemplo.md

En Windows (PowerShell):

New-Item -ItemType Directory -Force -Path workflows
Copy-Item kernel\tablero-interactivo-app-interna.md workflows\
Copy-Item kernel\plantilla-tablero.ejemplo.md workflows\

Luego, en el archivo de instrucciones del proyecto (CLAUDE.md en Claude Code / Cowork, o AGENTS.md en Codex), agrega una línea como: "Para construir un tablero interactivo sobre el almacén, sigue el método de workflows/tablero-interactivo-app-interna.md."

Opción B · siempre cargado (si la persona hace esto muy seguido). En Claude Code / Cowork puedes dejarlo como regla permanente:

mkdir -p "$HOME/.claude/rules"
cp kernel/tablero-interactivo-app-interna.md "$HOME/.claude/rules/tablero-interactivo-app-interna.md"

Los archivos dentro de ~/.claude/rules/ se cargan solos al inicio de cada sesión. Úsalo solo si construir tableros es una tarea frecuente; si es ocasional, la Opción A mantiene tu contexto más ligero.

Codex: Codex lee su archivo de instrucciones AGENTS.md. Copia el contenido de tablero-interactivo-app-interna.md dentro de AGENTS.md, o guárdalo aparte en el proyecto y agrégale un puntero, para que el método esté disponible cuando toque.

2. Aterriza el método a ESTE caso (recomendado)

Abre kernel/plantilla-tablero.ejemplo.md. Con la persona, llena el alcance (qué ruta, qué tabla/vista, qué columnas se muestran y cuáles se ocultan), el modelo de acceso (quién ve qué → la política RLS), las interacciones y los números de control para verificar. Reemplaza los placeholders <ASI>. Guarda esa plantilla llena junto al método; será tu guion para la corrida real. Si la persona aún no sabe todo, deja lo que falte como por confirmar y pregúntalo cuando arranques; nunca lo inventes ni pongas data real.

3. Verificación post-siembra (obligatoria)

Como es un método (texto), la verificación tiene dos partes: que el archivo quedó en su lugar, y que el método se puede aplicar de verdad.

a) El archivo quedó colocado (ejemplo Opción A):

ls -la workflows/tablero-interactivo-app-interna.md; echo "exit=$?"

Salida esperada: una línea que lista el archivo (con su tamaño) y exit=0. Si sale No such file or directory, la copia no se hizo; repite el paso 1.

b) El método se puede aplicar (prueba de comportamiento): Pregúntale a tu asistente, en una conversación nueva: "quiero una pantalla en mi app interna donde mi equipo explore un dato de mi almacén con filtros y permisos, ¿cómo lo hago sin exponer la llave maestra?". La respuesta correcta menciona las piezas clave del método: la consulta de dato sensible corre en el servidor (Server Component); la llave maestra service_role jamás va al cliente (el navegador usa la llave publicable sujeta a RLS); la seguridad por filas se respeta por rol; el conteo visible se cruza contra select count(*) del almacén; y se verifica viendo la pantalla en runtime, no con que el build compile. Si no nombra esas piezas, el método no se cargó: revisa que el archivo esté en su carpeta (o dentro de AGENTS.md en Codex).

Cuando ambas partes pasen, avísale a la persona en una línea qué gana con esto.


✅ ¿Cómo sé que funcionó?

La próxima vez que alguien de tu equipo pida "mándame el Excel" de un dato que ya vive en tu almacén, tu asistente no va a improvisar ni a arriesgar una fuga de datos. Va a seguir una receta probada: traer el dato sensible en el servidor, respetar quién puede ver qué, construir la pantalla interactiva con la identidad de tu marca, y comprobar viendo la pantalla (no con que compile) antes de decirte "listo" y dejarte una preview para que la revises y la firmes.

En corto: ese dato deja de vivir atrapado en un Excel viejo y pasa a una pantalla viva, segura y con permisos, dentro de tu propia app. 🌱

¿Quieres implementarla con acompañamiento?

Agenda una asesoría directa con JP y aterrízala en tu caso · desde $600 MXN.

Agendar una asesoría