commercetools Frontend vs. Alokai vs. FMP: las opciones de frontend composable

Si utilizas commercetools como backend y estás valorando cómo construir el frontend, tienes tres opciones reales, no dos: commercetools Frontend (antes Frontastic, la herramienta de frontend propia del proveedor), Alokai (antes Vue Storefront, un framework de frontend composable en Vue y React), o una Frontend Management Platform (FMP) gestionada que trata el frontend como un servicio operado en lugar de una base de código que tú posees. Cada opción responde de forma distinta a "quién posee la capa de renderizado", y esa respuesta define tu configuración de Vue Storefront con commercetools durante años, no meses.

Por qué commercetools se entrega sin frontend

commercetools es API-first y cloud-native por diseño, con APIs GraphQL y REST, sin storefront por defecto. Ese es precisamente el sentido de una arquitectura composable y MACH: eliges cada capa. Pero significa que toda implementación de commercetools empieza con la misma conversación: ¿quién construye y posee el frontend? Hoy existen tres respuestas en el mercado, y cada una tiene un trade-off real.

Opción 1: commercetools Frontend (Frontastic)

commercetools adquirió Frontastic en 2021 y la renombró como commercetools Frontend, una herramienta de frontend basada en JavaScript, estrechamente integrada con la API de commercetools. Incluye componentes de storefront y conectores preconstruidos, lo que acorta la configuración inicial en comparación con una construcción desde cero.

El trade-off: es una herramienta propiedad del proveedor dentro de un backend propiedad del proveedor. Los equipos que más adelante quieran cambiar de herramienta de frontend, de agencia, de stack de marketing o de sistema de diseño, se encuentran tan atrapados dentro de las convenciones de commercetools Frontend como lo estaban dentro de la propia API. Es composable en la capa de backend y de proveedor único en la capa de frontend, que es exactamente la tensión que más plantean los clientes de commercetools.

Opción 2: Alokai (framework de storefront en Vue y React)

Alokai, renombrado a partir de Vue Storefront, es un framework de frontend composable construido principalmente alrededor de Vue.js, con soporte para React, diseñado para situarse frente a commercetools y otros backends MACH a través de su propia librería de conectores. Es una respuesta legítima como frontend composable: arquitectura abierta, comunidad activa, sin dependencia específica de commercetools.

El trade-off cambia de forma más que desaparecer. La librería de conectores y el modelo de hosting de Alokai se convierten en la nueva dependencia. Los equipos que construyen sobre Alokai siguen necesitando un equipo de ingeniería de frontend dedicado para construir, mantener y ampliar el storefront, la misma pregunta sobre coste de equipo que aplica a cualquier opción de construcción a medida, solo que con el andamiaje de Alokai en lugar de un proyecto Next.js en blanco.

Opción 3: una Frontend Management Platform gestionada

La tercera opción trata el frontend como un servicio operado. Una FMP se conecta a la API GraphQL de commercetools como una integración estándar y entrega el storefront, la superficie de edición y la librería de componentes como una plataforma gestionada en lugar de una base de código que tu equipo posee y parchea. Los equipos de marketing publican páginas mediante un editor visual, la ingeniería se centra en la lógica específica del backend en lugar de en la fontanería del frontend, y los despliegues multi-marca o multi-mercado se ejecutan sobre una única librería de componentes en lugar de un fork de código por marca.

Las tres opciones comparadas

Lo que esto realmente cuesta

El comercio composable promete que cada capa es intercambiable. En la práctica, la mayoría de las implementaciones de commercetools terminan siendo composables en el backend y bloqueadas en el frontend, sea cual sea la opción que elijan de las tres. La cifra que se suele omitir en las comparativas de proveedores es el coste del equipo de frontend: un equipo de ingeniería de frontend dedicado, ya trabaje contra commercetools Frontend, Alokai o una construcción a medida con Next.js o Nuxt, normalmente asciende bien entrado en seis cifras al año en cuanto se cuentan el mantenimiento, la guardia y el tiempo de ingeniería que consumen las peticiones de páginas del equipo de marketing.

Ese coste es la decisión real, más que la elección del framework. Si tu equipo ya cuenta con ingenieros de frontend comprometidos que quieren la propiedad de la base de código, Alokai es una respuesta legítima como frontend composable. Si quieres permanecer dentro de las herramientas propias de commercetools y aceptar el trade-off, commercetools Frontend cumple su función. Si quieres que el frontend esté desacoplado tanto del proveedor de backend como del roadmap de un equipo de frontend dedicado, ese es el caso que defiende una FMP gestionada.

Dónde encaja Laioutr

La Agentic Frontend Management Platform de Laioutr se conecta a commercetools mediante una integración GraphQL estándar, el frontend headless para commercetools, y mantiene el frontend independiente tanto del proveedor de backend como de una base de código de frontend dedicada. Los despliegues multi-marca y multi-mercado se ejecutan mediante composability and orchestration sobre una única librería de componentes en lugar de un fork por marca, que es justo donde los equipos en commercetools Frontend o Alokai suelen reconstruir un trabajo que ya hicieron una vez.

Esto no es un argumento en contra de commercetools. commercetools ahora vende el core commerce y el catálogo de productos como módulos independientes, lo que solo agudiza aún más la cuestión del desacople del frontend. Es un argumento en favor de que la decisión de frontend merece el mismo escrutinio que la decisión de backend, y de que "composable" debería aplicarse a ambas capas, no solo a la que controla commercetools. Los equipos que evalúan quién posee la capa de experiencia para quienes construyen sobre commercetools se están haciendo exactamente esta pregunta, solo desde el ángulo de quien construye API-first en lugar del ángulo de las herramientas de frontend.

Para una mirada más detallada de cómo Laioutr se compara específicamente con Alokai en arquitectura y modelo operativo, consulta Laioutr vs. Alokai.

Preguntas frecuentes

¿Es Alokai lo mismo que Vue Storefront? Sí, Alokai es el nombre renombrado de lo que antes era Vue Storefront, un framework de frontend composable construido principalmente sobre Vue.js con soporte para React.

¿Tenemos que migrar fuera de commercetools para usar una FMP? No. commercetools sigue siendo el backend en las tres opciones descritas aquí. La capa de frontend se conecta a través de la API GraphQL estándar de commercetools, sea cual sea la opción que elijas de las tres.

¿Qué opción es más rápida de lanzar? Una FMP gestionada suele ser la más rápida para landing pages y la publicación continua de marketing porque funcionan mediante un editor visual. La configuración inicial del storefront en las tres opciones es comparable en la etapa del conector GraphQL, la diferencia aparece en el mantenimiento continuo y la velocidad de publicación.

¿Podemos pasar de Frontastic o Alokai a una FMP más adelante sin una migración de backend? Sí. Como las tres opciones se conectan a commercetools mediante la misma API GraphQL, sustituir la capa de frontend no requiere tocar el backend, solo remapear componentes y contenido hacia la nueva capa.

Próximos pasos

Si estás eligiendo un frontend para commercetools y quieres que la promesa composable se aplique realmente a ambas capas, habla con nosotros sobre cómo sería una conexión GraphQL con commercetools a través de una capa de frontend gestionada para tu equipo, o empieza por la página de frontend para commercetools.

Sobre el autor: Marcel Thiesies es cofundador de Laioutr.