Skip to content
This repository has been archived by the owner on Feb 4, 2025. It is now read-only.

1. Build a CAP Application

Daniel edited this page Nov 15, 2022 · 5 revisions

In this exercise we assume we are a developer given the task to implement an application to create and manage incidents, that is customer support messages.

For time reasons we have prepared the CAP application upfront and will very quickly walk you through the content before starting the server.

Open the incidents Project

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

    image-20221110140140988

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

    image-20221110140347745

  3. In the popup scroll down and open the teched2022-AD264 entry:

    image-20221110140558320

  4. Next select the incidents entry and click OK.

    image-20221110140758718

  5. After that your window should look similar to this: image-20221110152337692

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

domain drawio

We initially capture that in CDS as follows:

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 of developers and domain experts to the final version you find in the project.

Find and open db/schema.cds from the explorer.

Add a Service

All requests from clients 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. We basically augment service definitions with so-called Fiori Annotations as in file app/fiori.cds → find and open this 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

Run the Server

We can use pre-configured Launch Configurations enclosed with the incidents project to start a server locally in our BAS container as follows...

  1. Click on the Run and Debug icon in the Activity Bar:

    image-20221110163229650

  2. Click on the Start Debugging button to the left of cds run:

    image-20221110163400316

  3. In response to that the server is started with output shown in the Terminal like that:

    image-20221110164104299

Explore 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 shows up when we started the server:

    image-20221110164400815

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

    image-20221110164650883

  3. In response to that, a new browser tab is opened displaying a simple launchpad page, which we prepared for this hands-on session: image-20221110164840680

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

    image-20221110165221574

Summary

In this exercise we've had a quick walkthrough of how to build a CAP-based application, including a SAP Fiori elements UI. We've finally started that application locally in the BAS container, with an in-memory SQLite database.

CAP Spotlights:

  • Focus on Domain — CDS provides great affordances to capture domain knowledge in concise and comprehensible ways, fostering close collaboration of 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 at all, as all requests are served automatically by generic CAP runtime. Actually the whole app is defined in these three .cds files:

    image-20221110181622222

  • Accelerated Development at Minimized Costs — Instead of always deploying the application to the cloud, connected to a HANA database, CAP allows you to quickly run servers locally using a SQLite database during development. This not only speeds up development turn-around cycles by magnitudes (from several minutes to 1 second), it also drastically reduces operation costs during development.

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