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

欢迎使用专为新加入的开发人员设计的多部分教程 SPA编辑器 Adobe Experience Manager (AEM)中的功能。 本教程介绍了为虚构的生活方式品牌WKND实施React应用程序的过程。 React应用程序是使用AEM SPA Editor开发和设计的,该编辑器将React组件映射到AEM组件。 部署到AEM的已完成SPA可以使用传统的AEM内联编辑工具动态创作。

已实施的最终SPA

WKND SPA实施

关于

本教程专门设计用于 AEMas a Cloud Service 并且向后兼容 AEM 6.5.4+AEM 6.4.8+.

最新代码

所有教程代码均可在上找到 GitHub.

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

前提条件

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

  • HTML、CSS和JavaScript的基础知识
  • 对的基本了解 React

虽然没有必要,但基本了解以下内容会很有帮助 开发传统AEM Sites组件.

本地开发环境 local-dev-environment

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

所需的软件

后续步骤 next-steps

你在等什么?!导航到 创建项目 章中,并了解如何使用SPA项目原型生成启用AEM编辑器的项目。

recommendation-more-help
e25b6834-e87f-4ff3-ba56-4cd16cdfdec4