在AEM中创建您的第一个React SPA

欢迎使用多部分教程,该教程专为不熟悉Adobe Experience Manager(AEM)中​SPA Editor​功能的开发人员设计。 本教程将指导您实施React应用程序,以打造虚构的生活方式品牌WKND。 React应用程序将开发并设计为与AEM SPA Editor一起部署,React Editor可将React组件映射到AEM组件。 部署到AEM的已完成SPA可以使用AEM的传统在线编辑工具进行动态创作。

已实施最终SPA

WKND SPA实施

关于

本教程旨在将​AEM用作Cloud Service,并且向后兼容​AEM 6.5.4+​和​AEM 6.4.8+

最新代码

所有教程代码都可以在GitHub上找到。

最新代码库可作为可下载的AEM包提供。

前提条件

在启动本教程之前,您需要满足以下条件:

  • HTML、CSS和JavaScript的基本知识
  • React的基本熟悉

虽然不需要,但对开发传统的AEM Sites组件有基 本的了解

本地开发环境

要完成本教程,需要本地开发环境。 屏幕截图和视频是使用AEM作为Cloud ServiceSDK捕获的,该SDK在Mac OS环境中运行,并且IDE为Visual Studio代码。 除非另有说明,否则命令和代码应独立于本地操作系统。

所需软件

注意

初次使用AEM as aCloud Service? 请参阅以 下指南,以使用AEM as a Cloud ServiceSDK设置本地开发环境

AEM 6.5的新增功能? 请参阅以 下指南以设置本地开发环境

后续步骤

你在等什么?!通过导航到创建项目章节来启动教程,并了解如何使用AEM项目原型生成启用了SPA Editor的项目。

在此页面上