Skip to Content

Isn’t it fun when you can view your UI5 application online instead of localhost? Just follow these very simple steps to put your UI5 Application online.

Step 1: Login to your Google Drive account or sign up a new account

Step 2: Create a new folder and make it Public

– Right click the folder >> Share >> Change access to “Public on the web”


Step 3: Upload your resources (HTML, CSS, JS files) to Google Drive

– Copy the source code from tutorial: Create your First SAPUI5 Application in 20 seconds into a text editor and save it as index.html

<!DOCTYPE html>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>SAPUI5 in 20 Seconds</title>
    <!-- 1.) Load SAPUI5 (from a remote server), select theme and control library -->
    <script id="sap-ui-bootstrap" src="" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.ui.commons"></script>
    <!-- 2.) Create a UI5 button and place it onto the page -->
        // create the button instance
        var myButton = new sap.ui.commons.Button("btn");
         // set properties, e.g. the text (there is also a shorter way of setting several properties)
        myButton.setText("Hello World!");
         // attach an action to the button's "press" event (use jQuery to fade out the button)
        myButton.attachPress(function () {
         // place the button into the HTML element defined below
         // an alternative, more jQuery-like notation for the same is:
          $("#uiArea").sapui("Button", "btn", {
          text:"Hello World!",
<body class="sapUiBody">
    <!-- This is where you place the UI5 button -->
    <div id="uiArea"></div>

– Upload the file to the specified Google Drive folder: Choose Upload >> Files


Step 4: Preview the web page

– Right click the file and choose “Open with Google Drive Viewer”


– In the new tab, choose “Preview”


– And…Tada! The application is now published online


Note that the URL format is:<string>/<yourpage.html>.

Here is another example with SAPUI5 MVC TODO application hosted on Google Drive

If you have SVN you can check out the SAPUI5 MVC TODO from below GitHub repo

svn co

– Upload the 3 folder /css, /img, /js and file index.html to your shared folder


– And here’s the result:



– You can have your own domain and configure it to forward to your application hosted on Google Drive

– You can install Google Chrome extension Drive Notepad to edit your HTML file.

Now you can use OpenUI5 to create your own web application, be it a personal website, a gallery, a creative work or anything and publish it online!

Hope it helps. Cheers!

To report this post you need to login first.


You must be Logged on to comment or reply to a post.

    1. Gareth Ryan

      For a quick demo (which makes sense if you are using Google Drive) you could just use a single file app – have a quick search as there are examples of this here on SCN.

      My opinion, if you want a fully structured application with multiple source files then using Google Drive probably isn’t the best way forward.




Leave a Reply