1. Build a CAP Application

In this exercise, we assume the role of a developer tasked with implementing an application to create and manage incidents, which are customer support messages.

For the sake of time, we have prepared the CAP application in advance. We will quickly walk you through the content before starting the server.

Open the incidents Project

1. Open a new BAS window by selecting Menu > File > New Window

   

2. In the new window, click the Open Folder button

   

3. In the popup, scroll down and open the cloned repository location:

   

4. Select the incidents entry and click OK.

   

5. After that, your window should now resemble the following:

   

Domain Modelling

The conceptual domain model for our incidents management application is as follows:

• Customers can create Incidents (either directly or via agents)
• Incidents have a title and a Conversation of several Messages
• Incidents are resolved through repairs, kept track of as scheduled Appointments of available Service Workers

We initially capture that in CDS as shown below:

entity Customers {
  name      : String;
  incidents : Composition of many Incidents;
}

entity Incidents {
  title        : String;
  customer     : Association to Customers;
  conversation : Composition of many {
    timestamp  : DateTime;
    author     : String;
    message    : String;
  };
  repair       : Association to Appointments;
}

entity Appointments {
  start  : DateTime;
  end    : DateTime;
  worker : Association to ServiceWorkers;
}

entity ServiceWorkers {
  name         : String;
  appointments : Association to many Appointments;
}

• Learn more about Domain Modeling in CAP

Iteratively Refine Domain Knowledge — After having initially captured our domain model as shown above, we iteratively refine that in close collaboration with developers and domain experts to the final version you find in the project.

Please locate and open db/schema.cds from the explorer.

Add a Service

All client requests go through CAP Services, which act as facades to data. So we created a simple service definition in srv/incidents-service.cds as follows:

using { sap.capire.incmgt } from '../db/schema';
service IncidentsService {
  entity Incidents      as projection on incmgt.Incidents;
  entity Customers      as projection on incmgt.Customers;
  entity Appointments   as projection on incmgt.Appointments;
  entity ServiceWorkers as projection on incmgt.ServiceWorkers;
}

• Learn more about CAP Services

Add a Fiori UI

CAP provides advanced support for creating UIs based on SAP Fiori elements technology. To enable this, we need to augment the service definitions with so-called Fiori Annotations as in file app/fiori.cds. You can find and open the file in your cloned project.

using { IncidentsService, sap.capire.incmgt.Incidents, cuid } 
from '../srv/incidents-service';

@odata.draft.enabled
annotate IncidentsService.Incidents with @(UI : {

  // For Lists of Incidents
  SelectionFields : [ urgency, status, repair.type ],
  LineItem : [
    { Value: title },
    { Value: customer.name, Label: 'Customer' },
    { Value: urgency, Criticality : #Critical, CriticalityRepresentation : #WithoutIcon, },
    { Value: status },
    { Value: repair.type },
  ],

...

• Learn more about Fiori UIs with CAP

Technical Preparations

Before proceeding, please ensure that you have CDS 7 installed in the BAS Dev Space. To verify this, open a terminal and enter the following command:

cds v

Observe the output to confirm that your CDS and CDS-DK versions are 7 or above.

If your CDS and CDS-DK versions are not at 7 or above, please run the following commands to upgrade your development environment to the latest version:

npm i @sap/cds
npm i -g @sap/cds-dk

Running the Server

To start a server locally in our BAS container. Follow these steps:

1. Open a new terminal: Menu > Terminal > New Terminal:

2. Make sure you are in the incidents working directory, and enter the following command:

cds w

Exploring the App

With the server running, we can open the Incidents Management web app in a new browser window:

1. Click on the Open in New Tab button in the toaster dialog that appears when the server starts:

   

2. Alternatively, you can click on the displayed server URL link while pressing and holding the Cmd/Ctrl key:

   

3. A new browser tab will open, displaying a simple launchpad page prepared for this hands-on session:

   

4. On that page, click the blue button labeled "Alice (t1)" to open the actual Fiori application in yet another new tab, while logging in as alice:

   

Summary

In this exercise, we have walked through the process of building a CAP-based application, including an SAP Fiori elements UI. We have successfully started the application locally in the BAS container, utilizing an in-memory SQLite database.

CAP Spotlights:

• Focus on Domain — CDS provides great affordances to capture domain knowledge concisely and comprehensibly, fostering close collaboration between developers and domain experts.

• Minimized Coding — The domain model and the service definitions, both captured in CDS, are all we required to get a fully-fledged OData service, capable of serving Fiori UIs. No coding was required, as all requests are automatically served by generic CAP runtime. Actually, the whole app is defined in these three .cds files:

  

• Accelerated Development at Minimized Costs — Instead of always deploying the application to the cloud and connecting it to an SAP HANA database, CAP allows for running servers locally using an SQLite database during development.

This significantly speeds up the development turnaround time (from several minutes to just 1 second) and drastically reduces operational costs during development.

In the next exercise 2 — Deploy as SaaS, we will transform this application into a multi-tenant SaaS application, enabling extensibility for the subsequent exercises.