Crie seu primeiro SPA React em AEM

Bem-vindo a um tutorial de várias partes criado para desenvolvedores novos no Editor de SPA 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 é desenvolvido e projetado para ser implantado com AEM Editor de SPA, que mapeia 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.

SPA Final Implementado

Implementação de SPA WKND

Sobre

O tutorial foi projetado para funcionar com AEM as a Cloud Service e é compatível com versões anteriores do 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 baixáveis.

Pré-requisitos

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

  • Um conhecimento básico sobre HTML, CSS e JavaScript
  • Familiaridade básica com Reagir

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

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 SDK as a Cloud Service AEM executado em um ambiente do sistema operacional Mac com Código do Visual Studio como IDE. Os comandos e o código devem ser independentes do sistema operacional local, salvo indicação em contrário.

Software necessário

Próximas etapas

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

Nesta página