[JavaScript知识库]SAP Fiori 的学习路线指南

以下是我在 SAP 成都研究院工作 15 年根据自己工作中积累的经验，总结出的 Fiori 学习路线指南，纯属个人观点，不代表 SAP 公司。

1. 什么是 SAP Fiori，什么是 SAP UI5，二者的关系如何。Fiori 1.0，2.0 和 3.0 的演进：介绍 SAP Fiori 和 SAP UI5 这两个初学者容易混淆概念的区别和联系，介绍 Fiori 和 UI5 的发展历史，前世今生。

2. 从一个 Hello World 应用开始接触 SAP UI5 ：通过一个 Hello World 级别的 SAP UI5 应用，了解其组成部分。

3. SAP UI5 应用的加载和引导过程分析：将前一单元 Hello World UI5 应用的 url 粘贴到浏览器地址栏里回车，背后发生了什么？

4. SAP UI5 控件学习：SAP UI5 包含一个庞大的适用于企业级前端应用的控件库。通过一个简单的例子，学习 SAP UI5 控件的组成部分和应用场合。

5. SAP UI5 XML 视图学习：SAP UI5 支持 JavaScript 视图和 XML 视图。然而几乎所有 SAP 标准产品都选择了 XML 视图而不是 JavaScript 视图。背后的原因是什么？

6. SAP UI5 控制器学习：SAP UI5 MVC 框架中的 C - Controller 的深入学习。

7. SAP UI5 Module 学习：很多编程语言和技术框架都有 Module(模块)的概念。 SAP UI5 也不例外，引用 Module 需要解决的领域问题是什么？

8. SAP UI5 JSON 模型学习：SAP UI5 应用支持 JSON，Resource 和 OData 三大数据模型。我们先从较简单较容易理解的 JSON 模型入手。

9. SAP UI5 多语言支持(internationalization)：从 SAP UI5 Resource 模型学习其支持 internationalization 的原理。

10. SAP UI5 Component 学习：要想将 SAP UI5 应用配置到 Fiori Launchpad 里成为一个 tile，像 SAP 标准产品 UI 一样的方式被访问，Component 必不可少。

11. 什么是 SAP UI5 应用描述符：另一个将 SAP UI5 应用配置到 Fiori Launchpad 不可或缺的组件。

12. SAP UI5 里的 CSS 处理：SAP UI5 标准和自定义的 CSS 处理机制学习。

13. SAP UI5 的嵌入视图，对话框和 fragment：实现 SAP UI5 视图层可重用性的利器。

14. SAP UI5 的数据绑定(一)：数据绑定是前端框架中的重头戏，也是开发人员学习的重点和难点。

15. SAP UI5 的数据绑定(二)：SAP UI5 数据绑定的一些高级内容，绑定模式，复合绑定，绑定表达式等概念的学习。

16. SAP UI5 的格式器，filter，Sort 和 Group 操作

17. SAP UI5 OData 模型：UI5 + OData 是包括 S/4HANA 这一 SAP 旗舰级产品里前端开发的标准讨论，OData 模型的重要性不言而喻。

18. SAP UI5 开发中的跨域问题：跨域问题是前端开发人员永远无法回避的一个问题。本单元介绍 SAP UI5 提供了哪些可以解决跨域问题的解决方案。

19. SAP UI5 的 Mock 服务器 - 本地开发的一个利器，可以隔离同后端真实 OData 服务的依赖。

20. SAP UI5 的 QUnit 和 OPA - SAP 官方的 UI5 单元测试和集成测试工具介绍。

21. SAP UI5 路由设计(一) - 路由(routing)是前端开发框架中另一个重要的知识点。

22. SAP UI5 路由设计(二)

23. SAP UI5 自定义控件开发 - SAP UI5 强大的 Extensibility 体现之一，就是对自定义控件的支持。

24. 如何把 SAP UI5 部署到 ABAP 服务器 - S/4HANA 里的 Fiori 应用，本质就是 SAP UI5 部署在 ABAP 服务器的。本单元学习如何将本地开发的 SAP UI5 应用部署到 ABAP 服务器上。

25. 如何把 SAP UI5 部署到 SAP BTP 平台 - SAP UI5 和 SAP 云平台的亲密接触。

26. SAP UI5 应用的错误排查(Chrome 开发者工具 + UI5 inspector) - 工欲善其事，必先利其器。探索 Chrome 开发者工具本身提供的强大功能。

27. SAP UI5 应用的错误排查(SAP UI5 自带的诊断工具) - 学习 SAP UI5 自带的问题诊断工具。

28. SAP UI5 应用的本地构建 - 揭开 component-preload.js 的神秘面纱。

29. 如何使用 SAP UI5 调用本机摄像头实现条形码扫描功能 - SAP UI5 使用 JavaScript 调用本机硬件的一个实际例子。

30. 将 SAP UI5 应用构建成 Cordova 混合应用 - SAP UI5 移动开发初探。

31. SAP UI5 本地 Launchpad 的开发 - 如何本地开发一个仿 S/4HANA 使用的 Fiori Launchpad.

32. SAP UI5 输入校验机制的实现 - 标准校验机制和自定义校验机制的学习。

33. 待续

从 Jerry 这个教程可以循序渐进的学习这些内容。

一套适合 SAP UI5 开发人员循序渐进的学习教程