在AEM中创建您的第一个React SPA overview
欢迎使用专为Adobe Experience Manager (AEM)中 SPA编辑器 功能的新手开发人员设计的多部分教程。 本教程介绍了为虚构的生活方式品牌WKND实施React应用程序的过程。 React应用程序是使用AEM SPA Editor开发和设计的,该编辑器将React组件映射到AEM组件。 部署到AEM的已完成SPA可以使用传统的AEM内联编辑工具动态创作。
WKND SPA实现
关于
此教程设计为使用 AEM as a Cloud Service,并且向后兼容 AEM 6.5.4+ 和 AEM 6.4.8+。
最新代码
可在GitHub上找到所有教程代码。
最新的代码库可用作可下载的AEM包。
先决条件
在开始本教程之前,您需要满足以下条件:
- HTML、CSS和JavaScript的基础知识
- 对React的基本了解
虽然不是必需的,但对开发传统AEM Sites组件有基本的了解是有益的。
本地开发环境 local-dev-environment
需要本地开发环境来完成本教程。 使用在Mac OS环境中运行的AEM as a Cloud Service SDK捕获屏幕截图和视频,并将Visual Studio Code用作IDE。 除非另有说明,否则命令和代码应独立于本地操作系统。
所需的软件
- AEM as a Cloud Service SDK、AEM 6.5.4+或AEM 6.4.8+
- Java
- Apache Maven (3.3.9或更高版本)
- Node.js和npm
NOTE
是AEM as a Cloud Service的新用户? 请查看以下指南,了解如何使用AEM as a Cloud Service SDK设置本地开发环境。
还不熟悉AEM 6.5? 请查看以下指南以设置本地开发环境。
后续步骤 next-steps
你在等什么?!导航到创建项目一章,开始学习如何使用SPA项目原型生成启用AEM编辑器的项目。
recommendation-more-help
e25b6834-e87f-4ff3-ba56-4cd16cdfdec4