Quantcast
Channel: SAPUI5 Developer Center
Viewing all articles
Browse latest Browse all 789

Google Drive hosting SAPUI5 apps

$
0
0

Hi guys.

This is my first post here and I'm going to talk a little bit about how to host a SAPUI5 App on Google Drive and share with everybody.

You don't need neither a domain nor a webserver. You can use Google Drive to publish and to use your UI5 apps.

It's very simple

 

 

 

1 - Access your Google Drive account

Go to the link https://drive.google.com/

 

 

 

2 - Create a new folder

Click on "CREATE" button.

gdrive1.png

 

Click on "Folder" button.

gdrive2.png

 

Give a name to your new folder.

gdrive3.png

 

Your new folder (SAPUI5 - GoogleDrive) has been created.

 

 

 

4 - Share your folder - Public access

Right-click on your new folder (SAPUI5-GoogleDrive), go to "Share" > "Share".

gdrive4.png

 

Your folder is not public, you can see the status: Private - Only you can access.
Click on "Change" to change the access permission.

gdrive5.png

 

Choose the option "Public on the web" and save.

gdrive6.png

 

Now your folder has public access and it has a hosting link. You can see clicking on Details button.

Everything that you upload to this folder can be accessed using the hosting URL.

gdrive7.png

 

 

 

5 - Create a SAPUI5 app

Create your new app: index.html

You can use the example below.

 

<!DOCTYPE html><html><head><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta charset="UTF-8"><title>SAPUI5 + Google Drive</title><meta name="author" content="Mauricio Lauffer"></head><body class="sapUiBody" role="application"><div id="content"></div><script id="sap-ui-bootstrap"
src="https://sapui5.hana.ondemand.com/sdk/resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m"></script><script type="text/javascript">
var oApp = new sap.m.App("myApp");
var oLabel = new sap.m.Label({
text : "Hello World"
});
var oPage = new sap.m.Page("page1", {
title : "SAPUI5 + Google Drive",
content : [ oLabel ]
});
oApp.addPage(oPage);
oApp.placeAt("content");</script></body></html>

 

I prefer to use XML view, but for simplicity's sake I used JS.

 

 

 

6 - Upload and Share the app to the Google Drive

Just upload your "index.html" file.

Yes, just it. You don't need to upload nothing more.

 

 

 

7 - Access the app

Did you remember the hosting link for your folder (SAPUI5-GoogleDrive)?

So, you'll use it to access your app.

 

Copy and paste the hosting URL in your browser (I hope it won't be Internet Explorer ).

Now just add your filename to the end of the URL.

It should look like it: https://googledrive.com/host/0B2gJUv6a_V1deXV4UWthQkdHbjQ/index.html

 

You can go straight by the file as well.

Click on your uploaded file and click on "Preview" button.

gdrive8.png

 

 

 

8 - The Result

I hope you enjoy your application and spread the word  

gdrive9.png

 

 

 

 

 

If you like to use GitHub (you should!), here's the link:

https://github.com/mauriciolauffer/UI5/tree/master/SAPUI5-GoogleDrive


Viewing all articles
Browse latest Browse all 789

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>