Skip to Content
Technical Articles
Author's profile photo Jeffrey Towell

Northwind Freestyle app with Business Application Studio’s new “SAP Fiori application” template option

Introduction

When creating an app from template in Business Application Studio (BAS) the old “SAP Fiori Freestyle Project” template functionality has been moved to the new “SAP Fiori application” template. This template combines freestyle and Fiori elements into one. For details see Ashley Tung’s blog:

Simplifying application generation for SAPUI5 freestyle and SAP Fiori elements apps

In this blog I will simply demonstrate the new way to create a freestyle app in BAS using the Northwind odata service. Previously you pointed to a Northwind destination in your system during creation but now you reference the odata service directly with an URL. There is also a difference in the run configuration that we will cover.

Template Wizard

Start a new template:

Select the new template option “SAP Fiori application” and hit “Start”:

Select application type “SAPUI5 freestyle” and select an application template. We will use “SAP Fiori Master-Detail Application”:

Hit “Next”. Here is where we use the service URL “https://services.odata.org/V2/Northwind/Northwind.svc/”.

The last “/” is critical.

Hit “Next” and for demonstration purposes select any combination of fields that will work. I selected the following:

Hit “Next” and enter the project attributes you desire:

On “Finish” the project will be created and become visible in your Explorer panel.

 

Run Configuration

Go to the Run Configurations view. At this point a working run configuration for your new project may exist. If not, then select the plus sign to create a new run configuration:

The Wizard prompts are straight forward except for the prompt “Select destination type”. For this select the option:

Skip Use config from ui5.yaml

 

Output

The app can now be run and displays as follows:

For instruction on how the code we have created at this point can be further used to learn Fiori see the blog

Create Fiori App in Business Application Studio using Northwind odata (Part 1)

 

Deployment

For deploying the code we have created please see Marius Obert’s response to the following question:

Using odata service in freestyle app in Business Application Studio

 

Conclusion

While BAS’s new “SAP Fiori application” template no longer references a Northwind destination during creation we can still use Northwind within BAS by following the process described above.

Assigned Tags

      6 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Debashish Das
      Debashish Das

      Hi Jeffrey,

      Have you deployed the Application in Cloud Foundry and configure it in Launchpad?

      Author's profile photo Jeffrey Towell
      Jeffrey Towell
      Blog Post Author

      Not yet Debashish.

      Please blog your steps if you are successful. 🙂

      Author's profile photo Wilman Javier Santiago Estrada
      Wilman Javier Santiago Estrada

      Hi Jefrey

       

      I am doing the step by step and When I Go to the Run Configurations view appear the following  messages

      There are no runnable resources

       

       

      Regards

       

      Author's profile photo Wolfgang Pfleghar
      Wolfgang Pfleghar

      Hi Wilman,

      Have you opened the new project you created after it has been created?

       

      Best,

      Wolfgang

      Author's profile photo satya dwivedi
      satya dwivedi

      Hi Jeffrey Towell,

       

      I have created a destination for consuming northwind services, but falling to load metadata after running the app locally. and i have configured xs-app.json like below.

      {
          "source": "^/northwindapi/(.*)$",
          "target": "/$1",
          "destination": "northwindapi"
          }

      Destination in BTP

      #
      #Wed Sep 29 17:33:22 UTC 2021
      Description=north wind
      Type=HTTP
      Authentication=NoAuthentication
      WebIDEUsage=odata_gen
      Name=northwindapi
      WebIDEEnabled=true
      ProxyType=Internet
      URL=https\://services.odata.org
      WebIDESystem=northwindapi
      

       

      metadata

      metadata

      Author's profile photo John Long
      John Long

      You defined your xs-app.json target as "/$1", I would update this to "$1".

      You can refer to this example https://github.com/SAP-samples/fiori-tools-samples/blob/main/neo-migration/fioriapp/xs-app.json