Todo proyecto acaba necesitando algo de un sitio web. La clave de API de un proveedor de pagos. Un secreto de webhook. Un client token escondido tres menús más abajo en un panel. Un agente escribe la integración en minutos, y luego se detiene y te dice que vayas tú a hacer clic por el panel, porque esa parte ocurre en un navegador, detrás de tu inicio de sesión.
La configuración guiada es la forma en que SuperDevSpace cierra ese hueco. El agente abre el sitio en el navegador integrado de la app, hace los clics que tiene permitidos y te pasa la página, con una indicación y una frase, justo cuando el siguiente paso te toca a ti.
Por qué «que lo haga el agente» es la respuesta equivocada
La versión fácil de esta función le daría al agente todo el navegador: leer cada campo, escribir en cada casilla, pulsar cada botón. Sería rápido, y sería mala idea. Un proceso de configuración está lleno de cosas que un agente no debería tocar nunca:
- tu contraseña y el código de un solo uso de tu móvil;
- números de tarjeta, datos bancarios y documentos de identidad;
- las condiciones que aceptas y el pago que apruebas.
Así que el diseño empieza por el otro extremo. El agente hace el trabajo rutinario —navegar, encontrar la página correcta, escribir un nombre de proyecto, pulsar Crear— y todo lo personal o vinculante se queda contigo.
| Paso de un proceso de configuración | El agente | Tú |
|---|---|---|
| Abrir el panel y encontrar la página correcta | ✓ | |
| Escribir un nombre de proyecto, una URL, una opción de una lista | ✓ | |
| Escribir tu contraseña o el código de tu móvil | ✗ | ✓ |
| Introducir datos de tarjeta, bancarios o de identidad | ✗ | ✓ |
| Marcar las condiciones, pulsar «Pagar» o «Realizar pedido» | ✗ | ✓ |
Leer la nueva clave de API y guardarla en .env | ✓ |
Cómo transcurre una configuración guiada
El bucle es el mismo en todos los sitios, incluso en los que nadie ha escrito instrucciones.
- Abrir la página. El agente abre una pestaña de navegador dentro de la app. Tus sesiones en ese navegador se mantienen entre reinicios, así que puede que ya estés dentro.
- Mirar antes de actuar. El agente pide un esquema de la página: una línea por cada título, botón, enlace, campo y frame. Los campos sensibles se listan por tipo —contraseña, tarjeta, banco, código de un solo uso, identidad— con «relleno» o «vacío», nunca con su valor.
- Hacer su parte. Hace clic, rellena campos corrientes y lee texto, volviendo a leer la página tras cualquier acción que la cambie.
- Pasarte tu parte. Cuando el siguiente paso te toca a ti, el agente muestra una tarjeta de guía en la página: un título corto, una instrucción concreta y un resaltado sobre el campo o botón al que se refiere. Haces el paso y pulsas Listo, te lo paso. Si te atascas, pulsas Necesito ayuda y escribes lo que ves; el agente responde en la página.
- Esperar en el mismo turno. Mientras hay una guía en pantalla, el agente te espera. Sus clics y su escritura se rechazan hasta que le devuelvas la página, y puedes pulsar Parar / tomar el control en cualquier momento.
- Llevarse el resultado. Cuando la página muestra lo que venías a buscar —una clave de API, un token, un secreto de webhook—, el agente lo lee como secreto y lo guarda donde corresponde, por ejemplo en el
.envdel proyecto. Informa de dónde está la clave, no de la clave.
El diagrama en texto
sequenceDiagram
participant A as Agente
participant B as Panel de navegador
participant Y as Tú
participant E as .env
A->>B: abrir el panel
A->>B: esquema de la página
A->>Y: tarjeta de guía - inicia sesión y devuélvemela
Y->>B: contraseña y código de un solo uso
Y->>A: Listo - te lo paso
A->>B: crear la clave de API
B-->>A: clave leída como secreto
A->>E: guardar PADDLE_API_KEY
A->>Y: la clave está en .envAl terminar, puedes comprobar el resultado sin mostrar ningún secreto en pantalla:
$ grep -o '^PADDLE_[A-Z_]*=' .env
PADDLE_API_KEY=
PADDLE_CLIENT_TOKEN=
PADDLE_WEBHOOK_SECRET=
PADDLE_ENVIRONMENT=Reglas que impone la app
Son comprobaciones dentro de la app, y el agente no puede desactivarlas:
- Ni entran secretos ni salen secretos. El agente no puede escribir en un campo de contraseña, tarjeta, CVC, IBAN, código de un solo uso o identidad. Cuando lee la página o toma una instantánea, esos valores están ocultos y se eliminan de cualquier texto que lea.
- Las capturas se tapan. Los campos sensibles y cada frame de otro origen —un widget de tarjeta, un recuadro de «Iniciar sesión con Google»— se cubren antes de que un agente vea una imagen.
- Sin scripts en páginas sensibles. Ejecutar JavaScript en la página se rechaza en cualquier página que muestre uno de esos campos.
- El consentimiento y el pago son tuyos. Hacer clic en una casilla de condiciones o en un botón de «Pagar» / «Realizar pedido» se rechaza.
- Todo es visible. Lo que hace el agente en el panel de navegador se te muestra en el banner del panel mientras ocurre.
- Los secretos se quedan fuera de la conversación. Un valor leído como secreto se marca como sensible, y al agente se le indica que nunca lo repita en el chat, en informes, en notas de tareas ni en notificaciones.
Cualquier sitio web, no una lista de integraciones
La configuración guiada es un bucle, no una biblioteca de scripts. Funciona en un sitio para el que nadie ha escrito pistas, porque el agente lee la página que tiene delante. Para algunos servicios incluimos breves archivos de pistas —por ejemplo, el panel sandbox de Paddle y RevenueCat— que le dicen al agente dónde suelen estar los ajustes para desarrolladores. Los paneles mueven sus menús constantemente, así que las pistas lo dicen claro: si la página y la pista no coinciden, manda la página.
Esto importa más de lo que parece. El código de integración que escribe un agente es solo la mitad de una funcionalidad; la otra mitad es la cuenta, la clave y el webhook en el sitio web de otro. Con la configuración guiada, ambas mitades ocurren en la misma sesión, con el mismo agente, y tú dedicas tu tiempo solo a los pasos que solo tú puedes hacer.
Dónde encaja
La configuración guiada forma parte del mismo espacio de trabajo que todo lo demás en SuperDevSpace: el agente que escribe tu integración de pagos es el mismo que te acompaña a crear sus claves, en un panel de navegador junto a su terminal. Si eres nuevo por aquí, por qué creamos SuperDevSpace explica el resto del equipo que lo rodea.
Pruébalo
La prueba dura 14 días de Premium, sin tarjeta. Descarga SuperDevSpace, pídele a un agente que configure un proveedor de pagos o de analítica para tu proyecto y deja que te pase la página cuando te toque.
