L’extension AEM Brackets fournit un processus fluide pour modifier AEM composants et les bibliothèques clientes, et utilise la puissance de Brackets l’éditeur de code, qui permet d’accéder aux calques et fichiers Photoshop à partir de l’éditeur de code. La synchronisation simplifiée (aucun Maven ou File Vault requis) grâce à l’extension améliore le rendement des développeurs et permet également aux développeurs de front-end ayant des connaissances AEM limitées de participer à des projets. Cette extension prend également en charge le langage de modèle HTML (HTL) qui élimine la complexité des JSP pour faciliter et sécuriser le développement de composants.
Les principales fonctionnalités de l’extension AEM Brackets sont les suivantes :
data-sly-*
En outre, Brackets s’accompagne de nombreuses fonctionnalités utiles pour les développeurs de polices AEM :
L’extension AEM Brackets prend en charge Brackets version 1.0 ou ultérieure.
Téléchargez la dernière version de Brackets sur Brackets.io.
Pour installer l’extension, procédez comme suit :
Ouvrez Brackets. Dans le menu Fichier, sélectionnez Extension Manager…
Entrée AEM dans la barre de recherche et recherchez Extension AEM Brackets.
Cliquez sur Installer.
Fermez la boîte de dialogue et l’Extension Manager une fois l’installation terminée.
Une fois l’extension installée, vous pouvez commencer à développer AEM composants en ouvrant un dossier content-package à partir de votre système de fichiers avec Brackets.
Le projet doit contenir au moins :
a jcr_root
Dossier (par exemple, myproject/jcr_root
)
a filter.xml
(par exemple, myproject/META-INF/vault/filter.xml
) ; pour plus d’informations sur la structure de la variable filter.xml
voir le fichier Définition du filtre Workspace.
Dans le menu Fichier de Brackets, choisissez Ouvrir le dossier… et choisissez le dossier jcr_root
ou le dossier du projet parent.
Si votre projet n’a pas de package de contenu, vous pouvez essayer d’appliquer l’exemple HTL TodoMVC. Sur GitHub, cliquez sur Télécharger le fichier ZIP, extrayez les fichiers localement et, comme indiqué ci-dessus, ouvrez le dossier jcr_root
dans Brackets. Suivez ensuite les étapes ci-dessous pour configurer les paramètres du projet et enfin téléchargez le package entier vers votre instance de développement AEM en exportant le package de contenu comme indiqué plus bas dans la section Synchronisation complète des packages de contenu du projet.
Après ces étapes, vous devriez être en mesure d’accéder à l’URL /content/todo.html
sur votre instance de développement AEM, d’apporter des modifications au code dans Brackets et de voir comment, après une actualisation dans le navigateur Web, les modifications ont été immédiatement synchronisées avec le serveur AEM.
Pour synchroniser votre contenu avec et depuis une instance de développement AEM, vous devez définir vos paramètres de projet. Pour cela, accédez au menu AEM et choisissez Paramètres du projet…
Les paramètres du projet permettent de définir :
http://localhost:4502
)admin
)admin
)L’extension AEM Brackets fournit les types de synchronisation de contenu suivants pour les fichiers et dossiers autorisés par les règles de filtrage définies dans filter.xml
:
Cela synchronise uniquement les modifications de Brackets vers l’instance AEM, mais jamais l’inverse.
Dans l’Explorateur de projet, ouvrez le menu contextuel en cliquant avec le bouton droit de la souris sur un fichier ou un dossier, et accédez aux options Exporter vers le serveur ou Importer depuis le serveur.
Si l’entrée sélectionnée se situe en dehors du dossier jcr_root
, les entrées du menu contextuel Exporter vers le serveur et Importer depuis le serveur sont désactivées.
Dans le menu AEM, les options Exporter le package de contenu ou Importer le package de contenu permettent de synchroniser l’ensemble du projet avec le serveur.
L’extension AEM Brackets comporte une icône de notification dans la barre d’outils située à droite de la fenêtre Brackets, qui indique l’état de la dernière synchronisation :
Cliquez sur l’icône de notification pour ouvrir la boîte de dialogue Rapport d’état de synchronisation qui répertorie tous les états de chaque fichier synchronisé.
Seul le contenu marqué comme inclus par les règles de filtrage de filter.xml
est synchronisé, quelle que soit la méthode de synchronisation appliquée.
De plus, les fichiers .vltignore
sont pris en charge pour exclure le contenu de la synchronisation bidirectionnelle avec le référentiel.
L’extension AEM Brackets propose également une fonction de remplissage automatique pour faciliter l’écriture d’attributs et d’expressions HTL.
sly
. L’attribut est automatiquement rempli sur data-sly-
.Dans une expression ${}
, les noms communs des variables sont remplis automatiquement.
L’extension AEM Brackets est un projet open source, hébergé sur GitHub par l’entreprise Adobe Marketing Cloud, sous licence Apache, version 2.0 :
L’éditeur de code Brackets est également un projet open source, hébergé sur GitHub par l’entreprise Adobe Systems Incorporated :
N’hésitez pas à apporter votre contribution !