Desarrollo de componentes principales

¿Cuándo utilizar los componentes principales?

Como los componentes principales son completamente nuevos y ofrecen varios beneficios, se recomienda utilizarlos en los nuevos proyectos de AEM. En los proyectos existentes, la migración debería ser parte de un esfuerzo de proyecto aún mayor; por ejemplo, para realizar un cambio en la marca o la refactorización total.

Por lo tanto, Adobe ofrece las siguientes recomendaciones:

  • Proyectos nuevos
    Los proyectos nuevos siempre deben intentar utilizar los componentes principales. Si los componentes principales no se pueden utilizar directamente o ampliados para satisfacer los requisitos del proyecto, cree un componente personalizado siguiendo la arquitectura de componentes establecida en los componentes principales. Salvo que no sea posible, evite utilizar los componentes de base.
  • Proyectos existentes
    Se recomienda que los proyectos existentes sigan usando los componentes base, a menos que se planifique una refactorización de sitios o componentes.
    Como la mayoría de los proyectos existentes los utilizan muy ampliamente, los componentes de base seguirán siendo compatibles.
  • Nuevos componentes personalizados
    Evaluar si un componente principal existente se puede personalizar.
    Si no es así, se recomienda crear un componente personalizado nuevo siguiendo las Directrices de componentes.
  • Componentes personalizados existentes
    Si los componentes funcionan según lo esperado, manténgalos tal cual.

    Si no es así, consulte "Nuevos componentes personalizados" más arriba.

Cómo utilizar correctamente los componentes principales

Los componentes principales son completos, flexibles y fáciles de usar y personalizar. Seguir algunas directrices clave garantizará que el proyecto con los componentes principales sea un éxito.

Migración hacia los componentes principales

Cualquier nuevo proyecto debe implementarse con los componentes principales. Sin embargo, los proyectos existentes normalmente tendrán amplias implementaciones de los componentes de base.

Migración desde componentes de base

Un esfuerzo mayor en un proyecto existente (por ejemplo, un cambio de marca o una refactorización general) a menudo ofrece la oportunidad de migrar a los componentes principales. Para facilitar esta migración, Adobe ofrece una serie de herramientas de migración que fomentan la adopción de los componentes principales y de la tecnología de AEM más reciente.

Las herramientas de modernización de AEM facilitan la conversión de lo siguiente:

  • Plantillas estáticas a plantillas editables.
  • Diseño de las configuraciones para directivas.
  • Componentes básicos a principales.
  • De IU clásica a IU táctil.

Para obtener más información sobre el uso de estas herramientas, consulte su documentación.

NOTA

Las herramientas de modernización de AEM son un esfuerzo de la comunidad y Adobe no las admite ni las garantiza.

Migración mediante Cambiar a AEM Cloud Service

Como AEM Cloud Service viene con la última versión de los componentes principales automáticamente, cuando se desplaza de una instalación de AEM en línea, deberá eliminar cualquier dependencia de los componentes principales del archivo de proyectos pom.xml.

Los componentes proxy seguirán funcionando como antes porque los proxies apuntan al supertipo necesario y la ruta del supertipo tiene la versión en él. De este modo, la simple eliminación de la dependencia permite que los componentes principales funcionen en AEMaaCS del mismo modo que lo hicieron en línea.

Al igual que cualquier otro proyecto de AEMaaCS, también deberá añadir una dependencia al jar del SDK de AEM. Esto no es específico de los componentes principales, pero es obligatorio.

<dependency>
   <groupId>com.adobe.aem</groupId>
   <artifactId>aem-sdk-api</artifactId>
</dependency>

Consulte el documento Estructura del proyecto de AEM para obtener más información sobre los proyectos de AEMaaCS.

Compatibilidad con los componentes principales

Los componentes principales son parte integral de AEM y se admiten tal cual bajo los mismos términos y condiciones en los que se admitirían si fueran parte del inicio rápido.

Al igual que otras características de los productos de AEM, la regla general es que los componentes se anuncien primero como obsoletos y los primeros se eliminen en la siguiente versión de AEM. Esto proporciona a los clientes al menos un ciclo de lanzamiento para poder cambiarse a la nueva versión del componente antes de que finalice el servicio de soporte.

La versión de cada componente señala claramente las versiones de AEM que admite. Cuando una versión de AEM deja de ser compatible, también lo deja de ser el componente principal de esa versión de AEM.

Para obtener más detalles sobre la compatibilidad de la personalización de componentes, consulte la página Personalizar componentes principales.

Capacidades técnicas

En la siguiente tabla se ofrece una descripción general de las diferencias entre los componentes principales y los de base.

Para obtener más información sobre sus capacidades de creación y las opciones para preconfigurarlas, consulte la página de creación sobre ellas.

Capacidad Componente principal Componente Base
Implementación lógica POJO de Java con anotaciones de Modelos Sling Código JSP
Definición de marca Lenguaje de la plantilla HTML sintaxis (HTL) Código JSP
Saneamiento XSS Automatizado por HTL Principalmente manual
Asignación de nombres a clases CSS Convenciones de nomenclatura estandarizadas basadas en la notación Modificador de elementos de bloque (BEM) (a partir de la versión 2.0.0) Esquemas personalizados
Cuadro de diálogo de definición Coral 3 Coral 2 + IU clásica
Salida JSON Exportador de modelos Sling con serialización Jackson Servlet Sling predeterminado
Versiones Para el modelo y el HTL Ninguna
Pruebas Pruebas de unidad + pruebas de integración Pruebas de integración
Entrega A través de GitHub público Mediante Quickstart
Licencia Licencia de Apache Propietario de Adobe
Contribución Mediante solicitud de extracción No es posible
Accesibilidad Totalmente compatible con el WCAG 2.0 AA estándar Sólo parcialmente compatible con el WCAG 2.0 AA estándar

Lista de componentes

En la siguiente tabla se enumeran los componentes principales disponibles, enlazándolos a su API, e indican los componentes de base a los que reemplazan.

Componente principal Descripción Componentes de base reemplazados
Página Página adaptable que trabaja con el editor de plantillas /libs/foundation/components/page /libs/wcm/foundation/components/page
Ruta de navegación Navegación por las jerarquías de página /libs/foundation/components/breadcrumb
Título Título H1-H6 /libs/foundation/components/title /libs/wcm/foundation/components/title
Texto Texto enriquecido /libs/foundation/components/text /libs/foundation/components/table /libs/wcm/foundation/components/text
Imagen Carga inteligente y lenta de un tamaño de representación óptimo /libs/foundation/components/image /libs/foundation/components/adaptiveimage /libs/foundation/components/logo /libs/foundation/components/mobileimage /libs/foundation/components/mobilelogo /libs/wcm/foundation/components/image
Lista Lista de páginas /libs/foundation/components/list /libs/foundation/components/mobilelist /libs/wcm/foundation/components/list
Compartir en redes sociales Widget para compartir en Facebook y Pinterest -
Contenedor del formulario Sistema de párrafos de formulario adaptable /libs/foundation/components/form/start /libs/foundation/components/form/end
Texto de formulario Campo de entrada de texto /libs/foundation/components/form/text /libs/foundation/components/form/password
Opciones de formulario Campo de entrada de varias opciones /libs/foundation/components/form/checkbox /libs/foundation/components/form/radio /libs/foundation/components/form/dropdown
Formulario oculto Campo de entrada oculto /libs/foundation/components/form/hidden
Botón de formulario Botón Enviar o personalizado /libs/foundation/components/form/submit
Navegación Componente de navegación del sitio que enumera la jerarquía de páginas anidada /libs/foundation/components/topnav /libs/foundation/components/mobiletopnav
Navegación por idiomas Alternador de idioma y país que enumera la estructura de idioma global -
Búsqueda rápida Componente de búsqueda que muestra los resultados como sugerencias in situ en un menú desplegable /libs/foundation/components/search
Teaser Permite al autor del contenido crear fácilmente un teaser para añadir contenido mediante una imagen, un título o un texto enriquecido y vincular con otro contenido u otras acciones -
Pestañas Permite al autor del contenido organizar el contenido de la página en varias pestañas -
Carrusel Permite al autor de contenido organizar el contenido en un carrusel giratorio de diapositivas /libs/foundation/components/carousel
Fragmento de contenido Permite la visualización de un fragmento del contenido -
Lista de fragmentos de contenido Permite mostrar una lista de fragmentos de contenido -
Separador Separa el contenido de una página -
Acordeón Organiza paneles de contenido en un acordeón plegable -
Contenedor Organización de componentes dentro de un contenedor -
Botón Creación de un botón en una página -
Descargar Agregar un recurso descargable a una página -
Fragmento de experiencias Añadir un fragmento de experiencia a una página /libs/cq/experience-fragments/editor/components/experiencefragment
Incrustar Incrustar un recurso externo en una página -
Barra de progreso Proporcionar una representación visual del progreso hacia un objetivo -
Visualizador de PDF Presenta un documento PDF en una página -

Próximos componentes

Para obtener una descripción general de la próxima hoja de ruta del componente principal, consulte la wiki del proyecto en GitHub.

Actualización de los componentes principales

Una ventaja de los componentes con versiones es que permite separar la migración a una nueva versión de AEM de la migración a las nuevas versiones de los componentes. Además, si hay versiones de componentes nuevas disponibles, permite la migración individual de cada componente a la nueva versión.

Las migraciones a una nueva versión de AEM no afectarán al funcionamiento de los componentes principales, siempre que sus versiones también admitan la nueva versión de AEM a la que se va a migrar. Las personalizaciones realizadas en los componentes principales tampoco deben verse afectadas, siempre que no utilicen API obsoletas o eliminadas.

Las migraciones a nuevas versiones de los componentes principales tampoco afectarán al funcionamiento del componente, pero podrían introducirse nuevas funciones a los autores de páginas, que podrían requerir cierta configuración por parte de un editor de plantillas, en caso de que no se desee el comportamiento predeterminado. Sin embargo, es posible que haya que adaptar las personalizaciones; para obtener más información, consulte la página Personalización de componentes principales.

En esta página