First Neptune Application

Create a Neptune application with the minimal setup to create the output "Hello World".

Prerequisites

Procedure

Open the Neptune Cockpit and open the App Designer from the tile, menu, or search bar.

first nep app 1

Create a new application.

first nep app 2

Add a name and click the Save button.

first nep app 3

In this cookbook, we will not connect the Neptune application to the ABAP backend, so you don’t need to add any settings.

first nep app 4

Open the design tab. The library tree to the left includes all the UI5 objects you can use to build your application. You’ll build you app in the object tree in the next panel. The root HTML5 Document and Resources are added to the object tree to begin with.

first nep app 5

Drag the following UI5 objects from the library tree to the object tree:

  • App

  • Page

  • Flexbox

  • Title

Adjust the following attributes for the flexbox and the title:

first nep app 6
first nep app 7

Save and activate.

first nep app 8

Run preview.

first nep app 9

Result

You have created your first Neptune Application.

Check out the following video showing the different steps that are needed to create the app.