SAP Business Application Studio (BAS) is the next-generation IDE for building business applications.
It is a modular development environment, built on ‘Eclipse Theia’, an open-source IDE that embraces the VS Code experience. To know about BAS, click here.
In this blog post, we will create a CAP application using SAP Business Application Studio.
Lets go-over the development steps of CAP application.
🛠 Environment Setup
BAS introduces the concept of dev spaces. A dev space is a preconfigured environment with the required tools and extensions tailored for a specific business scenario. In our case, we’ll need to create a dev space of type “SAP Cloud Business Application”.
On the BAS home page, click on Create Dev Space to create CAP dev space.
Create a CAP application
You can create a new application using New project from template wizard. SAP Business Application Studio different templates to create applications, these templates are based on Yeoman generators.
Follow below step wizard to create Cloud Application Model.
- Create a CAP Project.
On Welcome page, click on “Start From template” alternatively you can navigate File → New Project from Template.
- Select Template and Target Location
First, choose the target folder path and then select “CAP Project” template. Click Start.
- CAP Project Details
Provide project name and select runtime as “Node.js“. You can add additional features to the CAP project such as CI/CD Pipeline, MTA based SCP Deployment, and also sample content to your project. Click Finish.
- Project Structure
You can see the project structure is created with the following folders for
“srv/“ – Service definitions with implementation
“db/” – Domain models and database-related content
“app/” – UI content
“package.json” – Project descriptor
“mta.yaml” – Cloud Foundry Deployment file
- Service definitions
In srv/ folder a sample file is created as in step-4 we select to add sample content to the project.
- Data models
Similarly, in db/ folder, a sample data model file is also created.
Develop the application
Now that we have CDS data models and service definitions ready, let’s create UI for our application using the Fiori Elements template.
1. Open CAP Project Explorer, choose the service and then right-click. Select Create UI.
2. Select SAP Fiori elements application generator. Click Start.
3. Data source and Service selection fields are filled automatically.
4. Choose the entity from the drop-down.
5. Finally provide the Project attributes.
Add UI Annotations
6. Navigate to the “app/” folder and add UI annotations in the “annotations.cds” file like below.
Test and Run CAP application
7. Navigate to package.json file and change the sqlite version and then run the following command.
8. Finally run the CAP application using the below command in the terminal.
9. The application is running at port – 4040
10. Select index.html file to open the CAP UI application.
Congrats!! you have successfully learnt the steps to create CAP application using SAP Business Application Studio.