Extensie AEM

LET OP

AEM 6.4 heeft het einde van de uitgebreide ondersteuning bereikt en deze documentatie wordt niet meer bijgewerkt. Raadpleeg voor meer informatie onze technische ondersteuningsperioden. Ondersteunde versies zoeken hier.

Overzicht

De extensie AEM Brackets biedt een vloeiende workflow voor het bewerken van AEM componenten en clientbibliotheken en maakt gebruik van de kracht van de Haakjes code-editor, die vanuit de code-editor toegang biedt tot Photoshop-bestanden en -lagen. De eenvoudige synchronisatie die wordt geboden door de extensie (geen Maven of File Vault vereist) verhoogt de efficiëntie van de ontwikkelaar en helpt ontwikkelaars met beperkte AEM kennis ook om aan projecten deel te nemen. Deze extensie biedt ook enige ondersteuning voor de HTML Sjabloontaal (HTL), waardoor de complexiteit van JSP wordt weggenomen om de ontwikkeling van componenten eenvoudiger en veiliger te maken.

chlimage_1-53

Functies

De hoofdkenmerken van de extensie AEM Brackets zijn:

Geautomatiseerde synchronisatie van gewijzigde bestanden naar de AEM-ontwikkelingsinstantie.
Handmatige tweerichtingssynchronisatie van bestanden en mappen.
Volledige tevreden-pakket synchronisatie van het project.
HTML-code-voltooiing voor expressies en data-sly-* blokinstructies.

Bovendien zijn er veel handige functies voor AEM ontwikkelaars van lettertypen:

Photoshop-bestandsondersteuning voor het ophalen van gegevens uit een PSD-bestand, zoals lagen, metingen, kleuren, lettertypen, tekst, enzovoort.
Coderingstips van de PSD om deze geëxtraheerde informatie in de code eenvoudig te hergebruiken.
Ondersteuning voor CSS-preprocessor, zoals LESS en SCSS.
En honderden extra extensies die meer specifieke behoeften dekken.

Installatie

Haakjes

De extensie AEM Brackets ondersteunt versie 1.0 of hoger.

Download de nieuwste versie Brackets van brackets.io.

De extensie

Ga als volgt te werk om de extensie te installeren:

Open haakjes. In menu Bestand, selecteert u Extension Manager…
Enter AEM in de zoekbalk en zoek naar Extensie AEM.
Klikken Installeren.
Sluit het dialoogvenster en de Extension Manager nadat de installatie is voltooid.

Aan de slag

Het content-package project

Nadat de extensie is geïnstalleerd, kunt u beginnen met het ontwikkelen van AEM componenten door een inhoudspakketmap te openen vanuit uw bestandssysteem met haakjes.

Het project moet ten minste het volgende bevatten:

a jcr_root map (bijvoorbeeld myproject/jcr_root)
a filter.xml bestand (bijvoorbeeld myproject/META-INF/vault/filter.xml); voor meer informatie over de structuur van de filter.xml dossier gelieve te zien gelieve Definitie van werkruimtfilter.

In haakjes'' Bestand menu, kiest u Map openen… en kies jcr_root of de bovenliggende projectmap.

OPMERKING

Als u geen eigen project met een content-package hebt, kunt u het HTL TodoMVC-voorbeeld. Klik op GitHub ZIP downloaden, pakt u de bestanden lokaal uit en opent u de jcr_root map in Brackets. Voer vervolgens de onderstaande stappen uit om het Projectinstellingen en uploadt u ten slotte het hele pakket naar uw AEM ontwikkelingsinstantie door een Inhoudspakket exporteren zoals verder onderaan in de Volledige tevreden-Pakket sectie van de Synchronisatie wordt geïnstrueerd.

Na deze stappen, zou u tot /content/todo.html URL op uw AEM ontwikkelingsinstantie en u kunt wijzigingen in de code in Brackets beginnen te doen en zien hoe, na het verfrissen in Webbrowser, de veranderingen onmiddellijk aan de AEM server werden gesynchroniseerd.

Projectinstellingen

Als u de inhoud wilt synchroniseren van en naar een AEM-ontwikkelingsinstantie, moet u de projectinstellingen definiëren. Dit kan door naar AEM menu en kiezen Projectinstellingen…

chlimage_1-55

Met de projectinstellingen kunt u het volgende definiëren:

De server-URL (bijvoorbeeld http://localhost:4502)
Of servers worden getolereerd die geen geldig HTTPS-certificaat hebben (niet ingeschakeld houden, tenzij vereist)
De gebruikersnaam die wordt gebruikt voor het synchroniseren van inhoud (bijvoorbeeld admin)
Het wachtwoord van de gebruiker (bijvoorbeeld admin)

Inhoud synchroniseren

De extensie AEM Brackets biedt de volgende typen inhoudssynchronisatie voor bestanden en mappen die worden toegestaan door de filterregels die zijn gedefinieerd in filter.xml:

Geautomatiseerde synchronisatie van gewijzigde bestanden

Hiermee worden wijzigingen alleen gesynchroniseerd van haakjes naar de AEM-instantie, maar nooit andersom.

Handmatige tweerichtingssynchronisatie

Open in de Projectverkenner het contextafhankelijke menu door met de rechtermuisknop op een bestand of map te klikken, en klik op de knop Exporteren naar server of Importeren vanaf server U hebt toegang tot deze opties.

chlimage_1-56

OPMERKING

Als het geselecteerde item zich buiten het jcr_root map, de Exporteren naar server en Importeren vanaf server contextafhankelijke menu-items zijn uitgeschakeld.

Volledige synchronisatie van inhoudspakketten

In de AEM in het menu Inhoudspakket exporteren of Inhoudspakket importeren Met opties kunt u het hele project synchroniseren met de server.

chlimage_1-57

Synchronisatiestatus

De extensie AEM Brackets heeft een waarschuwingspictogram op de werkbalk rechts van het venster Brackets, waarmee de status van de laatste synchronisatie wordt aangegeven:

groen - alle bestanden zijn gesynchroniseerd
blauw - een synchronisatiebewerking wordt uitgevoerd
geel - sommige bestanden zijn niet gesynchroniseerd
rood - geen van de bestanden is gesynchroniseerd

Als u op het meldingspictogram klikt, wordt het dialoogvenster Synchronisatie-statusrapport geopend met een lijst van alle status voor elk gesynchroniseerd bestand.

chlimage_1-58

OPMERKING

Alleen inhoud die is gemarkeerd als opgenomen in de filterregels van filter.xml wordt gesynchroniseerd, ongeacht de gebruikte synchronisatiemethode.

Daarnaast .vltignore bestanden worden ondersteund om inhoud uit te sluiten van synchronisatie naar en vanuit de opslagplaats.

HTML-code bewerken

De extensie AEM Brackets beschikt ook over enkele automatische aantekeningen waarmee het schrijven van HTML-kenmerken en -expressies wordt vergemakkelijkt.

Kenmerk automatisch voltooid

Typ in een HTML-kenmerk sly. Het kenmerk wordt automatisch ingevuld bij data-sly-.
Selecteer het HTML-kenmerk in de vervolgkeuzelijst.

Automatische voltooiing van expressie

Binnen een expressie ${}, worden algemene variabelenamen automatisch ingevuld.

Meer informatie

De AEM Uitbreiding van de Brackets is een open-bronproject, dat op GitHub door Adobe Marketing Cloud organisatie, onder de Apache-licentie, versie 2.0: