Crie seu primeiro SPA React em AEM

Bem-vindo a um tutorial de várias partes criado para desenvolvedores novos no recurso SPA Editor no Adobe Experience Manager (AEM). Este tutorial aborda a implementação de um aplicativo React para uma marca fictícia de estilo de vida, a WKND. O aplicativo React será desenvolvido e projetado para ser implantado com AEM Editor de SPA, que mapeia os componentes React para AEM componentes. O SPA concluído, implantado em AEM, pode ser criado dinamicamente com as ferramentas tradicionais de edição em linha do AEM.

Implementação de SPA WKND

Sobre

O tutorial foi projetado para funcionar com AEM como um Cloud Service e é compatível com versões anteriores com AEM 6.5.4+ e AEM 6.4.8+.

Código mais recente

Todo o código tutorial pode ser encontrado em GitHub.

O base de código mais recente está disponível como Pacotes de AEM para download.

Pré-requisitos

Antes de iniciar este tutorial, você precisará do seguinte:

• Um conhecimento básico de HTML, CSS e JavaScript
• Familiaridade básica com React

Embora não seja obrigatório, é benéfico ter uma compreensão básica do desenvolvimento de componentes AEM Sites tradicionais.

Ambiente de desenvolvimento local

Um ambiente de desenvolvimento local é necessário para concluir este tutorial. Capturas de tela e vídeo são capturados usando o AEM como um Cloud Service SDK em execução em um ambiente Mac OS com o Visual Studio Code como o IDE. Os comandos e o código devem ser independentes do sistema operacional local, salvo indicação em contrário.

Software necessário

• AEM como SDK do Cloud Service, AEM 6.5.4+ ou AEM 6.4.8+
• Java
• Apache Maven (3.3.9 ou mais recente)
• Node. jand npm

Próximas etapas

O que você está esperando?! Inicie o tutorial navegando até o capítulo Criar projeto e saiba como gerar um projeto habilitado para o Editor de SPA usando o Arquétipo de projeto AEM.