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.
Showing results for 
Search instead for 
Did you mean: 
Former Member

Spoiler alert: There is! :wink:

After posting my blog about how easy it is to get started with web development using OpenUI5 & JSBin, I thought I'd check out existing alternatives!

My result: There are quite a few really good ones. Developers call them Playgrounds. Playgrounds are the newest hit for front end developers and designers. They allow us to play around with code and see the live results while also being able to interact with it. It removes all the hurdles to actually getting started with coding! I wanted to see if I could make use of those playgrounds to run OpenUI5!

So, if you like front end playgrounds and do have a preference already, check out my greenfield OpenUI5 examples to get you started very quick:

PlaygroundOpenUI5 Greenfield (Mobile)Is OpenUI5 officially supported?


JSBin GreenField

YES. Thanks to dj.adams2 it is.

Just hit "Add Library" on the left side of the menu bar and choose "OpenUI5 latest (Mobile BlueCrystal)"


JSFiddle GreenField

JSFiddle Master Detail Sample

YES. Thanks to all of you guys, OpenUI5 was added recently! Here's how to add OpenUI5 properly as pointed out by Andreas Kunz.

Advise: Use the greenfield code sample to get a greenfield project.


Plunker GreenField

Plunker MVC GreenField

Kind of, I added the current version (1.24.5) to the packages. You can find it in the packages browser by clicking on "Find and add external libraries" on the right menu bar. Nevertheless, you'd need to add the data attributes to the script tag - which is unfortunate.

Solution: Just use the greenfield code sample.

Update: Denise Nepraunig (@denisenepraunig) published a nice greenfield MVC code example using separate files. Thanks very much Denise!


CodePen Greenfield

No. Only way is to modify the HTML settings (the gear-wheel icon on the left of the HTML pane). You need to set the script tag yourself to being able to set the data attributes that are required.

Status: Created a support ticket to get OpenUI officially supported.

Solution: Just use the greenfield code sample.

What is your preferred playground and why? Try them out and let me know!