Preface

15

Purpose of This Book

15

Target Audience

16

Structure of This Book

16

Acknowledgments

19

Stefan Haas

19

Bince Mathew

19

1 SAP S/4HANA Architecture

23

1.1 Core Architecture

23

1.1.1 Overview

24

1.1.2 Open Data Protocol (OData)

26

1.1.3 SAP HANA

26

1.1.4 SAP NetWeaver Application Server for ABAP

27

1.1.5 SAP Fiori Frontend Server Based on SAP NetWeaver Gateway

29

1.1.6 SAPUI5

30

1.1.7 SAP Fiori Launchpad

30

1.2 Backend

31

1.2.1 Virtual Data Model

31

1.2.2 ABAP Programming Model for SAP Fiori

39

1.2.3 ABAP RESTful Programming Model

42

1.2.4 Analytics

45

1.3 User Experience

47

1.3.1 SAP Fiori

47

1.3.2 SAP Fiori Launchpad

47

1.4 SAP S/4HANA Editions

48

1.4.1 On-Premise Architecture

48

1.4.2 Cloud Architecture

48

1.4.3 Release Strategies

50

1.5 SAP Cloud Platform

51

1.6 Summary

53

2 SAP Fiori and the Design-Led Development Process

55

2.1 What Is SAP Fiori?

55

2.1.1 SAP Fiori 1.0

56

2.1.2 SAP Fiori 2.0

57

2.1.3 SAP Fiori 3.0

58

2.1.4 Design Principles

64

2.1.5 Responsiveness and Adaptiveness

66

2.1.6 SAP Fiori Launchpad

67

2.2 Design-Led Development Process

74

2.2.1 Discover

75

2.2.2 Design

76

2.2.3 Develop

76

2.3 Different SAP Fiori App Types

76

2.3.1 Freestyle

76

2.3.2 SAP Fiori Elements

77

2.4 Prototyping Tools

90

2.4.1 Axure

90

2.4.2 SAP Build

90

2.4.3 Building a Prototype Using the SAP Build Tool

92

2.5 Summary

105

3 ABAP RESTful Programming Model

107

3.1 Core Data Services

108

3.2 SAP Gateway

110

3.3 OData

111

3.4 ABAP RESTful Programming Model

115

3.4.1 Introduction

115

3.4.2 Query

120

3.4.3 Business Objects

123

3.4.4 Business Service

132

3.4.5 Service Consumption

134

3.5 Summary

135

4 Developing an SAP Fiori Elements List Report and Object Page

139

4.1 Core Data Services Views

141

4.1.1 ABAP Development Tools in Eclipse

142

4.1.2 Introduction to the Data Model

145

4.1.3 Creating Basic Interface Core Data Services Views

150

4.1.4 Adding Calculated Fields

156

4.1.5 Adding Data Control Language Files

167

4.2 Developing an Unmanaged Transactional Application Using the ABAP RESTful Programming Model

170

4.2.1 Generating an Unmanaged Transaction Business Object from a CDS Model

171

4.2.2 Service Definition

173

4.2.3 Service Binding

175

4.2.4 Entity Manipulation Language (EML)

179

4.2.5 Behavior Definitions to Add Transactional Features

181

4.2.6 Behavior Implementation Language (BIL)

186

4.2.7 Behavior Handler Local Class

187

4.2.8 Behavior Saver Local Class

198

4.2.9 Behavior Implementation

199

4.2.10 Creating Projection Views

231

4.2.11 Creating Projection Behavior Definition

236

4.3 Virtual Elements in Core Data Services

236

4.3.1 Adding a Virtual Element to a Core Data Services View

237

4.3.2 Implementing an ABAP Code Exit to Populate the Virtual Element

237

4.4 Adding User Interface Annotations to Projection Views

238

4.4.1 Creating a Metadata Extension File

238

4.4.2 User Interface-Relevant Annotations for the List Report

239

4.4.3 User Interface Annotations for the Object Page

246

4.4.4 Preview of the SAP Fiori Elements App with UI Annotations Using Service Binding

251

4.5 Generating a List Report Template in SAP Web IDE Full-Stack

256

4.6 Extending the User Interface

260

4.6.1 Implementing User Interface Extensions via Breakout

260

4.6.2 Adding a QUnit Unit Test

265

4.7 List Report Application versus Worklist Application

267

4.8 Summary

267

5 Developing an Overview Page

269

5.1 Core Data Services Views

269

5.1.1 Creating a Simple Core Data Services View

270

5.1.2 Adding a Data Control File

279

5.2 Adding User Interface Annotations

279

5.2.1 Creating Annotations for an Analytical Card

280

5.2.2 Creating Annotations for a List Card

282

5.3 Creating an OData Service Using the ABAP RESTful Programming Model

286

5.3.1 Creating a New Service Definition

286

5.3.2 Creating a New Service Binding

288

5.4 Generating an Overview Page Template Project in SAP Web IDE

291

5.4.1 Generating the Basic Overview Page Layout

291

5.4.2 Adding the List Analytical Card

297

5.4.3 Adding the Standard List Card

300

5.4.4 Adding the Bar List Card

303

5.4.5 Adding the Table Card

304

5.4.6 Overview Page Output

306

5.5 Summary

307

6 Developing an Analytical List Page

309

6.1 Introduction

309

6.2 Building the Required CDS Views

309

6.2.1 Building Dimension Views

311

6.2.2 Building Cube Views

312

6.2.3 Building the Main Query View

314

6.3 Configuring the Title Area

315

6.4 Configuring the Filter Area

318

6.5 Configuring the Content Area

321

6.5.1 Configuring the Default Chart

321

6.5.2 Configuring the Table

323

6.6 Combining All the UI Annotations in the Metadata Extension View

325

6.7 Generating an Analytical List Page from SAP Web IDE

329

6.7.1 Adding Key Performance Indicators to the Project

333

6.7.2 Adding Visual Filters to the Project

335

6.8 Summary

341

7 Developing a Freestyle Application

343

7.1 Smart Controls

343

7.1.1 SmartField

344

7.1.2 Smart Link

345

7.1.3 SmartForm

347

7.1.4 Smart Table

348

7.1.5 Smart Filter Bar

350

7.2 Application Development with the SAP Web IDE Full-Stack

352

7.2.1 Setting Up an OData Service

352

7.2.2 Object Creation Page Using SmartFields and Forms

359

7.2.3 List Report Page Using Smart Table and Filter Bar

366

7.2.4 Add a One-Page Acceptance Integration Test

367

7.3 Summary

378

8 Deploying Applications to the SAP Fiori Launchpad

379

8.1 Uploading a User Interface to the ABAP Frontend Server

379

8.1.1 Deploying Applications from the SAP Web IDE

379

8.1.2 Uploading Applications Directly into the Frontend Server

382

8.2 SAP Fiori Launchpad Admin Page

386

8.2.1 Catalogs

387

8.2.2 Groups

388

8.2.3 Roles

389

8.2.4 SAP Fiori Launchpad Content Manager Tool for ABAP

389

8.3 Creating the Technical Catalog and Business Catalog

391

8.4 Creating the Application Tiles

392

8.5 Creating Groups for Application Tiles

405

8.6 Creating and Assigning a Transaction PFCG Role to Users

407

8.7 Setting Up Intent-Based Cross-Application Navigation from OVP to LRP

413

8.8 Summary

415

9 Version Control in SAP Web IDE Using Git

419

9.1 Git Introduction

419

9.2 Git Basics

419

9.2.1 Creating Initial Project Repositories Using GitHub

421

9.2.2 Initializing the Local Repository for the Projects in SAP Web IDE

423

9.2.3 Linking the Local Repository with the Remote Repository in GitHub

424

9.2.4 Submitting Code to Repository (Stage, Commit, Push)

425

9.2.5 Cloning the Project into SAP Web IDE

431

9.2.6 Getting Code from the Remote Branch (Fetch, Merge, Pull)

434

9.2.7 Working with Branches

439

9.3 Summary

444

10 Automated Testing

445

10.1 Backend Test Automation

448

10.1.1 Unit Testing (ABAP Unit)

448

10.1.2 Unit Testing (Core Data Services Test Double Framework)

461

10.2 Frontend Test Automation

465

10.2.1 Unit Testing (QUnit)

465

10.2.2 Integration Testing (OPA5)

468

10.3 End-to-End Test Automation Tools

471

10.3.1 Setting Up Nightwatch.js

472

10.3.2 Creating the Create Purchase Document End-to-End Nightwatch.js Test

473

10.3.3 Running the Create Purchase Document End-to-End Nightwatch.js Test

474

10.4 Summary

475

11 Continuous Integration

477

11.1 Introduction

478

11.1.1 Continuous Integration

478

11.1.2 Continuous Delivery

479

11.1.3 Continuous Deployment

480

11.2 Setting Up a Continuous Integration Pipeline for SAPUI5 on the ABAP Server

481

11.2.1 Setting Up a Local Jenkins Automation Server

482

11.2.2 Creating an Initial Jenkinsfile

484

11.2.3 Creating the Continuous Deployment Pipeline

484

11.2.4 SAPUI5 Grunt Plug-ins

487

11.2.5 Implementing the Build Stage

488

11.2.6 Automatically Triggering Builds on Git Push

491

11.2.7 Implementing the Test Stage

492

11.2.8 Implementing the Deploy Stage

495

11.3 Continuous Integration on the ABAP Server

498

11.3.1 Quality Checking Using the ABAP Test Cockpit

499

11.3.2 Scheduling ABAP Unit Tests Using the ABAP Unit Runner

502

11.4 Summary

505

12 ABAP on Git

507

12.1 Creating a Git Repository

507

12.2 Installation and Setup

509

12.3 Create New ABAP Objects in Eclipse

512

12.4 Staging and Committing ABAP Code to Git

513

12.5 Setting Up the abapGit Plugin in Eclipse

516

12.6 Connecting to abapGit Repositories

516

12.7 Cloning Git Repository into Eclipse

517

12.8 Exporting Existing Packages as ZIP Files from a System Using abapGit

519

12.9 Importing Package ZIP Files into Another ABAP System Using abapGit

520

12.10 Summary

522

A Developing Applications on the SAP Cloud Platform

523

A.1 Introduction to SAP Cloud Platform

523

A.2 SAP Cloud Platform Application Programming Model

524

A.3 Developing an App on SAP Cloud Platform Using the SAP Web IDE Full-Stack

526

A.3.1 Setting Up the SAP Web IDE Full-Stack in SAP Cloud Platform

526

A.3.2 Creating a Full-Stack Business Application in SAP Web IDE

529

A.3.3 Creating a New Data Model for the Application

531

A.3.4 Defining an OData Service for the Application

535

A.3.5 Defining User Interface Annotations for Core Data Services Views

535

A.3.6 Adding a Database for the Application

537

A.3.7 Deploying the Application on Cloud Foundry

539

A.3.8 Consuming the OData Service

540

A.3.9 Building a User Interface to Display the Data

542

A.3.10 Modifying the User Interface Using the Annotation Modeler

547

A.3.11 Adding Custom Logic to the OData Service

549

A.4 Summary

552