> ## Documentation Index
> Fetch the complete documentation index at: https://lovable.generaltranslation.app/llms.txt
> Use this file to discover all available pages before exploring further.
# Integración con Make
> Aprende a integrar Make con tu aplicación en Lovable
## ¿Qué es Make?
[Make](https://www.make.com) es una potente plataforma de automatización sin código que te permite crear visualmente flujos de trabajo entre apps, APIs y fuentes de datos.
En lugar de escribir lógica de backend, arrastras, sueltas y conectas módulos en un lienzo tipo diagrama de flujo. Es ideal para:
* **Personas sin experiencia en desarrollo** que quieren automatizar sin escribir código
* **Desarrolladores** que quieren prototipar rápido o ampliar funcionalidades mediante APIs
* **Equipos** que buscan conectar herramientas como Slack, Airtable, Notion, Calendly, Supabase y más
Con Make, puedes:
* **Activar acciones** desde tu app de Lovable (por ejemplo, cuando se hace clic en un botón)
* **Enviar y recibir datos** mediante webhooks y APIs
* **Conectarte con más de 1.500 herramientas** o APIs personalizadas
* **Automatizar** tareas como el envío de correos electrónicos, llamadas de IA, enriquecimiento de datos y recordatorios
## ¿Por qué usar Make con Lovable?
En este tutorial, Make actúa como tu **backend con IA integrada**, mientras que Lovable impulsa el frontend. El resultado: un CRM personalizado, creado en minutos y totalmente automatizado.
Esta configuración es ideal para:
* Personas sin experiencia en desarrollo que necesitan lógica avanzada
* Equipos de ventas con flujos de trabajo en constante evolución
* Iterar rápidamente sin tener que gestionar un backend
* Automatizaciones basadas en API con respuestas en tiempo real en la interfaz de usuario
## Tutorial paso a paso
### Qué vamos a construir
Vas a crear un CRM con tres modelos de datos principales:
* **Deals** (con seguimiento basado en etapas)
* **Contacts** (con edición en línea)
* **Companies** (con datos enriquecibles)
Cada entidad interactúa con automatizaciones mediante Make. Al final, podrás:
* Mover un deal y activar un correo electrónico
* Hacer clic en un contacto e iniciar una llamada de ventas asistida por IA
* Hacer clic en una empresa y obtener datos en tiempo real
* Proteger todo mediante Funciones Edge de Supabase
### ¿Cómo lo vamos a construir?
Construir tu propio CRM puede llevar meses. Con **Lovable** y **Make**, puedes lanzar uno en menos de una hora y automatizar por completo todo el flujo de ventas sin escribir nada de código backend. En esta guía paso a paso, aprenderás a crear un **CRM completamente funcional con IA**, que incluye:
* Pipelines de oportunidades visuales (arrastrar y soltar)
* Ventanas modales editables de contactos y empresas
* Agentes de llamadas con IA usando [Vapi](https://vapi.ai/)
* Enriquecimiento de datos de empresas mediante [Apollo.io](http://Apollo.io)
* Flujos de trabajo de correo electrónico y seguridad con Supabase
* Automatizaciones en tiempo real usando [Make](https://www.make.com)
Necesitas crear un sistema CRM que incluya: oportunidades, contactos y empresas. Usa un tema claro.
Crea un nuevo Proyecto en Lovable. Elige el tipo de proyecto: **CRM**.
Define 3 entidades: **Oportunidades**, **Contactos** y **Empresas**.
Selecciona **Light Theme** si lo prefieres y haz clic en **Generate**.
Abre la sección **Deals** en Lovable.
Haz clic en **Edit** y añade cinco etapas:
* **Lead**
* **Qualification**
* **Proposal Sent**
* **Negotiation**
* **Closed - Won/Lost**
Activa la funcionalidad de **Drag-and-Drop** para poder mover las oportunidades entre etapas.
Arrastrar y soltar te permite automatizar acciones en función de la etapa de la oportunidad.
**¿Por qué?** Esto permite a los usuarios hacer seguimiento de las oportunidades en un flujo de trabajo visual.
En **Contacts**, habilita una **vista modal en la que se pueda hacer clic**.
Haz que todos los campos sean **editables directamente** dentro del modal.
* El modal muestra los **detalles del contacto**.
* Los campos son **editables** para facilitar las actualizaciones.
Esto evita tener que cambiar de vista y es más rápido que los CRM tradicionales.
**¿Por qué?** Los CRM tradicionales redirigen a los usuarios a una nueva página, lo que ralentiza el flujo de trabajo. Un modal mantiene todo en su lugar.
* Abre [Make](https://www.make.com/) y crea un **nuevo escenario**.
* Haz clic en **Webhooks > Custom Webhook** y asígnale el nombre **Call Contact**.
* Copia la URL del webhook.
* En el modal de **Contacts**, agrega un botón **Call Contact**.
* Modifica la acción del botón para **enviar datos JSON** (nombre, número de teléfono, empresa y objetivo de la llamada) al webhook de Make.
* Prueba la conexión haciendo clic en **Call Contact**.
* En Make, agrega un **módulo API Call**.
* Envía una solicitud a [Vapi](https://vapi.ai/) con los detalles de la llamada.
* Tu agente personalizado de Vapi hará lo siguiente:
* Realizar la llamada
* Seguir una instrucción dinámica basada en la oportunidad
* Registrar los resultados de nuevo en Lovable
Esto crea una llamada saliente automatizada con IA, que se inicia al instante desde la interfaz de tu CRM.
* Añade un segundo **Custom Webhook** en Make llamado `Enrich Company`.
* Copia la URL del webhook.
* En **Companies**, añade un botón **Enrich Company**.
* Al hacer clic, envía el dominio de la empresa como payload JSON.
Cuando hagas clic en el botón de enriquecimiento, haz lo siguiente:
1. Elimina el modal que se abre; ya no es necesario.
2. Nuevo paso real: envía el dominio como JSON al siguiente webhook: \[Link]
3. Recibirás una respuesta del webhook en JSON y deberás analizarla dinámicamente en la vista del modal, así que crea campos dinámicos.
* Usa la [Organization Enrichment API](https://apollo.io/docs) de Apollo.
* Obtén:
* Sector
* Número de empleados
* Dirección
* Sitio web
* Financiación
* Devuelve los datos enriquecidos a Lovable.
* Genera dinámicamente campos en el modal de Lovable a partir del JSON.
* Presenta los datos en una interfaz de usuario legible (no JSON sin procesar).
El enriquecimiento de Apollo añade información clave para ayudar a calificar empresas más rápido.
Para proteger tus webhooks:
* Activa la **Supabase Integration** en la configuración del Proyecto.
* Crea una **Función perimetral** que haga de proxy de las solicitudes a Make.
* Actualiza Lovable para llamar a tu función de Supabase en lugar del Webhook directo.
Esto oculta la URL de tu Webhook del navegador — esencial para las apps públicas.
Por favor, cuando hagas clic en el botón de enriquecer, usa una función perimetral de Supabase para ocultar la llamada de API a la dirección del webhook. Para ello, debes cambiar la funcionalidad y asegurarte de que la llamada de API quede realmente oculta.
Para automatizar campañas de correo electrónico basadas en las etapas de las oportunidades:
* En Make, agrega lógica para disparar eventos:
* Envía un correo cuando una oportunidad pase a **Proposal Sent**
* Notifica al equipo por Slack cuando una oportunidad llegue a **Negotiation**
* Agrega contactos a un boletín o flujo de campaña
Esto mantiene tu proceso de ventas en marcha incluso cuando no estás en línea.
* Crea oportunidades y contactos de prueba.
* Activa el flujo de llamadas de IA.
* Enriquece los datos de la empresa y comprueba los resultados.
* Usa el **dominio personalizado** para personalizar tu CRM.
* Comparte tu app con tu equipo.
Has creado un CRM totalmente funcional con IA, sin necesidad de backend.
**Próximos pasos**
* Añade integraciones: Slack, Notion, HubSpot, Calendly
* Protege todo con Supabase y añade registros de auditoría
## Consejos prácticos de la sesión en vivo
* Usa **select + instrucción** dentro de Lovable para ediciones precisas
* Usa **Visual Canvas de Make** para mapear flujos antes de conectarlos
* Parsear dinámicamente campos JSON desconocidos en modales para mejorar la UX
* Combina Vapi + Apollo + Make para flujos de trabajo de IA en tiempo real
* Usa Supabase Edge Functions para enmascarar todas las llamadas públicas de API y webhooks
## Preguntas frecuentes
Make es una plataforma de automatización visual que te permite conectar herramientas y crear flujos de trabajo usando módulos de arrastrar y soltar. Piénsalo como Zapier, pero más flexible y orientado a desarrolladores.
* No necesitas escribir código de backend
* Activa flujos de trabajo desde tu interfaz (botones, formularios, modales)
* Crea automatizaciones de forma visual (llamar agentes, enriquecimiento, flujos de correo electrónico)
* Conecta con más de 1.500 aplicaciones (Slack, Notion, Calendly, Airtable y más)
Lovable envía datos (normalmente como JSON) mediante **webhooks HTTP** a Escenarios de Make. Make recibe esos datos, los procesa (por ejemplo, llama a una API) y puede responder de vuelta a Lovable.
Los Escenarios son flujos de trabajo de automatización. Defines:
* Disparadores (por ejemplo, Webhook)
* Acciones (por ejemplo, llamada a una API, envío de correo electrónico)
* Lógica (enrutadores, filtros, iteraciones)
Sí. Usa:
* **Restricciones de IP** (limita quién puede llamar al webhook)
* **Funciones Edge de Supabase** para actuar como proxy y ocultar URLs sensibles
* **Autenticación con clave API** en los encabezados
* **Make** es una herramienta de automatización visual (ideal para flujos de trabajo, integraciones de API y disparadores de IA).
* **Las Funciones Edge de Supabase** son código de backend sin servidor (ideal para lógica, autenticación y seguridad).
Úsalas **juntas** para obtener los mejores resultados.
Tu Escenario se pausará. Make envía alertas y puedes ampliar tu plan u optimizar tus flujos. Para esta guía, el **plan Pro gratuito** del webinar incluye **20.000 operaciones**, más que suficiente para crear prototipos.
Sí! Usa **entrada manual de datos** en el Webhook o activa el Escenario mediante Postman o curl. Esto es muy útil para depurar antes de conectarlo a Lovable.
[Make](https://www.make.com) es una potente plataforma de automatización sin código que te permite crear visualmente flujos de trabajo entre apps, APIs y fuentes de datos.
En lugar de escribir lógica de backend, arrastras, sueltas y conectas módulos en un lienzo tipo diagrama de flujo. Es ideal para:
* **Personas sin experiencia en desarrollo** que quieren automatizar sin escribir código
* **Desarrolladores** que quieren prototipar rápido o ampliar funcionalidades mediante APIs
* **Equipos** que buscan conectar herramientas como Slack, Airtable, Notion, Calendly, Supabase y más
Con Make, puedes:
* **Activar acciones** desde tu app de Lovable (por ejemplo, cuando se hace clic en un botón)
* **Enviar y recibir datos** mediante webhooks y APIs
* **Conectarte con más de 1.500 herramientas** o APIs personalizadas
* **Automatizar** tareas como el envío de correos electrónicos, llamadas de IA, enriquecimiento de datos y recordatorios
* Abre [Make](https://www.make.com/) y crea un **nuevo escenario**.
* Haz clic en **Webhooks > Custom Webhook** y asígnale el nombre **Call Contact**.
* Copia la URL del webhook.
* En el modal de **Contacts**, agrega un botón **Call Contact**.
* Modifica la acción del botón para **enviar datos JSON** (nombre, número de teléfono, empresa y objetivo de la llamada) al webhook de Make.
* Prueba la conexión haciendo clic en **Call Contact**.
* En Make, agrega un **módulo API Call**.
* Envía una solicitud a [Vapi](https://vapi.ai/) con los detalles de la llamada.
* Tu agente personalizado de Vapi hará lo siguiente:
* Realizar la llamada
* Seguir una instrucción dinámica basada en la oportunidad
* Registrar los resultados de nuevo en Lovable
* Usa la [Organization Enrichment API](https://apollo.io/docs) de Apollo.
* Obtén:
* Sector
* Número de empleados
* Dirección
* Sitio web
* Financiación
* Devuelve los datos enriquecidos a Lovable.
* Genera dinámicamente campos en el modal de Lovable a partir del JSON.
* Presenta los datos en una interfaz de usuario legible (no JSON sin procesar).
Para proteger tus webhooks:
* Activa la **Supabase Integration** en la configuración del Proyecto.
* Crea una **Función perimetral** que haga de proxy de las solicitudes a Make.
* Actualiza Lovable para llamar a tu función de Supabase en lugar del Webhook directo.