Table of Contents

Open all
Close all
Preface
15
Objective and Target Audience
15
How to Read This Book
16
Part I Basics
19
1 Why SAP Fiori Elements?
21
1.1 Historical Development of User Interfaces at SAP
22
1.1.1 Emergence of Web Interfaces
23
1.1.2 Implementation of SAPUI5 and SAP Fiori
24
1.1.3 Templates for Recurring Requirements
27
1.2 Requirements for User Interfaces in SAP On-Premise and Cloud Products
32
1.2.1 On-Premise and Cloud Products
32
1.2.2 Consistent User Experience
32
1.3 Low-Code Development
35
1.4 Example Application
36
1.5 Summary
37
2 Overview of SAPUI5 and SAP Fiori
39
2.1 Introduction to SAPUI5
39
2.1.1 Comparison with Other Frameworks
40
2.1.2 Release Cycle
40
2.1.3 Responsive Design
40
2.1.4 Model View Controller
40
2.2 Standardized Development with SAP Fiori
43
2.2.1 SAPUI5 or SAP Fiori?
44
2.2.2 Versions of SAP Fiori
46
2.2.3 SAP Fiori Design Guidelines
49
2.2.4 SAP Fiori Launchpad
51
2.2.5 Extension Concept
58
2.3 Summary
63
3 OData: The Basis of All SAP Fiori Elements Applications
65
3.1 Introduction to the OData Standard
66
3.2 CRUDQ Methods
70
3.2.1 Query
71
3.2.2 Read
73
3.2.3 Delete
76
3.2.4 Create
76
3.2.5 Update
78
3.3 Filtering, Sorting, and Other Functions
78
3.3.1 Filtering
79
3.3.2 Sorting
83
3.3.3 Expand
83
3.3.4 Pagination
84
3.3.5 Formatting the Response
84
3.3.6 Select
84
3.3.7 Inlinecount and Count
85
3.4 Managing OData Services in the SAP System
85
3.5 OData and Core Data Services Annotations
92
3.6 Summary
95
4 Programming Models
97
4.1 Why Do We Need New Programming Models for the Cloud?
98
4.2 SAP Cloud Application Programming Model
100
4.3 ABAP RESTful Application Programming Model
110
4.4 Summary
115
5 Development Tools
117
5.1 Cloud Development Environments
117
5.1.1 SAP Web IDE Full-Stack
117
5.1.2 SAP Business Application Studio
125
5.2 Local Development Environments
134
5.2.1 SAP Web IDE, Personal Edition
135
5.2.2 Eclipse
140
5.2.3 Visual Studio Code
145
5.3 Summary
147
Part II Developing Applications with Floorplan Templates
149
6 Introduction to Floorplans and Application Scenarios
151
6.1 Available Floorplans
151
6.1.1 Overview Page
152
6.1.2 Floorplans for Lists
154
6.1.3 Object Page
158
6.2 Use Cases for the Floorplans
159
6.3 Generic Annotations
160
6.3.1 UI.HeaderInfo
161
6.3.2 UI.selectionField
161
6.3.3 UI.lineItem
162
6.3.4 UI.hidden
162
6.4 Summary
162
7 Overview Page
163
7.1 Introduction
163
7.1.1 Structure of an Overview Page
163
7.1.2 Using Overview Pages
169
7.2 Annotations for Overview Pages
172
7.3 Core Data Services Views for Overview Pages
173
7.4 Developing an Overview Page in SAP Business Application Studio
175
7.4.1 Create a Project
175
7.4.2 Add a Table Card
178
7.4.3 Add an Analytical Card
183
7.4.4 Add a List Card
188
7.4.5 Add a Stack Card
191
7.5 Developing an Overview Page in SAP Web IDE
193
7.5.1 Create a Project
193
7.5.2 Define Cards
196
7.6 Summary
198
8 List Report and Worklist
199
8.1 Introduction
199
8.1.1 Dynamic Page Header
200
8.1.2 Content Area
202
8.1.3 Footer Toolbar
208
8.2 Annotations for List Reports and Worklists
209
8.2.1 Annotations for List Reports
210
8.2.2 Annotations for Worklists
210
8.3 Development of a List Report in SAP Web IDE
211
8.3.1 Create a Project
211
8.3.2 Maintaining Annotations in the Core Data Services View
215
8.3.3 Maintaining Annotations Locally
219
8.4 Developing a List Report in SAP Business Application Studio
222
8.4.1 Create a Project
222
8.4.2 Maintain Annotations
226
8.5 Developing a Worklist in SAP Business Application Studio
227
8.5.1 Create a Project
228
8.5.2 Maintaining Annotations Locally
230
8.6 Summary
235
9 Analytical List Page
237
9.1 Introduction
238
9.1.1 Overview
238
9.1.2 Header
241
9.1.3 Content Area
244
9.2 Annotations for Analytical List Pages
245
9.3 Core Data Services Views for Analytical List Page
249
9.4 Developing Analytical List Pages in SAP Business Application Studio
252
9.4.1 Create a Project
252
9.4.2 Define a Visual Filter
255
9.4.3 Display Key Performance Indicators
259
9.5 Developing an Analytical List Page in SAP Web IDE
264
9.6 Further Development of the Analytical List Page
267
9.7 Summary
270
10 Object Page
271
10.1 Introduction
271
10.1.1 Header
272
10.1.2 Content Area
274
10.1.3 Footer Toolbar
276
10.2 Annotations for the Object Pages
277
10.2.1 Header Annotations
277
10.2.2 Annotations for Facets in the Header and Content Area Sections
280
10.2.3 Semantic Annotations
285
10.3 Core Data Services View for an Object Page
288
10.4 Development of an Object Page in SAP Web IDE
289
10.5 Development of an Object Page in SAP Business Application Studio
297
10.6 Summary
302
Part III Additional Concepts
303
11 Deployment
305
11.1 Continuous Integration and Continuous Delivery
305
11.2 Deployment Options
307
11.2.1 On-Premise Deployment
308
11.2.2 Cloud Deployment
311
11.2.3 Mobile Deployment
314
11.3 Configuring SAP Fiori Launchpad
316
11.3.1 On-Premise Configuration
317
11.3.2 Configuration in the SAP BTP, Neo Environment
327
11.3.3 Configuration in the SAP BTP, Cloud Foundry Environment
332
11.4 Summary
337
12 Extensions
339
12.1 Developing with Guided Development
340
12.2 Extending Overview Pages
345
12.2.1 Adding a Custom Filter
345
12.2.2 Developing a User-Specific Card
351
12.3 Extending List Reports
355
12.3.1 Adding a User-Specific Action
356
12.3.2 Adding a User-Specific Filter
359
12.4 Extending Object Pages
361
12.5 Extending Analytical List Pages
364
12.5.1 Adding Default Filters
364
12.5.2 Adding a User-Specific Filter
366
12.6 Implementing an Adaption Project
370
12.6.1 Overview
370
12.6.2 Creating an Adaption Project
371
12.6.3 Building Extensions in the Graphical Editor
374
12.6.4 Deploying an Adaption Project
379
12.7 Summary
383
13 Navigation
385
13.1 Internal Navigation
385
13.1.1 General Annotations for Navigation
386
13.1.2 Methods of Declaring Navigation
387
13.2 External Navigation
391
13.2.1 General Annotations for Navigation
391
13.2.2 Methods of Declaring Navigation
393
13.2.3 Open Navigation Target in a New Browser Tab
395
13.3 Summary
396
A Important Annotations
397
A.1 User Interface Annotations
397
A.2 Analytics Annotations
399
A.3 Consumption Annotations
399
A.4 Common Annotations
400
A.5 Semantics Annotations
400
B The Authors
403
Index
405