Create custom UI for S/4HANA on SAP Cloud Platform

Go to Services, search for SAP Web IDE and select it on your SAP Cloud Platform account.

Click Go to Service to open SAP Web IDE.

Select New Project from Template to generate one.

If you don’t see this welcome page then follow the alternative way:
File | New | Project from Template

Choose the List Report Application template and click Next to create a new UI.

Enter Bonusplan as the project name and title.

Click Next.

Select your data connection, which you have previously created on your SAP Cloud Platform with your destination. You should choose YY1_BONUSPLAN_CDS as service and click Next.

Now choose all annotations in this view and move on with Next.

Select YY1_BONUSPLAN as OData collection and click Finish.

Select Component.js and click the play button to run your application.

Open the webapp folder and manifest.json file, and make sure to be in descriptor mode of the editor.

Then go to navigation and add the following information:

| Semantic Object | CustomUI |
| Action | Bonusplan_UI |
| Title | Bonusplan |
| Information | Bonusplan (info) |
| Subtitle | Bonusplan |
| Icon | sap-icon://activate |

Click Save.

Open the UI Adaptation editor for your project Bonusplan via context menu.

Switch via Adapt UI button to adaptation mode. Click on the marked table and set the visibility to false.

Save your changes.

Select your project Bonusplan and deploy this to S/4HANA system via context menu to SAPUI5 ABAP Repository.

A wizard opens. Set the destination to your S/4HANA system. Ensure that the UI is deployed as a new application. Click Next.

Choose an application name for your deployment, click Next and Finish.

Confirm your deployment.

Now you should be able to see following: