6 best practice per progetti di siti web in Adobe Experience Manager (AEM)

Ma come accade con ogni prodotto di così ampia portata, è anche molto facile prendere decisioni sbagliate. AEM è un prodotto estremamente flessibile che consente numerose personalizzazioni. Questo significa che qualsiasi requisito può essere implementato in diversi modi, che vanno da una soluzione personalizzata per il cliente a una strettamente in linea con i principi fondamentali del prodotto.

La nostra ampia esperienza nell'implementazione di AEM e di sistemi di gestione dei contenuti web aziendali in generale ci ha permesso di comprendere le sfide che possono sorgere quando si decide di seguire una delle diverse opzioni di soluzione disponibili. Oltre all'architettura della soluzione e alle possibili complessità tecniche, è fondamentale considerare anche gli aspetti legati al rapporto costo-efficacia, alla manutenibilità e alla sicurezza futura del proprio sistema.

In questo post metteremo in evidenza alcuni dei fattori chiave che dovrebbero essere tenuti in considerazione nell’implementazione di AEM.

#1 Progettazione e architettura

Il primo passo della progettazione e dell’architettura di un sito web dovrebbe consistere in una valutazione dettagliata di ciascun requisito e nell'allineamento immediato con le funzionalità standard. La prototipazione può essere utilizzata per presentare soluzioni alternative agli utenti aziendali e per dimostrare determinate funzionalità già pronte all'uso. Nella maggior parte dei casi, è possibile migliorare l'efficienza apportando leggere modifiche ai requisiti iniziali.

Alcuni esempi:

• Sfruttare il framework di configurazione Context-Aware per far sì che le sottoparti del sito web appaiano e si comportino in modo diverso;
• Rendering di elenchi di documenti provenienti da sistemi esterni attraverso il framework Sling Dynamic Include in modo che le pagine che li contengono rimangano memorizzate nella cache;
• Utilizzo di Sling Resource Merger per evitare la duplicazione di componenti pronti all'uso;
• Eliminazione del CSS reattivo e utilizzo delle sue funzionalità all'interno di AEM;
• Implementa determinati requisiti al di fuori di AEM, ad esempio integrandosi con (micro)servizi esterni. Questa è la chiave per evitare un uso improprio di AEM come sistema di gestione dei contenuti web (WCMS);
• Fai in modo che oltre il 95% delle richieste siano memorizzabili nella cache, assicurando prestazioni elevate.

#2 Componenti principali

Alcuni anni fa, Adobe ha avviato un'iniziativa denominata WCM Core Components. L'obiettivo era abbandonare i vecchi “Componenti di Fondazione” divenuti ormai obsoleti e fornire invece una robusta libreria di componenti su cui poter basare ogni progetto.

Questa libreria di componenti principali fornisce agli utenti aziendali una serie di elementi costitutivi di alta qualità per creare pagine web avanzate. Partendo dagli stessi principi, abbiamo sviluppato il nostro set di componenti (specifici per il progetto). Questo significa anche che partecipiamo attivamente allo sviluppo dei componenti principali per migliorarli costantemente.

Utilizzando questi componenti e adottando i concetti su cui si basano, possiamo creare basi di codice estremamente flessibili e aggiornare i componenti uno alla volta senza compromettere la compatibilità con le versioni precedenti.

#3 Modelli modificabili

In passato, era responsabilità dello sviluppatore mettere a disposizione degli utenti aziendali una serie di modelli di pagina. Per consentire a un autore di contenuti di utilizzare un modello specifico, questo doveva essere prima implementato e distribuito su AEM da uno sviluppatore. Ciò si è spesso tradotto in un aumento del time-to-market.

Negli ultimi anni, tuttavia, in AEM è stata introdotta la funzionalità “Modelli modificabili” al fine di ridurre la dipendenza dall’IT durante la creazione delle pagine. "Modelli modificabili" consente agli autori di contenuti di assemblare i modelli da soli tramite l'interfaccia utente AEM Touch.

#4 Griglia reattiva e sistema di stili

Grazie alle griglie reattive, gli utenti aziendali possono gestire in modo flessibile i layout delle pagine e il comportamento dei componenti. In combinazione con il sistema di stili di AEM, permettono di applicare stili predefiniti senza sacrificare la coerenza tra le pagine.

La procedura tradizionale per rendere il contenuto reattivo prevedeva che un designer creasse mockup per i diversi punti di interruzione, che lo sviluppatore li implementasse per un modello specifico e che l'autore scegliesse quel modello e inserisse il contenuto. Grazie alle Griglie Reattive, questo flusso di lavoro è stato notevolmente semplificato: l'autore può inserire il contenuto e personalizzare il layout in modo autonomo, senza dover consultare uno sviluppatore a proposito della reattività o attendere nuove implementazioni. Questa funzionalità, introdotta in AEM 6.3, garantisce flessibilità agli utenti aziendali senza richiedere agli sviluppatori di svolgere tali compiti. Infine, per modificare un modello non è richiesto alcuno sforzo di sviluppo (e distribuzione).

Tuttavia, questa flessibilità ha un costo: ora gli utenti aziendali devono occuparsi delle impostazioni di layout dei componenti sulle pagine, il che può richiedere un notevole impegno. Spesso è preferibile trovare un compromesso in cui alcune impostazioni del layout sono fisse, mentre altre rimangono flessibili. Siamo qui per aiutarti a trovare l'equilibrio giusto.

#5 Migliori pratiche di sviluppo web

Inoltre, esistono linee guida generali di sviluppo e standard tecnici specifici di AEM che applichiamo a tutti i progetti AEM. Eccone alcuni:

• Chi causa il malfunzionamento della build, è responsabile di correggerlo;
• Sono richiesti test unitari e test di integrazione per ogni nuova funzionalità;
• Le richieste di merge devono essere inviate quando una funzionalità è completata;
• La revisione tra pari deve essere effettuata da un responsabile tecnico;
• I modelli Sling devono essere utilizzati per lo sviluppo dei componenti, anche se questi sono molto semplici;
• Utilizza il pattern del componente proxy;
• La documentazione utente e tecnica deve essere sempre aggiornata;
• Il codice deve essere testato su AEM, così come tramite il Dispatcher;
• È vietata la duplicazione del codice, le regole di SonarQube devono essere configurate, ogni build attiva una scansione di SonarQube, ecc.

#6 Totale automazione

Per migliorare la qualità del nostro lavoro, ci sforziamo di massimizzare l’automazione. Nelle installazioni locali di AEM 6.5, utilizziamo la metodologia Infrastruttura come codice per automatizzare la configurazione dei server e degli ambienti locali. Ciò significa che qualsiasi sviluppatore può essere operativo in pochi minuti, lavorando in un ambiente locale il più vicino possibile alla produzione. Questa configurazione include anche un'istanza locale di Dispatcher, per assicurarci di individuare tempestivamente eventuali problemi legati alla cache.

Nelle installazioni di AEM-as-a-Cloud-Service, Adobe Cloud Manager permette di automatizzare gli aggiornamenti, le correzioni di sicurezza e le release, il tutto combinato con valutazioni di qualità predefinite e personalizzate.

Ogni volta che una modifica al codice viene archiviata nel controllo versione, viene eseguita una build avvisando immediatamente gli sviluppatori in caso di problemi. A seconda del branch, verrà effettuata una distribuzione nell'ambiente applicabile, in modo che le modifiche siano immediatamente presenti sul sistema corretto.

Seguendo questi principi, effettuiamo le release in modo completamente automatizzato. La distribuzione in produzione avviene con la semplice pressione di un pulsante.

Conclusione

Conoscere le più recenti linee guida specifiche per lo sviluppo di siti web nel WCMS con cui stai lavorando è fondamentale. Ma, cosa forse ancora più importante, poter contare su un partner che le conosca e le applichi all'interno del team di progetto è essenziale per garantire il successo del tuo progetto di esperienza digitale. Queste linee guida non sono utili solo quando si creano nuovi siti web, ma anche quando si pianificano aggiornamenti o un'espansione della piattaforma Adobe esistente.