Crearé tarjetas personalizadas de hubspot crm con extensiones de react ui
Nivel 1
Ha cumplido determinados criterios de rendimiento y muestra un gran potencial en la plataforma.
Acerca de este Servicio
¿Necesitas datos externos dentro de un registro de HubSpot para que tus representantes de ventas no tengan que abrir una segunda pestaña?
Construyo extensiones de interfaz de usuario de HubSpot (tarjetas de aplicaciones) con React, TypeScript y el CLI de HubSpot en la plataforma de desarrolladores actual, no en el endpoint de tarjetas CRM heredado y en desuso.
Lee esto antes de ordenar: las tarjetas de aplicaciones privadas requieren una suscripción Enterprise en cualquier hub. En Starter o Pro, la opción es una aplicación pública en su lugar. Dímelo tu nivel y te confirmaré cuál aplica antes de que gastes algo.
Lo que construyo:
- Tarjetas de aplicaciones en contactos, empresas, negocios, tickets y objetos personalizados (crm.record.tab, crm.record.sidebar, crm.preview)
- Páginas de aplicaciones y páginas de configuración para paneles de control en pantalla completa
- Funciones de la aplicación que llaman a tu API, ERP o base de datos SQL
- Migraciones de tarjetas CRM heredadas a extensiones de UI
- Actualizaciones de versión de la plataforma (2025.1 / 2025.2 a 2026.03)
Primero se despliega en una cuenta de prueba para desarrolladores, luego en tu portal, además del código fuente del proyecto y un README para que tu propio equipo pueda redeployar sin mí.
Más de 5 años trabajando con APIs de HubSpot y aplicaciones privadas. Node.js, Python, React.
Envíame un mensaje con tu nivel de hub, el objeto en el que se encuentra la tarjeta y el sistema del que extrae datos.
Software:
HubSpot
Sector:
Construcción
•
Energía
•
Telecomunicaciones
Mi porfolio
FAQ
Traducción automática
¿Necesito HubSpot Enterprise para crear una tarjeta de CRM personalizada?
Para una tarjeta de app privada, sí. Desde noviembre de 2024, las tarjetas de app privada funcionan en cualquier hub, pero el portal debe estar en un nivel Enterprise. En Starter o Pro, la opción es una app pública o una App Page, que no tienen requisito de nivel. Envíame tu hub y nivel y te confirmaré antes de que hagas el pedido.
¿Qué es una extensión de UI de HubSpot frente a una tarjeta de CRM heredada?
Una extensión de UI es un componente de React que funciona dentro de HubSpot, creado con el HubSpot CLI y la plataforma de desarrolladores. Una tarjeta de CRM heredada es el endpoint más antiguo que devuelve campos fijos. Las extensiones de UI te ofrecen tablas, botones, formularios y acciones personalizadas. Las tarjetas heredadas no.
¿Puedes migrar mi tarjeta legacy de HubSpot CRM a una extensión de UI?
Sí. Reconstruyo la tarjeta legacy como una extensión de UI en React en la plataforma de desarrolladores actual, manteniendo la misma fuente de datos y comportamiento. HubSpot publica un convertidor de tarjetas legacy de CRM como una implementación de referencia; uso ese patrón y lo extiendo con componentes y acciones reales.
¿En qué objetos de HubSpot puede aparecer una tarjeta personalizada de la app?
Contactos, empresas, negocios, tickets y objetos personalizados. Las opciones de colocación son crm.record.tab en la columna del medio, crm.record.sidebar en la barra lateral derecha y crm.preview en paneles de vista previa. Los objetos personalizados pueden dirigirse individualmente o con el comodín p_* en todo un portal.
¿La tarjeta de la app puede escribir datos de vuelta a mi sistema, no solo mostrarlos?
Sí. La comunicación bidireccional es estándar: botones, formularios y acciones personalizadas en la tarjeta llaman a tu API a través de App Functions o hubspot.fetch(). Una limitación importante a tener en cuenta desde el principio: las apps que usan scopes de Datos Sensibles pueden mostrar tarjetas, pero no pueden usar hubspot.fetch() ni funciones.
¿En qué versión de la plataforma de desarrolladores de HubSpot trabajas?
Plataforma 2026.03, que restauró la lógica serverless como App Functions en src/app/functions/. También trabajo en proyectos de 2025.1 y 2025.2, incluyendo la ruta de actualización entre ellas. Si tu app se quedó atascada en medio de la migración después de eliminar la función de 2025.2, esa es una tarea que puedo asumir por separado.
¿La extensión de la UI puede extraer datos de mi propia API, ERP o base de datos?
Sí. La tarjeta puede leer de cualquier API REST, base de datos SQL, ERP o servicio interno que puedas exponerle. La autenticación, límites de velocidad, estados de error y estados vacíos se manejan en la extensión para que tus representantes vean una tarjeta útil en lugar de un spinner cuando el sistema fuente está lento o caído.
¿Recibo el código fuente de la app privada de HubSpot?
Sí. Obtienes el código completo del proyecto para desarrolladores, el archivo de configuración -hsmeta.json, los componentes de React y un README que cubre configuración, despliegue y variables de entorno. Tu propio equipo puede redeployarlo con el CLI de HubSpot sin necesidad de mí. Sin bloqueo y sin caja negra alojada.
¿Cómo pruebas antes de desplegar en mi portal de HubSpot en vivo?
Primero creo y despliego en una cuenta de prueba o sandbox para desarrolladores, luego te guío a través de ello en una demo grabada o compartiendo pantalla. Solo después de que apruebes, la app pasa a tu portal de producción. Así, tus registros en vivo permanecen intactos mientras la tarjeta todavía se está modificando.
¿Cuánto tiempo tarda en construirse una tarjeta personalizada de HubSpot?
Una tarjeta de solo lectura en un objeto suele tardar entre 2 y 4 días. Las tarjetas con escritura, acciones personalizadas o múltiples objetos pueden tardar de 1 a 2 semanas. La migración de tarjetas antiguas depende de cuántas tarjetas y endpoints existan. Envíame un mensaje con el objeto, la fuente de datos y tu nivel para un plazo fijo.
