Développement des composants principaux developing-core-components

Quand utiliser les composants principaux ? when-to-use-the-core-components

Les composants principaux étant nouveaux et offrant plusieurs avantages, il est recommandé que les nouveaux projets AEM les utilisent. Pour les projets existants, une migration doit être envisagée dans le cadre d’un travail plus important, par exemple une création de nouvelle image ou une restructuration globale.

Par conséquent, Adobe donne les recommandations suivantes :

  • Nouveaux projets
    Les nouveaux projets doivent toujours tenter d’utiliser les composants principaux. Si les composants principaux ne peuvent pas être utilisés directement ou étendus pour répondre aux exigences du projet, créez un composant personnalisé d’après l’architecture du composant définie dans les composants principaux. Sauf si cela est impossible, évitez d’utiliser les composants de base.
  • Projets existants
    Il est recommandé de continuer à utiliser les composants de base, à moins qu’une restructuration de sites ou de composants ne soit planifiée.
    Comme la plupart des projets existants les utilisent largement, les composants de base continueront à être pris en charge.
  • Nouveaux composants personnalisés
    Vous pouvez évaluer si un composant principal existant peut être personnalisé.
    Dans le cas contraire, vous devez créer un nouveau composant personnalisé suivant les instructions des composants.
  • Composants personnalisés existants
    Si vos composants fonctionnent comme prévu, conservez-les tels quels.

    Dans le cas contraire, reportez-vous à la section « Nouveaux composants personnalisés » ci-dessus.

Réussir avec les composants principaux how-to-succeed

Les composants principaux sont puissants, flexibles et faciles à utiliser et personnaliser. Suivez quelques instructions pour vous assurer que votre projet utilisant les composants principaux soit une réussite.

Migration vers les composants principaux

Tout nouveau projet doit être implémenté avec les composants principaux. Toutefois, les projets existants disposent généralement de mises en œuvre étendues des composants de base.

Migration à partir des composants de base from-foundation

Un travail plus important sur un projet existant (par exemple une création de nouvelle image ou une restructuration globale) offre souvent une chance d’effectuer une migration vers les composants principaux. Pour faciliter cette migration, Adobe fournit un certain nombre d’outils de migration pour inciter l’adoption des composants principaux et de la dernière technologie AEM.

Les outils de modernisation AEM permettent de convertir facilement :

  • Les modèles statiques en modèles modifiables
  • Les configurations de la conception en stratégies
  • Les composants de base en composants principaux
  • L’interface utilisateur classique en interface utilisateur tactile

Pour plus d’informations sur l’utilisation de ces outils, voir leur documentation.

NOTE
Les outils de modernisation AEM ont été créés par la communauté et ne sont pas pris en charge ni garantis par Adobe.

Migration par déplacement vers AEM as a Cloud Service via-aemaacs

AEM as a Cloud Service incluant automatiquement la dernière version des composants principaux, lorsque vous effectuez une transition à partir d’une installation On-Premise d’AEM, vous devez supprimer toute dépendance aux composants principaux dans votre fichier de projet pom.xml.

Les composants de proxy fonctionnent toujours comme avant, car les proxys pointent vers le supertype nécessaire et le chemin d’accès du supertype contient la version. Ainsi, la simple suppression de la dépendance permet aux composants principaux de fonctionner dans AEM as a Cloud Service comme ils le faisaient dans la version On-Premise.

Comme pour tout autre projet AEM as a Cloud Service, vous devrez ajouter une dépendance au fichier jar du SDK AEM. Cette étape est nécessaire même si elle n’est pas spécifique aux composants principaux.

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

Pour plus d’informations sur les projets AEM as a Cloud Service, consultez le document Structure de projet AEM.

Prise en charge des composants principaux core-component-support

Les composants principaux font partie intégrante d’AEM et sont pris en charge en l’état, selon les mêmes conditions que s’ils étaient fournis dans le cadre du Quickstart.

Comme pour les autres fonctionnalités du produit AEM, la règle générale est la suivante : les composants sont d’abord annoncés comme étant obsolètes, puis supprimés au plus tôt pour la version AEM suivante. Cela permet aux clients d’avoir au moins un cycle de publication pour passer à la nouvelle version du composant avant l’abandon de sa prise en charge.

La version de chaque composant indique clairement les versions d’AEM prises en charge. Lorsque la prise en charge d’une version d’AEM est interrompue, la prise en charge des composants principaux de cette version d’AEM est prise en charge.

Pour plus d’informations sur la prise en charge des personnalisations des composants, voir la page Personnalisation des composants principaux.

Fonctionnalités techniques technical-capabilities

Le tableau ci-après présente les différences entre les composants principaux et les composants de base.

Pour plus d’informations sur leurs capacités de création et les options pour les préconfigurer, reportez-vous à la page de création qui leur a été consacrée.

Fonction
Composant principal
Composant de base
Logique d’implémentation
POJO Java avec les annotations de modèles Sling.
Code JSP
Définition de balisage
Syntaxe du modèle de langage HTML (HTL)
Code JSP
Assainissement XSS
Automatisée par HTL
Essentiellement manuelle
Nommage des classes CSS
Convention d’affectation de noms normalisée basée sur la notification Block Element Modifier (BEM) (à partir de la version 2.0.0)
Modèles personnalisés
Définition de boîte de dialogue
Coral 3
Interface utilisateur Coral 2 + Classique
Sortie JSON
Exportateur de modèles Sling avec sérialisation Jackson
Servlet Sling par défaut
Contrôle de version
Pour le modèle et le HTL
Aucun
Tests
Tests unitaires + tests d’intégration
Tests d’intégration
Diffusion
Via le site GitHub public
Via Quickstart
Licence
Licence Apache
Adobe propriétaire
Contribution
Via une demande d’extraction
Impossible
Accessibilité
Totalement conforme à la norme WCAG 2.0 AA
Partiellement conforme à la norme WCAG 2.0 AA

Liste des composants component-list

Le tableau ci-après répertorie les composants principaux disponibles, les liens vers leur API, et indique quels composants de base ils remplacent.

Composant principal
Description
Composants de base remplacés
Page
Page réactive fonctionnant avec l’éditeur de modèles
/libs/foundation/components/page /libs/wcm/foundation/components/page
Chemin de navigation
Navigation dans la hiérarchie des pages
/libs/foundation/components/breadcrumb
Titre
Titre H1-H6
/libs/foundation/components/title /libs/wcm/foundation/components/title
Texte
Texte enrichi
/libs/foundation/components/text /libs/foundation/components/table /libs/wcm/foundation/components/text
Image
Chargement intelligent et différé de la taille optimale du rendu
/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
Liste
Liste des pages
/libs/foundation/components/list /libs/foundation/components/mobilelist /libs/wcm/foundation/components/list
Partage sur les réseaux sociaux
Widget de partage Facebook et Pinterest
-
Conteneur de formulaires
Système de paragraphe de formulaire réactif
/libs/foundation/components/form/start /libs/foundation/components/form/end
Texte du formulaire
Champ de saisie de texte
/libs/foundation/components/form/text /libs/foundation/components/form/password
Options du formulaire
Champ de saisie d’options multiples
/libs/foundation/components/form/checkbox /libs/foundation/components/form/radio /libs/foundation/components/form/dropdown
Formulaire masqué
Champ de saisie masqué
/libs/foundation/components/form/hidden
Bouton de formulaire
Bouton Envoyer ou personnalisé
/libs/foundation/components/form/submit
Navigation
Composant de navigation sur le site qui répertorie la hiérarchie de la page imbriquée
/libs/foundation/components/topnav /libs/foundation/components/mobiletopnav
Navigation par langue
Sélecteur de langue et de pays qui répertorie la structure de langue globale
-
Recherche rapide
Composant de recherche qui affiche les résultats sous forme de suggestions sur place dans un menu déroulant
/libs/foundation/components/search
Teaser
Permet à l’auteur de contenu de créer facilement un teaser vers un contenu supplémentaire à l’aide d’une image, d’un titre ou d’un texte enrichi et de lier un contenu supplémentaire ou d’effectuer d’autres actions
-
Onglets
Permet à l’auteur de contenu d’organiser le contenu de la page dans plusieurs onglets
-
Carrousel
Permet à l’auteur de contenu d’organiser le contenu dans un carrousel de diapositives
/libs/foundation/components/carousel
Fragment de contenu
Permet l’affichage d’un fragment de contenu
-
Liste de fragments de contenu
Permet l’affichage d’une liste de fragments de contenu
-
Séparateur
Sépare le contenu d’une page
-
Accordéon
Organise les panneaux de contenu dans un accordéon réductible
-
Conteneur
Organise les composants dans un conteneur
-
Bouton
Crée un bouton sur une page
-
Téléchargement
Ajoute une ressource téléchargeable à une page
-
Fragment d’expérience
Ajout d’un fragment d’expérience à une page
/libs/cq/experience-fragments/editor/components/experiencefragment
Incorporer
Incorporation d’une ressource externe dans une page
-
Barre de progression
Fournit une représentation visuelle de la progression par rapport à un objectif
-
Visionneuse PDF
Présente un document PDF sur une page
-

Mise à niveau des composants principaux upgrade-of-core-components

L’un des avantages des composants versionnés est qu’ils permettent de séparer la migration vers une nouvelle version d’AEM de la migration vers les nouvelles versions des composants. En outre, si de nouvelles versions de composants sont disponibles, ils permettent la migration individuelle de chaque composant vers la nouvelle version.

Les migrations vers une nouvelle version d’AEM n’auront aucune incidence sur le fonctionnement des composants principaux, à condition que leurs versions prennent également en charge la nouvelle version d’AEM vers laquelle est effectuée la migration. Les personnalisations apportées aux composants principaux ne doivent pas être affectées tant qu’elles n’utilisent pas d’API obsolètes ou supprimées.

Les migrations vers de nouvelles versions des composants principaux n’auront aucune incidence sur le fonctionnement du composant. De plus, de nouvelles fonctionnalités peuvent être ajoutées pour les auteurs de pages, ce qui peut nécessiter une configuration par un éditeur de modèles, au cas où le comportement par défaut ne serait pas souhaité. Il est toutefois possible que des personnalisations doivent être adaptées. Pour plus d’informations, voir la page Personnalisation des composants principaux.

recommendation-more-help
d2be9096-a81e-404b-9952-d8925af7219c