Demo 01 / Alcance mixto
Sin plantilla Canvas
Compara la portada visual con la ficha clásica y su teaser. Los displays CE conservan otro camino editorial.
Abrir la ficha ↗Canvas Headless y Lupus / Comparar con evidencia
No sustituimos Canvas.
Ampliamos el alcance.
Canvas Headless ya ofrece componentes frontend, preview, rutas e idiomas. Aquí mostramos dónde aporta Lupus: displays clásicos y Views fuera de Canvas bajo una entrega común.
| Área | Canvas Headless | Canvas + Lupus / Esta POC |
|---|---|---|
| Componentes frontend | El SDK registra componentes de la aplicación y renderiza el preview con el frontend, incluido Next.js. | Esta POC comparte React y CSS mediante ExtJS y un proveedor de preview propio. |
| Contenido fuera de Canvas | Admite nodos con Content Templates y datos mediante JSON:API. Una ruta no gestionada devuelve content: null. | Los displays CE entregan fichas y teasers sin árbol ni plantilla Canvas. |
| Views y listados | La guía usa JSON:API para consultas y listados. No hemos probado un display Views equivalente ni una View embebida. | lupus_decoupled_views entrega el display de página CE con sus resultados y paginación. |
| Contrato y rutas | fetchPage resuelve rutas, metadatos y redirecciones. No se limita a exportar un árbol. | La API de página cubre en esta demo Canvas, displays CE clásicos y páginas Views. |
| Preview de borradores | Documenta preview de la aplicación con OAuth y permisos de lectura vinculados al editor. | Esta POC verifica preview de componentes; no valida un preview autenticado de páginas completas en Next.js. |
| Idiomas y SSR | Documenta multidioma por prefijo o query y dispone de integración Next.js con renderizado en servidor. | La demo conecta traducciones ES/EN, navegación localizada y SSR. |
| Custom Elements | También depende del módulo Custom Elements y normaliza árboles de elementos. | Usamos element, props y slots para integrar los tres orígenes con React. |
| Elección y límites | Evaluar su SDK si el sitio se apoya en Canvas y sus plantillas; el README lo describe como experimental. | Evaluar Lupus para conservar displays y páginas Views fuera de Canvas bajo una entrega común. |
Demo 02 / Reutilizar Views
La View decide
Recorre 3 + 3 + 1 resultados y recarga la segunda página. Drupal ejecuta la View; Next.js presenta.
Abrir la segunda página ↗Demo 03 / Verificar el contrato
Tres orígenes, un recorrido
Alterna Canvas, nodo y View. El valor está en cubrir los tres orígenes, no en tener JSON, SSR o idiomas.
Abrir el inspector ↗Criterio de decisión
Evalúa Canvas Headless si tu sitio se articula con Canvas y sus plantillas. Evalúa Lupus si quieres conservar displays clásicos y páginas Views fuera de Canvas bajo una entrega común. Ambos enfoques requieren validar permisos, caché y despliegue.