Table of Contents

Open all
Close all
Preface
15
Purpose of This Book
15
Target Audience
16
Structure of This Book
16
Acknowledgments
18
Stefan Haas
19
Bince Mathew
19
PART I SAP S/4HANA and SAP Fiori
21
1 SAP S/4HANA Architecture
23
1.1 Core Architecture
23
1.1.1 Overview
24
1.1.2 OData
25
1.1.3 SAP HANA
26
1.1.4 SAP NetWeaver ABAP
27
1.1.5 SAP Fiori Front-end Server Based on SAP NetWeaver Gateway
27
1.1.6 SAPUI5
28
1.1.7 SAP Fiori Launchpad
28
1.2 Backend
29
1.2.1 Virtual Data Model
29
1.2.2 The Transactional Architecture (BOPF)
37
1.2.3 Analytics
40
1.3 User Experience
41
1.3.1 SAP Fiori
42
1.3.2 SAP Fiori Launchpad
42
1.4 SAP S/4HANA Editions
42
1.4.1 On-Premise Architecture
42
1.4.2 Cloud Architecture
43
1.4.3 Release Strategies
45
1.5 SAP Cloud Platform
46
1.6 Summary
47
2 SAP Fiori and the Design-Led Development Process
49
2.1 What Is SAP Fiori?
49
2.1.1 SAP Fiori 1.0
50
2.1.2 SAP Fiori 2.0
51
2.1.3 Design Principles
52
2.1.4 Responsiveness and Adaptiveness
54
2.1.5 SAP Fiori Launchpad
54
2.2 Design-Led Development Process
62
2.2.1 Discover
63
2.2.2 Design
64
2.2.3 Develop
64
2.3 Different SAP Fiori App Types
64
2.3.1 Freestyle
64
2.3.2 SAP Fiori Elements
65
2.4 Prototyping Tools
77
2.4.1 Axure
78
2.4.2 SAP Build
78
2.4.3 Building a Prototype Using the SAP Build Tool
80
2.5 Summary
94
3 ABAP Programing Model for SAP Fiori
95
3.1 Core Data Services
95
3.2 SAP Gateway
97
3.3 OData
99
3.3.1 Overview
99
3.3.2 OData Service Creation
101
3.4 Service Adaptation Description Language
109
3.4.1 Data Model Definition Phase
110
3.4.2 Service Implementation Phase
111
3.5 Business Object Processing Framework
113
3.5.1 Read-Only Application with Quick Actions
113
3.5.2 New Application without Draft
114
3.5.3 Draft-Enabled Application
115
3.5.4 New Application with Draft
115
3.6 SAP Fiori
116
3.7 Summary
117
PART II Developing Applications for SAP S/4HANA
119
4 Developing an SAP Fiori Elements List Report and Object Page
121
4.1 Core Data Services Views
121
4.1.1 ABAP Development Tools in Eclipse
122
4.1.2 Introduction to the Data Model
125
4.1.3 Creating Basic Interface Core Data Services Views
130
4.1.4 Adding Calculated Fields
136
4.1.5 Adding Data Control Language Files
146
4.2 Transactional Processing with the Business Object Processing Framework
150
4.2.1 Generating a BOPF Business Object from a CDS Model
150
4.2.2 Testing Business Object Nodes
155
4.2.3 Creating a Quick Action Using Business Object Processing Framework
156
4.3 Virtual Elements in Core Data Services
160
4.3.1 Adding a Virtual Element to a Core Data Services View
160
4.3.2 Implementing an ABAP Code Exit to Populate the Virtual Element
160
4.4 Creating an OData Service
161
4.4.1 Auto-Exposing the OData Service
161
4.4.2 Activating the OData Service on the SAP Gateway Hub System
162
4.4.3 Testing the OData Service Using the SAP Gateway Client
164
4.5 Adding User Interface Annotations
164
4.5.1 Creating a Metadata Extension File
165
4.5.2 User Interface-Relevant Annotations for the List Report
166
4.5.3 User Interface Annotations for the Object Page
172
4.6 Generating a List Report Template in SAP Web IDE Full-Stack
177
4.7 Extending the User Interface
181
4.7.1 Implementing User Interface Extensions via Breakout
181
4.7.2 Adding a QUnit Unit Test
184
4.8 List Report Application versus Worklist Application
187
4.9 Summary
187
5 Developing an Overview Page
189
5.1 Core Data Services Views
189
5.1.1 Creating a Simple Core Data Services View
190
5.1.2 Adding a Data Control File
199
5.2 Adding User Interface Annotations
199
5.2.1 Creating Annotations for an Analytical Card
200
5.2.2 Creating Annotations for a List Card
202
5.3 Creating an OData Service
206
5.3.1 Creating the OData Project
206
5.3.2 Adding Overview Page Card CDS Views into the Project
206
5.4 Exposing CDS Views as an OData Service
208
5.4.1 Importing the OData Service
208
5.4.2 Registering the OData Service
209
5.5 Generating an Overview Page Template Project in SAP Web IDE
210
5.5.1 Generating the Basic Overview Page Layout
210
5.5.2 Adding the List Analytical Card
215
5.5.3 Adding the Standard List Card
218
5.5.4 Adding the Bar List Card
220
5.5.5 Adding the Table Card
222
5.5.6 Overview Page Output
224
5.6 Summary
225
6 Developing an Analytical List Page
227
6.1 Introduction
227
6.2 Building the Required CDS Views
227
6.2.1 Building Dimension Views
229
6.2.2 Building Cube Views
229
6.2.3 Building the Main Query View
231
6.3 Configuring the Title Area
232
6.4 Configuring the Filter Area
236
6.5 Configuring the Content Area
239
6.5.1 Configuring the Default Chart
239
6.5.2 Configuring the Table
241
6.6 Combining All the UI Annotations in the Metadata Extension View
243
6.7 Generating an Analytical List Page from SAP Web IDE
247
6.7.1 Adding Key Performance Indicators to the Project
251
6.7.2 Adding Visual Filters to the Project
253
6.8 Summary
259
7 Developing a Freestyle Application
261
7.1 Smart Controls
261
7.1.1 Smart Field
262
7.1.2 Smart Link
263
7.1.3 Smart Form
264
7.1.4 Smart Table
266
7.1.5 Smart Filter Bar
268
7.2 Application Development with the SAP Web IDE Full-Stack
270
7.2.1 Setting Up an OData Service
270
7.2.2 Object Creation Page Using Smart Fields and Forms
276
7.2.3 List Report Page Using Smart Table and Filter Bar
283
7.2.4 Add an OPA5 Integration Test
285
7.3 Summary
295
8 Deploying Applications to the SAP Fiori Launchpad
297
8.1 Uploading a User Interface to the ABAP Frontend Server
297
8.1.1 Deploying Applications from SAP Web IDE
297
8.1.2 Uploading Applications Directly into the Frontend Server
300
8.2 SAP Fiori Launchpad Admin Page
304
8.2.1 Catalogs
305
8.2.2 Groups
306
8.2.3 Roles
306
8.3 Creating the Technical Catalog and Business Catalog
307
8.4 Creating the Application Tiles
309
8.5 Creating Groups for Application Tiles
320
8.6 Creating and Assigning a Transaction PFCG Role to Users
322
8.7 Setting Up Intent-Based Cross-Application Navigation from OVP to LRP
329
8.8 Summary
331
PART III Operating Applications
333
9 Version Control in SAP Web IDE Using Git
335
9.1 Git Introduction
335
9.2 Git Basics
335
9.2.1 Creating Initial Project Repositories Using GitHub
337
9.2.2 Initializing the Local Repository for the Projects in SAP Web IDE
339
9.2.3 Linking the Local Repository with the Remote Repository in GitHub
340
9.2.4 Submitting Code to Repository (Stage, Commit, Push)
341
9.2.5 Cloning the Project into SAP Web IDE
347
9.2.6 Getting Code from the Remote Branch (Fetch, Merge, Pull)
350
9.2.7 Working with Branches
355
9.3 Summary
360
10 Automated Testing
361
10.1 Backend Test Automation
363
10.1.1 Unit Testing (ABAP Unit)
364
10.1.2 Unit Testing (Core Data Services Test Double Framework)
376
10.2 Frontend Test Automation
380
10.2.1 Unit Testing (QUnit)
381
10.3 End-to-End Test Automation Tools
386
10.3.1 Setting Up Nightwatch.js
387
10.3.2 Creating the Create Purchase Document End-to-End Nightwatch.js Test
388
10.3.3 Running the Create Purchase Document End-to-End Nightwatch.js Test
389
10.4 Summary
390
11 Continuous Integration
393
11.1 Introduction
394
11.1.1 Continuous Integration
394
11.1.2 Continuous Delivery
395
11.1.3 Continuous Deployment
396
11.2 Setting Up a Continuous Integration Pipeline for SAPUI5 on the ABAP Server
397
11.2.1 Setting Up a Local Jenkins Automation Server
398
11.2.2 Creating an Initial Jenkinsfile
400
11.2.3 Creating the Continuous Deployment Pipeline
401
11.2.4 SAPUI5 Grunt Plug-ins
403
11.2.5 Implementing the Build Stage
404
11.2.6 Automatically Triggering Builds on Git Push
407
11.2.7 Implementing the Test Stage
408
11.2.8 Implementing the Deploy Stage
411
11.3 Continuous Integration on the ABAP Server
414
11.3.1 Quality Checking Using the ABAP Test Cockpit
415
11.3.2 Scheduling ABAP Unit Tests Using the ABAP Unit Runner
418
11.4 Summary
421
Appendices
423
A Developing Applications on the SAP Cloud Platform
423
A.1 Introduction to SAP Cloud Platform
423
A.2 SAP Cloud Platform Application Programming Model
424
A.3 Developing an App on SAP Cloud Platform Using SAP Web IDE Full-Stack
426
A.4 Summary
451
B The Authors
453
Index
455