In this tutorial series, we will focus on learning SAP Cloud Application Programming Model (CAP).

CAP is a framework, that would not only guide developers, but also take away some of the more technical or foundational tasks to help them focus on their business logic. Business logic is the key differentiator for what you are developing.

SAP CAP is both open and opinionated. The programming model is a combination of tools, languages, and libraries that will help you build enterprise-grade services and applications.

The goal is to guide developers and minimize boilerplate content, so they can focus on what's important the business logic.

As you can see in this graphic, we support both open-source and SAP tools and technologies.

Components of CAP

    1) Core Data Services (CDS) is the data modelling infrastructure. CDS is known as the backbone of the programming model, as it provides the means to capture service definitions and data models, queries, and expressions in plain object notations.

    2) Service SDKs - It supports libraries available for both Java and Node.js, which can be used to provide and consume services through synchronous and asynchronous APIs. The SDKs include out-of-the-box integration to lower-level platform services, such as authentication and credential-flows or on and off-boarding of SaaS tenants.

    3) SAP BAS, Fiori Elements, SAP HANA - SAP BAS is the IDE of choice, there is Support for SAP HANA and SAP Fiori Elements.

Design Principles

When it comes to design principles, there is open and opinionated concept.

It's open because it gives you choice. You can choose which technology to use, you can select your architecture pattern, you can pick and choose the parts of the programming model that suit your development needs best. But it's also opinionated, because we provide but it's also opinionated, because we provide for you to follow SAP’s recommended approach.

Zero Lock-In

You can choose any technology of your choice, that there is no locked-in, mandatory path with this programming model. To build your UI, you can use SAP Fiori Elements, or you can use any other alternative technology as well.

Non-Intrusive

The programming model is non-intrusive, i.e. it is completely free of assumptions. Here the main goal here is to reduce boilerplate code, which would be the same regardless of the architecture or methodology you choose.

Platform-Agnostic

You can build applications in a way that is independent from the underlying cloud infrastructure. To achieve this by using an API-first approach that avoids hard wiring to any given technology.

Let’s understand with an example Hello World application using CDS and node.js using SAP BAS as IDE.

I hope you are well versed with the basics of SAP BAS. If you aren’t, please check my previous blog on introduction to SAP BAS and setting up.

Introduction to SAP BAS

Setting up SAP BAS

This is the home page of SAP BAS.

Now lets define a service in the srv folder and name it as say.cds

Now, we need to implement the service. To do so, we create another file say.js.

Now, go to the terminal and we can run our little hello world application.

So using cds run, we should get a running service.

We can edit the url to run our hello world request. 

 

And we'll see the value returned as "Hello world".So I hope you learned how to build a small HelloWorld application using CDS and node.js on SAP BAS. In the coming blogs, we will explore more about CDS and SAP CAP.

What is SAP Business Application Studio?

SAP Business Application Studio is a new SAP Cloud Platform service in SAP Cloud Foundry which offers a modular development environment tailored for efficient development of business applications for the SAP Intelligent Enterprise.

Capabilities

In SAP Business Application Studio, the developer is provided with one or more Development Spaces. As a developer, you can chose which tools will be installed on your dev space by selecting the suitable extension pack.

These tools covers the end-to-end development cycle:

·       Clone an existing project with a Git client or create new project using various templates.

·       Use editors for SAP specific technologies.

·       Easily test your application on your dev space while consuming services from remote sources.

·       Build and deploy the application as multitarget applications (MTA).

GIT Issue

There is no provision to set the Git Repository for new project we create. Like WebIDE , there is no provision to assign GIT repository URL.

Solution

For git, simply type “git” and a list of git commands will be filtered. Git clone is one of the commands,

Please follow the below GIT Commands.

1.       Initialization of GIT

git init ​

2.       Set Remote Origin URL

git remote add origin https://github.com/user.name/test.git If already exist then use below command git remote add origin https://github.com/user.name/test.git

3.       Staging the Changes of Project

git add .

4.        Commit your changes

git commit -m "GIT Comment"

5.        Push your changes into GIT

git push origin master

6.       Pull your latest changes from GIT

git pull origin master

If you wish to know more about SAP Bussiness Application studio, visit my blog on getting started on SAP BAS

You can also learn about creating fiori application in SAP BAS through this blog.

In this blog, we will look into a different possibility of Fiori development in local environment using Visual Studio using Fiori Tools.

We will mainly cover 2 topics here, i.e.

1. How to set up Visual Studio on your system

2. How to download SAP Fiori Tools from Microsoft's Visual Studio Marketplace

Before starting with this, I just want to highlight its totaly upto you, if you want to use SAP Bussiness Application Studio(a hosted Environment) or Visual Studio Code(a local Environment). SAP BAS does not require any kind of installation on your system, as its all on cloud, but in case of Visual studio code you would be required to install node.js and other dependancies on your local system.

SAP Fiori tools is an extension pack available for Visual Studio Code and SAP Business Application Studio that is designed to increase the efficiency of SAP Fiori elements app development. SAP Fiori is SAP’s user experience, intended to provide end-users with apps that are role-based, adaptive, coherent, simple, and delightful. SAP Fiori elements provides predefined page types for SAP Fiori development, allowing users to quickly create SAPUI5 apps while taking advantage of the user interface provided by SAP. SAP Fiori tools allows users to easily generate SAP Fiori elements apps, modify the app’s functionality, generate new pages, and preview the application with both backend and mock data.

In this tutorial we will be using SAP Fiori tools to create an app featuring a list of objects, with additional pages that provide more detailed information about the items in the list. You will be able to preview this app using real backend data provided by SAP, as well as mock data.

As a prerequisite, you must be having an access to Gateway Demo System i.e. ES5 account, i.e. https://sapes5.sapdevcenter.com/sap/opu/odata/sap/SEPMRA_PROD_MAN/

If you dont have access to this system, you can register to it using: https://developers.sap.com/tutorials/gateway-demo-signup.html

1) Lets being with downloading Visual Studio Code from the officail website:

Download Visual Studio

Here are some resources to help you get started with Visual Studio Code

Visual Studio Basic Layout

Visual Studio Code Introductory Videos

2) Now that you access to Visual studio code, you need to install the suite of SAP Fiori tools extension.

In Visual Studio Code's Activity Bar, click the icon for extensions.

Next, clear the Search Box at the top of the Extensions view, type SAP Fiori tools, and then press Enter.

Click the extension called SAP Fiori tools - Extensions Pack, and then click Install.

Once you install the Extension pack, it is recommended that you restart Visual Studio Code

Now that our Fiori Tools are installed in Visual Studio Code, we can now start developing a Fiori Application. In our case let's create an SAP Fiori elements list report page displaying a list of products.

3) We will be taking help of Application Generator, i.e. a wizard-style approach to create apps based on SAP Fiori Elements page types. 

In Visual Studio Code, open the Command Palette using CMD/CTRL + Shift + P, type Application Generator, and select SAP Fiori tools - Application Generator: Launch.

5) In the next step, we define our data source for our application, i.e. in our case "Connect to an OData Service". Copy and paste this URL: https://sapes5.sapdevcenter.com/sap/opu/odata/sap/SEPMRA_PROD_MAN/

After successfully connecting to the supplied OData service, click Next to customize the template.

Two more fields will appear. One for the Main Entity and another for the Navigation Entity. Since this list report is intended to display products, select SEPMRA_C_PD_Product for Main Entity. The application is simply meant to display a list of products, so set the Navigation Entity to None.

Click Next.

With the page type and data source defined, the next step is to configure the main project attributes:

Field Name	Value
What is the module name for your application?	demofioriapp
What is the title for your application?	Fiori App
What is the namespace for your application?	demo
What is the description for your application?	A demo Fiori application.
Choose your project folder	Click the folder selection icon and select where to save your project.

Click Finish.

At this point, your application folder will be generated based on the input you have provided.

Once your project has been generated, you will have the option to add it to your existing workspace. Verify that your project has been created and it looks similar to this:

Since the given OData service came with pre-configured backend annotations, you can preview your app right away.

6) From the Visual Studio Code Explorer on your left, right-click your project and select Preview Application.

From the options, you will need to select a npm script. Select start and press Enter to preview your app with backend data. A new browser window will open with your List Report Object Page application running.

I hope this tutorial was helpful in understanding the basics of SAP Fiori tools in Visual Studio Code. Moreover we learnt how to gevelop a list report page fiori elements project generated by SAP Fiori tools and a running application using real backend data.

Stay tuned for my futher tutorial blogs!

In this blog, we will start using SAP BAS with a free Trial account and build our 1st Simple UI5 Application. 

SAP Business Application Studio is a new SAP Cloud Platform service in SAP Cloud Foundry which offers a modern development environment tailored for efficient development of business applications for the SAP Intelligent Enterprise such as SAP Fiori, S/4HANA extension, and Workflow.

SAP BAS is kind of similar to Visual Studio in terms of command line, so if you are familiar with Visual Studio, then SAP BAS would be ever more easier for you to understand.

I am guessing, you would already have a free trial account in SAP Cloud Platform.

Alright, let's start this tutorial.

Log onto SAP Cloud Platform

1. Enter Your Trial Account to access the Cloud Foundry

2. Launch the Application

3. Create a Dev Space and run your 1st UI5 Application

By now, your BAS would be loaded up and the screen would look somehting like this

Select SAP Fiori freestyle SAPUI5 application template, then select Which type of SAP Fiori freestyle SAPUI5 application do you want to create?

In the Datasource, you can select according to your project requirements, as for this exercise I will select None.

Once you fill in all the details it will generate the project structure in the Work Space.

Now, the project gets generated like the below structure

5. Lastly, we can run the application

To do so, we need to Create an Application Configuration for running the application

Click on Run Configuration

Click on the Plus button to create an application configuration

Select your Application (UI5 App) –Demo Application (HTML5 Module Name)

Cheers!!

In this blog we will get to know more about this new platform to develop Applications, i.e. SAP Bussiness Application Studio.

SAP has come up with new cloud-based development environment i.e. SAP Business Application Studio, for multi-cloud environment. SAP Business Application Studio is a very powerful development environment, tightly integrated with the SAP Cloud Platform and well suited for developing business applications.

It provides you desktop-like experience in the cloud. Design of this studio is influenced by Microsoft Visual Studio code, making the developer productive. This is suitable from basic level developer to Full-Stack developer with full control development environment from back-end to front-end.

This would be the only environment for all kind of applications, by replacing all below tools into one tool SAP BAS.

• SAP UI5 / FIORI apps using templates and elements – webIDE Full-Stack
• HANA Native – XS & XSJS – HANA webIDE & HANA Studio
• ABAP on Cloud – RESTful Application Programming – Eclipse with cloud system connectivity
• Cloud Application Programming (CAP), Node.js & Java apps – Eclipse, Atom

Key benefits:

• Single environment for all kind of applications.
• No local installation & setup required
• No JRE dependency
• Industry best practices for developers without switching to multiple applications
• Integration with API HUB, on-premise, on-cloud.
• Provide the flexibility for all the developers, for e.g. templates, Git, Mock servers, OPA5 testing for FIORI apps, etc.
• Enhances the productivity with direct command execution through integrated command line.
• Run configuration feature makes it an easy option and offer single click to simulate the test in locally or deploy your app on cloud directly

Target Audience:

• UI5/Fiori developer
• ABAP developer (Planed in future version)
• Native HANA developer (Planed in future version)
• Node.js (in future version) developer
• Java application developer
• RESTful Application programming (RAP) dev
• Cloud Application programming (CAP) dev

Hope this short intro to SAP BAS was helpful. Check my next blog where I will show how to setup SAP BAS, create a UI5 application, add a launchpad module for SAP UI5 application and deploy to Cloud foundry from SAP Bussiness Application Studio.