Show Menu
TOPICS×

Desenvolvimento dos componentes principais

When to Use the Core Components?

Como os Componentes principais são totalmente novos e oferecem vários benefícios, é recomendável que os novos projetos AEM os usem. No caso dos projetos existentes, a migração deve fazer parte de um maior esforço de projeto, por exemplo, uma reformulação da marca ou uma reformulação global.
Portanto, a Adobe fornece as seguintes recomendações:
  • Novos projetos
    Os novos projetos devem sempre tentar usar os Componentes principais. Se os Componentes principais não puderem ser usados diretamente ou estendidos para satisfazer os requisitos do projeto, crie um componente personalizado seguindo a arquitetura do componente estabelecida nos componentes principais. Exceto quando não for possível, evite usar os componentes da fundação.
  • A
    Recomendação de projetos existentes continua usando os componentes debase, a menos que seja planejada uma refatoração de site ou componente. Dado que são amplamente utilizadas pela maioria dos projetos existentes, os componentes da fundação continuarão a ser apoiados.
  • Os novos componentes
    personalizados avaliam se um componente principal existente pode ser personalizado . Caso contrário, a recomendação é criar um novo componente personalizado seguindo as Diretrizes do componente.
  • Componentes
    personalizados existentes Se seus componentes funcionarem como esperado, mantenha-os como estão. Caso contrário, consulte "Novos componentes personalizados" acima.

Como obter sucesso com os componentes principais

Os componentes principais são poderosos, flexíveis e fáceis de usar e personalizar. Seguir algumas diretrizes principais garantirá que seu projeto com os Componentes principais seja um sucesso.

Migração para os componentes principais

Qualquer novo projeto deve ser implementado com os Componentes principais. No entanto, os projetos existentes terão normalmente implementações extensivas dos Componentes da Fundação.
Um esforço maior em um projeto existente (por exemplo, uma reformulação de marca ou refatoração geral) geralmente oferta uma chance de migrar para os Componentes principais. Para facilitar essa migração, a Adobe disponibilizou várias ferramentas de migração para incentivar a adoção dos componentes principais e da mais recente tecnologia AEM.
As Ferramentas de modernização do AEM permitem a fácil conversão de:
  • Modelos estáticos em modelos editáveis
  • Configurações de design em políticas
  • Componentes básicos em componentes principais
  • IU Clássica em IU ativada por toque
Para obter mais informações sobre o uso dessas ferramentas, consulte a documentação .
As Ferramentas de modernização do AEM são um esforço da comunidade e não são suportadas nem garantidas pela Adobe.

Suporte a componentes principais

Os componentes principais são parte integrante do AEM e são suportados como estão, nos mesmos termos e condições como se fossem fornecidos como parte do Início rápido.
Como outros recursos do produto AEM, a regra geral é: Os componentes são anunciados pela primeira vez como obsoletos e os mais antigos foram removidos para a seguinte versão do AEM. Isso dá aos clientes pelo menos um ciclo de lançamento para migrar para a nova versão do componente, antes de descartar seu suporte.
A versão de cada componente indica claramente as versões do AEM suportadas. Quando o suporte para uma versão do AEM é interrompido, o mesmo acontece com o suporte dos Componentes principais para essa versão do AEM.
Para obter detalhes sobre o suporte à personalização de componentes, consulte a página Personalizando componentes principais.

Recursos técnicos

A tabela a seguir apresenta uma visão geral das diferenças entre os componentes principais e os componentes básicos.
Para obter detalhes sobre os recursos de criação e as opções para pré-configurá-los, consulte a página de criação sobre eles .
Recurso
Componente principal
Componente básico
Implementação lógica
Java POJOs com anotações de modelos models.html Sling
Código JSP
Definição de marcação
Código JSP
Sanitização XSS
Automatizado por HTL
Principalmente manual
Nomeação de classes CSS
Convenção de nomenclatura padronizada baseada na notação BEM ( Block Element Modifier ) (a partir da versão 2.0.0)
Esquemas personalizados
Definição de diálogo
Coral 2 + Interface clássica
Saída JSON
Servlet Sling padrão
Versões
Nenhum
Testes
Testes de unidade + Testes de integração
Testes de integração
Entrega
Via Início Rápido
Licença
Proprietário da Adobe
Contribuição
Solicitação por solicitação
Não é possível
Acessibilidade
Compatível totalmente com o padrão # (https://docs.adobe.com/content/help/en/experience-manager-cloud-service/sites/authoring/fundamentals/accessible-content.html
Compatível apenas parcialmente com o padrão AA WCAG 2.0

Lista do componente

A tabela a seguir lista os Componentes principais disponíveis, vinculando à API deles e indica quais componentes básicos eles substituem.
Componente principal
Descrição
Componente(s) básico(s) substituído(s)
Página responsiva trabalhando com editor de modelo
/libs/foundation/components/page /libs/wcm/foundation/components/page
Navegação na hierarquia da página
/libs/foundation/components/breadcrumb
Título H1-H6
/libs/foundation/components/title /libs/wcm/foundation/components/title
Texto formatado
/libs/foundation/components/text /libs/foundation/components/table /libs/wcm/foundation/components/text
Carregamento inteligente e lento do tamanho de representação ideal
/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 de páginas
/libs/foundation/components/list /libs/foundation/components/mobilelist /libs/wcm/foundation/components/list
Widget de compartilhamento do Facebook e Pinterest
-
Sistema de parágrafo de formulário responsivo
/libs/foundation/components/form/start /libs/foundation/components/form/end
Campo de entrada de texto
/libs/foundation/components/form/text /libs/foundation/components/form/password
Campo de entrada de várias opções
/libs/foundation/components/form/checkbox /libs/foundation/components/form/radio /libs/foundation/components/form/dropdown
Campo de entrada oculto
/libs/foundation/components/form/hidden
Botão Enviar ou personalizar
/libs/foundation/components/form/submit
Um componente de navegação do site que lista a hierarquia da página aninhada
/libs/foundation/components/topnav /libs/foundation/components/mobiletopnav
Um alternador de idiomas e países que lista a estrutura de idiomas global
-
Um componente de pesquisa que exibe os resultados como sugestões no local em um menu suspenso
/libs/foundation/components/search
Permite que o autor do conteúdo crie com facilidade um teaser para continuar o conteúdo usando uma imagem, um título ou texto formatado e vinculando-o a outro conteúdo ou outras ações
-
Permite que o autor do conteúdo organize o conteúdo da página em várias guias
-
Permite que o autor do conteúdo organize o conteúdo em um carrossel giratório de slides
/libs/foundation/components/carousel
Permite a exibição de um fragmento de conteúdo
-
Permite exibir uma lista de fragmentos de conteúdo
-
Separa o conteúdo em uma página
-
Organizar painéis de conteúdo de uma forma flexível
-
Organizar componentes dentro de um container
-
Criar um botão em uma página
-
Adicionar um ativo baixável a uma página
-
Adicionar um fragmento de experiência a uma página
/libs/cq/experience-fragments/editor/components/experiencefragment
Incorporar um recurso externo em uma página
-
Fornecer uma representação visual do progresso em direção a uma meta
-
Apresenta um documento PDF em uma página
-

Componentes futuros

Para obter uma visão geral do futuro mapa dos componentes principais, consulte o wiki do projeto no GitHub .

Atualização dos componentes principais

Um benefício dos componentes com versão é que eles permitem separar a migração para uma nova versão do AEM da migração para novas versões de componentes. Além disso, se novas versões de componentes estiverem disponíveis, isso permitirá a migração individual de cada componente para a nova versão.
As migrações para uma nova versão do AEM não afetarão o funcionamento dos Componentes principais, desde que suas versões também suportem a nova versão do AEM para a qual estão sendo migradas. As personalizações feitas nos Componentes principais também não devem ser afetadas, contanto que elas não usem APIs que foram desaprovadas ou removidas .
As migrações para novas versões dos Componentes principais também não afetarão o modo de funcionamento do componente, mas os novos recursos poderão ser apresentados aos autores das páginas, o que pode exigir alguma configuração por um editor de modelo, caso o comportamento padrão não seja desejado. No entanto, as personalizações podem precisar ser adaptadas; para obter mais detalhes, consulte a página Personalizando componentes principais.