Skip to Content
Author's profile photo Denise Nepraunig

Fiori Reference Apps Step-By-Step Guide

The SAP Fiori Reference Apps are part of the SAP Web IDE. In this blog post I will show you how to access them.


  1. Getting an app
  2. Running the app with mock data
  3. Running the app against a real backend

1. Getting an app

Start the SAP Web IDE.

a) You can get the SAP Fiori Reference Apps from the Home Screen:

b) Or you can choose “File -> New -> Project from Sample Application”:

Have a look at the available apps and choose the app you want to try out:

We have selected the “Approve Purchase Orders”. Accept the terms and click finish:

The SAP Fiori Reference app is now copied to your SAP Web IDE workspace.

2. Running the app with mock data

To start a project we will first run it with mock data. At the end of the blog post you’ll find a link on how to run it with a real backend.

Open the folder “webapp -> test” and right-click the file flpSandboxMockServer.html or testOVPwithMock.html.

Choose “Run -> Run as -> Web Application”.

If you see the SAP Fiori Launchpad you can click on the first tile to start the app, otherwise the app starts automatically (Procurement Overview app).

Now you see the running application:

3. Running the app against a real backend

Please check out this blog post how to run the app agains a real backend.

Link collection

Assigned Tags

      You must be Logged on to comment or reply to a post.
      Author's profile photo prasad badal
      prasad badal

      is it possible to run this with real data. is there a tutorial showing how to switch from mock data to real data assuming the odata service/destinations is ready


      Author's profile photo Hans-Juergen Richstein
      Hans-Juergen Richstein

      For running the apps in WebIDE against a real backend, the neo-app.json file of each app refers to a logical destination "RefAppsBackend". So either you create such a destination pointing to the desired backend (or Cloud Connector) within your cloud dashboard, or you change it in the neo-app.json to an already existing logical destination that points to the backend you would like to use.

      Regards, Hans-Juergen

      Author's profile photo Former Member
      Former Member

      Yes Prasad it is possible.This tutorial is available in

      This tutorial is started 4 weeks ago. If you want to join you can join now also.

      Author's profile photo Dai Nguyen Quang
      Dai Nguyen Quang

      Hi all,

      I have done as this guide. How can other people view my apps.


      Dai Nguyen Quang.

      Author's profile photo Denise Nepraunig
      Denise Nepraunig
      Blog Post Author

      The upgraded SAP Fiori reference apps are available today in the trial SAP Web IDE  and tomorrow in the productive (factory) SAP Web IDE.