Skip to Content
Product Information
Author's profile photo Ian Quigley

Getting up to speed with SAP Fiori tools: SAP Fiori Application Generator Overview

Since the release of the SAP Fiori Application Generator as part of the SAP Fiori tools suite in 2020, the team has been constantly reviewing and responding to feedback from the SAP community. The feedback that we have received is hugely important and gratefully received. We are continually looking to improve the generator based on your comments.  Please keep the feedback coming! 

 

With that in mind, my co-product owner Sushant and I are delighted to give you an update on some of the features that the SAP Fiori application generator has added since launch to support you generating and deploying your Fiori applications, both locally in VS Code and when using SAP Business Application Studio. 

 

What is the SAP Fiori Application Generator? 

 

The SAP Fiori Application Generator provides a wizard that enables you to generate an SAP Fiori application conforming to the structure and development practices that the SAP Fiori team recommends.   

 

By simply choosing your desired floorplan (from either SAP Fiori elements or SAP Fiori freestyle templates), and an OData source (V2 or V4), you can kick start your development and have the SAP Fiori application generator create an application locally that is available for use with the other tools in the SAP Fiori tools suite. 

 

The%20first%20step%20in%20the%20SAP%20Fiori%20application%20generator%2C%20where%20the%20user%20must%20decide%20which%20of%20the%20floorplans%20to%20use 

The first step in the SAP Fiori application generator, where the user must decide which of the floorplans to use

 

The generator is a NodeJS library published to npmjs.org and is installed as part of the SAP Fiori tools installation.  It can be invoked from the command palette using `Fiori: Open Application Generator`.    We have worked hard with our YUI colleagues to provide a wizard-based approach to app generation, where the user can choose from dropdowns and input boxes directly inside VS Code or Business Application Studio. 

 

What’s new with the SAP Fiori Application Generator? 

 

Since the initial launch of the SAP Fiori Application Generator last year, we have listened to your feedback and updated the generator with features that make development with our tools easier.  Some of the most notable changes include: 

 

(1) Consolidating the generator to incorporate SAP Fiori elements and SAPUI5 freestyle floorplans 

 

The first version of the generator only supported SAP Fiori elements floorplans.  We quickly realized that our customers also want to use freestyle templates so that there is a consistent development experience with all the features we provide, regardless of floorplan type.  Now users can choose whether they want to use a SAPUI5 freestyle or an SAP Fiori elements template.   

Users%20can%20choose%20either%20SAP%20Fiori%20elements%20or%20SAPUI5%20freestyle%20application%20type%20from%20the%20dropdown.%20The%20floorplans%20presented%20will%20change%20depending%20on%20the%20application%20type%20chosen.

Users can choose either SAP Fiori elements or SAPUI5 freestyle application type from the dropdown. The floorplans presented will change depending on the application type chosen.

 

As part of this change, we will be retiring the “old” version of the SAP Fiori Application Generator that supported only SAP Fiori elements applications.  This generator is currently available on npmjs.org as @sap/generator-fiori-elements. It is marked as deprecated but will shortly be removed to avoid confusion.  All our updates going forward will be included in the @sap/generator-fiori library.  

 

(2) Supporting deployment for SAP Fiori applications during generation 

 

When launching the initial version of the Fiori generator, users could add deployment configuration to their generated applications using a command line tool that we provided. This is something we always wanted to improve on, and we are happy to now have the ability to add deployment configuration to your application during generation.  If you know where you’d like to deploy your application, you can now add these details using the wizard.  If you don’t, that’s ok too – you can use the command line tool to add or modify deployment configuration details as needed at any stage after generation. 

 

Users%20can%20now%20optionally%20add%20deployment%20configuration%20for%20either%20Cloud%20Foundry%20or%20ABAP%20target%20environments.

Users can now optionally add deployment configuration for either Cloud Foundry or ABAP target environments.

 

We’ve also added a script supporting un-deployment of your application, so you can clean up as you go. 

 

(3) Providing support for your CAP projects 

 

Throughout the last year, we have been continually updating and refining our support for generating SAP Fiori applications using a local Cloud Application Programming (CAP) project.   

 

Initial support focused on CAP projects written using NodeJS, and we are delighted to say that the generator can now generate SAP Fiori applications to be used with Java CAP projects too. 

 

 

(4) Support for the Service Center in SAP Business Application Studio 

 

SAP Business Application Studio has recently launched the Service Center which allows users to easily view existing systems (destinations) and add new ones without having to login to the SAP BTP cockpit.  The SAP Fiori generator has added support for the Service Center too – you can select a service and automatically launch the Fiori generator with this service, skipping the data source selection step. 

 

Choosing%20a%20service%20in%20the%20Service%20Center%20can%20now%20launch%20the%20SAP%20Fiori%20generator%20automatically%20with%20that%20service. 

Choosing a service in the Service Center can now launch the SAP Fiori generator automatically with that service.

 

(5) Expanded data source connection options 

Over the past year, the generator has been updated to support new data source options: 

 

  • SAP API Business Hub 
  • Destinations in SAP Business Application Studio that have been defined on the instance level rather than account level 
  • OData V4 support 
  • Support for the SAP Cloud Application Programming (CAP) Model.  

 

What’s next? 

 

Hopefully this blog post has given you a brief introduction and overview into the features and changes to SAP Fiori application generator since launch.   

 

If you’d like to learn more about SAP Fiori tools, I’d highly encourage you to stay tuned for the other blog posts in this series where my fellow product owners from SAP Fiori tools will be sharing similar overviews of their extensions. You may also be interested in the following: 

 

 

If you already have some experience with SAP Fiori tools, I would also encourage you to watch for later entries in this blog series, as we’ll be sharing tips and tricks for getting the most out of the extensions. If you haven’t already signed up, we’d also like to invite you to participate in the SAP Fiori elements and SAP Fiori tools Roundtable, where you can share your experiences with the development team and other SAP Fiori development experts. 

 

For the SAP UX Engineering team,
Ian Quigley and Sushant Priyadarshi
Co-product owners, SAP Fiori Application Generator 

 

Assigned tags

      8 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Mio Yasutake
      Mio Yasutake

      Thank you for improving Fiori tools!

      Is there a plan to include UI5 library generator in Fiori tools?

      Author's profile photo Ian Quigley
      Ian Quigley
      Blog Post Author

      Hello Mio Yasutake ,

       

      Thank you for reaching out.  We do have the topic of including a UI5 library generator in Fiori tools in our backlog.  It's not yet planned into a release, but it's something we would love to deliver to you also!

       

      Best regards,

      Ian

       

      Author's profile photo Thorsten Klingbeil
      Thorsten Klingbeil

      Thanks for sharing Ian! 😀

      We're working a lot with the Application Generator - mainly in VSCode. Especially, building Fiori Elements Reporting Apps (LROP-based) is a breeze! 😊

      2 wishes for the the future (if I may):

      • Support for generating UI5 Libraries
      • Service Center funtionalities in VSCode (similar to BAS)

      Best regards

      Thorsten

      Author's profile photo Ian Quigley
      Ian Quigley
      Blog Post Author

      Thanks Thorsten Klingbeil for the feedback.

       

      Your comments and wishes are duly noted :). It's always great to hear suggestions on how we should improve the generator going forward.   I'll see what we can do.

       

      Best regards,

      Ian

      Author's profile photo Pieter Janssens
      Pieter Janssens

      Hi Ian,

      Some suggestions:

      Wishlist:

      Author's profile photo Ian Quigley
      Ian Quigley
      Blog Post Author

      Hi Pieter,

       

      Thank you for the great feedback.  We will certainly take your comments and suggestions under discussion, if we haven't already.

       

      Best regards,

      Ian

       

      Author's profile photo Pieter Janssens
      Pieter Janssens

      Hi Ian,

      Two additional suggestions:

      • Provide a way to scaffold a freestyle app without a data source
      • Use Github (at least for gathering issues/enhancement request) like these 🙂

       

      All the best,

      Pieter

      Author's profile photo Ian Quigley
      Ian Quigley
      Blog Post Author

      Thanks again Pieter :),

       

      • Provide a way to scaffold a freestyle app without a data source

       

      FYI, if you choose the Freestyle template "SAPUI5 Application", you do have the option of providing "None" as the data source and continuing.  For the other templates, you currently need a data source to bind to the template.  Hope that helps?

       

      • Use Github (at least for gathering issues/enhancement request) like these

       

      Agreed.  Hopefully that's something we can get to.