Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
cancel
Showing results for 
Search instead for 
Did you mean: 
matthias_schmalz
Product and Topic Expert
Product and Topic Expert
58,872

Update on 01.09.2020


In the meantime, a lot has happened on the tool side for SAPUI5 and SAP Fiori: SAP Business Application Studio (BAS) has been introduced as the next generation of SAP Web IDE. BAS is a modern development environment based on standards and open sources, which significantly improves the development experience for SAPUI5 and SAP Fiori. You'll find more details in this blog.

 

SAPUI5 app development has evolved considerably in the past years. The demands of the developers on their development environment have grown, and other tools have become the environment of choice for JavaScript development.

Because there are more powerful development environments out there that offer integration with SAPUI5 app development (see for example the ui5-ecosystem-showcase), we have decided to retire the SAPUI5 Tools for Eclipse. They will no longer be updated after UI5 release 1.71 and won’t support Eclipse versions higher than 2019-12.

In this blog post, we want to show you some alternatives for the following aspects, so that you can make a smooth transition:

  • Alternative development environments

  • Source revisioning with Git


Alternative Development Environments


SAP Business Application Studio (BAS)


SAP generally recommends SAP Business Application Studio (BAS) for SAPUI5 development. It is a cloud based development environment and the successor of SAP Web IDE, which has been deprecated in favor of BAS.

It offers the biggest feature set and integrates easily with ABAP on-premise and Cloud platforms as well as SAP Cloud Platform. Here are some of BAS major advantages:

  • Wizards and templates for creating new state–of–the–art SAP Fiori applications, including OData service connections

  • Specialized editors like the SAPUI5 Visual Editor or the Descriptor Editor for the application descriptor

  • Static code checks (e.g. linting)

  • Native integration with SAPUI5 Tooling and SAP Fiori Tools

    • Automatic build integration

    • Easy preview of your app, supporting various modes

    • Deployment to on-premise and cloud environments

    • Developing adapation projects for existing SAP Fiori apps



  • Developing of other SAP functionalities like annotation modeler


SAP Web IDE (Deprecated)


SAP Web IDE offers a rich feature set and integrates easily with ABAP on-premise platforms as well as SAP Cloud Platform. However it has been deprecated in the meanwhile and it is recommended to migrate to BAS.
Here are some of SAP Web IDE’s major features:

  • Wizards and templates for creating new state–of–the–art SAP Fiori applications, including OData service connections

  • Specialized editors like the SAPUI5 Visual Editor or the Descriptor Editor for the application descriptor

  • Static code checks (e.g. linting)

  • Automatic build integration

  • Easy preview of your app, supporting various modes

  • Deployment to on-premise and cloud environments

  • Developing extensions for existing SAP Fiori apps

  • Developing of other SAP functionalities like annotation modeler

  • For more information about SAP Web IDE, see here.


Development Environment of Your Choice


Especially if you cannot use SAP BAS or SAP Web IDE in the cloud, you can generally use any IDE that supports JavaScript development. Here are some popular ones:

  • Visual Studio Code

  • Sublime

  • WebStorm


We will give you some guidance on some handy functions that will work in any development environment in a later blog post.

By the way: You could even use Eclipse – we’re only retiring the SAPUI5 Tools for Eclipse (i.e. the ABAP repository team provider and the app development tools). Of course, Eclipse still works as a development environment on its own.

Source Revisioning


With the ABAP repository team provider that was part of the SAPUI5 Tools for Eclipse you synchronized your projects with the ABAP system. This was a mixed scenario where we used the ABAP repository as the source revisioning system and for deploying the app for productive usage.

This had some disadvantages:

  • If many developers were working on the same project, this could cause conflicts, especially if multiple ABAP transports were used.

  • There was no way to build an optimized version of your app and deploy this for productive usage.

  • Code reviews by other developers were complicated.


For UI5 app development, we recommend Git as the source code repository and for deploying the final app to ABAP to production.

Git is the state–of–the–art source revisioning system and by far the most popular one among software developers. It offers powerful features like:

  • Easy branching for feature development

  • Conflict resolution

  • User-friendly code reviews

  • Supported by most modern IDEs or via command line (including SAP Web IDE and Eclipse)


The deployment to the ABAP system is a separate process, which can also be automated by a Continuous Integration pipeline.

The following blogs give good introductions into working with Git and build pipelines:

Getting Started – What is Git?

CI/CD for SAPUI5 on ABAP with GitLab

Continuous Integration (CI) Best Practices with SAP – Introduction and Navigator

How to Migrate Your Existing Eclipse Projects to Git


There are many ways to set up your projects with Git. It is recommended to have one repository per project, but you could also have multiple projects in one repository.

With the following steps in Eclipse, you will create a Git repository for each of your existing Eclipse UI5 projects, disconnect the old ABAP repository team provider, and keep the project at the current location in your file system.

  1. In Eclipse, enable automatic product sharing via Window -> Preferences -> Team -> Git -> Projects -> Automatically share projects located in a Git repository.

  2. Set up an empty Git repository via Eclipse to transfer the existing project to Git remote server as follows:

    1. Retrieve the up–to–date sources from the ABAP server. Ensure that any other developers have already submitted their changes.

    2. Disconnect the ABAP repository team provider from your project: Right-click on the project and choose Team -> Unshare Project.

    3. To create a Git repository in your project folder, open the Git Repositories view and choose Create a new local Git repository. Then select the project folder.

    4. Configure the remote repository to be able to push and fetch.

    5. Go to the Git Staging view, commit all project files (including .project and other .settings files) and push them. Ensure that the changes are submitted to the master branch.



  3. Now that you have finished the initial setup and filled the new Git repository with content, all other developers who previously worked with the project in Eclipse have some work to do:

    1. Delete the Eclipse project completely.

    2. Clone the Git repository to a destination of your choice. It can be inside the Eclipse workspace or in a separate Git folder

    3. Import the project into Eclipse via File -> Import… -> General -> Existing Projects into Workspace.




 

If you still want to use the SAPUI5 Tools for Eclipse…


… you can do so. Your current development environment will not stop working all of a sudden, but you have to keep the following restrictions in mind:

  • There will be no maintenance anymore, such as bug fixes.

  • There will be no support for Eclipse releases higher than 2019-12. If you want to update to a higher Eclipse release, you do this at your own risk.

  • Keep in mind: If you also use the ABAP Development Tools (ADT) in Eclipse, you will have to update your Eclipse version sooner or later if a new version of the ADT requires this.

  • No new UI5 versions will be packaged to be used in the Web App Preview. If you want to use newer UI5 version than 1.71, can configure the preview to use UI5 from a remote location (e.g. your ABAP system): For this, you can use com.sap.ui5.proxy.REMOTE_LOCATION in the web.xml file to provide the ABAP system from where the new UI5 version should be served from. See also Use a SimpleProxyServlet for Testing to Avoid Cross-domain Requests.


<context-param>
<param-name>com.sap.ui5.proxy.REMOTE_LOCATION</param-name>
<param-value>{protocol}://{host name}:{port number}</param-value>
</context-param>

Further Information


In the next blog post How to Get Your Preferred JavaScript IDE Ready for SAPUI5 Development we give you some more information and hints about developing UI5 in local IDEs that support JavaScript development especially how to preview your app and deploy it to an ABAP system.
9 Comments