opensap mobile1 week 01 introduction to mobile development

7/29/2019 OpenSAP Mobile1 Week 01 Introduction to Mobile Development

http://slidepdf.com/reader/full/opensap-mobile1-week-01-introduction-to-mobile-development 1/44

Week 1 Unit 1:Mobility Drivers in Business

Today



© 2013 SAP AG. All rights reserved. 2Public

Mobil ity Drivers in Business TodayUbiquity of Mobility

7.3 bill ion devices in 2014

Mobile Internet - #1

disruptive technology of

our time




Mobil ity Drivers in Business TodayKey Industries Adopting Mobility

Enterprise mobility spreading rapidly

in manufacturing and retail

Mobile solutions transforming

industries




Mobil ity Drivers in Business Today The Tech-Savvy Generation

Rise of the information worker

Smart devices play a big role in

personal productivity.

Consumer apps drive our expectation

of business apps.




Mobil ity Drivers in Business Today The Competitive Edge

Businesses recognize the potential

of mobi le to optimize employee

performance.

SAP’s core strategy is aimed at

addressing the needs of the

information worker.




Mobil ity Drivers in Business TodayI Want Access, but I Am Denied!

Cost, supportabili ty, securi ty and

other barriers to adopt ion

The homogenous device strategy

Huge diversity in device type and

operating system; a highlyfragmented environment

The rise of mobile device

management

The emergence of BYOD




Mobil ity Drivers in Business TodayWhat This Means for You

There is an increasing demand for

mobi le application developers.

Application developers need to

understand enterprise mobi lity

requirements to get their apps

adopted.

The sky is the limit—there is huge

opportunity here.



Thank you

Contact information:

[email protected]


http://slidepdf.com/reader/full/opensap-mobile1-week-01-introduction-to-mobile-development 9/44© 2013 SAP AG. All rights reserved. 9Public

© 2013 SAP AG. All rights reserved.

No part of this publication may be reproduced or transmitted in any form or for any purpose without the express permission of SAP AG. The information contained herein may be changed without prior notice.

Some software products marketed by SAP AG and its distributors contain proprietary software components of other software vendors.

National product specifications may vary.

These materials are provided by SAP AG and its affiliated companies ("SAP Group") for informational purposes only, without representation orwarranty of any kind, and SAP Group shall not be liable for errors or omissions with respect to the materials. The only warranties for SAP Groupproducts and services are those that are set forth in the express warranty statements accompanying such products and services, if any. Nothingherein should be construed as constituting an additional warranty.

SAP and other SAP products and services mentioned herein as well as their respective logos are trademarks or registered trademarks of SAP AG inGermany and other countries.Please see http://www.sap.com/corporate-en/legal/copyright/index.epx#trademark for additional trademark information and notices.









Week 1 Unit 2:Paradigms in Mobile Computing



Paradigms in Mobile ComputingA Little Bit of History

1973 First call made with a mobile phone prototype by Motorola

1981 Osborne 1 – First “ portable” computer

1984 Psion Organizer – First handheld computer

1992 First 2G (GSM) mobi le phone

1996 Palm Pilot – First popular PDA

1996 Panasonic Toughbook – First ruggedized laptop

1997 Nokia Communicator smartphone

2002 Blackberry 5810 e-mail phone

2007 Asus EEE PC – First netbook

2007 Apple introduced iPhone

2008 First smartphone to run Android

2008 Apple iTunes App Store

2010 Apple iPad – First popular tablet

2012 Google Glass introduced



Paradigms in Mobile ComputingEarly Days

SMS and USSD

WAP

Embedded C

Symbian C++

J2ME

.Net Compact



Paradigms in Mobile ComputingMobile Web Applications

On-device Web browsers have

similar capability to desktop

browsers.

Increased power of devices allows

responsive marked up user

interfaces.

HTML5 and CSS3 greatly increase

client-side rendering capabilit ies.

Server delivers data, not pages.

Very popular—many HTML5 UIframeworks l ike SAPUI5 available.

SAP Fiori applications use this

paradigm.



Paradigms in Mobile ComputingNative Development

.Net, Objective-C, Dalvic Java

Currently preferred by developers

due to full control of the user

experience and device peripheral

integration

Most consumer applications are

native applications



Paradigms in Mobile ComputingHybrid Web Container

Defini tion: A native application

executing locally available Web

assets in an embedded browser

JavaScript is the control ler

language

HTML5 is used for UI rendering

Typically has JavaScript to native

code bridge or marshaling

capabilities

Will run any HTML5 UI framework

Hybrid App

(HTML5/CSS/J S)

Embeddable BrowserControl

Container Services

Encrypted Storage

Secure Messaging

User Security

Native Functionality

Hybrid Web Container



Paradigms in Mobile ComputingPros and Cons

• This list is not exhaustive; there

are also metadata-driven apps.

• Each paradigm has its strengths

and weaknesses.

• Week 5 will delve into the pros andcons of each of these paradigms.



Thank you


[email protected]



Week 1 Unit 3:Tools To Build Our First

Integrated Mobile App




Tools to Build Our First Integrated Mobile AppOverview

SAP NetWeaver Gateway

SAPUI5

Eclipse

Android Developer Tools

Apache Cordova

Google Chrome




Tools to Build Our First Integrated Mobile AppObtaining your SAP NetWeaver Gateway Trial Account

What is SAP NetWeaver

Gateway?

SAP NetWeaver Gateway wil l

provide our OData services

for our application.

Get your account at the

SAP Developer Center at

scn.sap.com

SRM SCM ERPPLMCRM

SAP Business Suite

SAP NetWeaver Gateway

OData

Browser-Based

Appl icat ion s

Mobile

Devices

Enterprise

Software

Consumer

DevicesCloud




Tools to Build Our First Integrated Mobile AppSAPUI5

SAPUI5 is an extensible JavaScript-

based HTML5 browser rendering

library for business applications.

It is used to build modern HTML5 Web

applications like SAP Fiori.

SAPUI5 has a server component, but

operates most ly on the client.

We wil l embed SAPUI5 in our Hybrid

Web Container.




Tools to Build Our First Integrated Mobile AppEclipse

Open source development environment

Eclipse IDE for Java EE developers:

http://www.eclipse.org/downloads/

Dependency on Java SDK:

http://www.oracle.com/technetwork/java/javase/downloads




Tools to Build Our First Integrated Mobile AppAndroid Developer Tools

Download the Android SDK:

http://developer.android.com/sdk/index.html

Install the ADT

plug-in in Eclipse:

https://dl-ssl.google.com/android/eclipse/




Tools to Build Our First Integrated Mobile AppPhoneGap / Apache Cordova

Download PhoneGap, also known as Apache Cordova.

Install Node JS.

npm install -g cordova

Use command line tool to

generate Android or iOS

Cordova project.




Tools to Build Our First Integrated Mobile AppGoogle Chrome

Use Chrome to Debug JavaScript .

Download

Google Chrome:

www.google.com/chrome



Thank you


[email protected]




Programming Knowledge J avaScript

Very popular script ing language

Used to manipulate Web pages

Can be executed in our

Cordova Hybrid Web Container

Exercise




Programming KnowledgeHTML5 and CSS3

HTML5 still under development

Suitable for cross-platform smart phone development

Introduces new syntax features <video>, <audio>, and <canvas>

HTML5 example

Learn more @

CSS3 example




Programming KnowledgeSAPUI5 – Model View Controller

SAPUI5 is SAP’s HTML5application framework.

It is built on top of an optimized

version of jQuery.

It uses the Model View

Controller design pattern.

<!DOCTYPE html>

<html><head>

<meta http-equiv="X-UA-Compatible"

content="IE=edge" />

<script id="sap-ui-bootstrap"

src="resources/sap-ui-core.js"

data-sap-ui-theme="sap_goldreflection"

data-sap-ui-libs="sap.ui.commons">

</script>

<script>

var btn = new sap.ui.commons.Button({

text: "Hello World"

});

btn.placeAt("content");

</script>

</head>

<body class="sapUiBody">

<div id="content"></div>

</body></html>




Programming KnowledgeOData

OData – ODBC for the Web

SAP has adopted OData as its main

service enablement standard for SAP

Web and mobi le applications.

Collections

Entities

Queries



Thank you


[email protected]



Week 1 Unit 5:My First Integrated Mobile App




My First Integrated Mobile AppOverview

First, develop and test our applicationas a Web application.

Generate container with ApacheCordova tools.

Use Eclipse to load project andincorporate Web assets.

Build and deploy.




My First Integrated Mobile AppWhat We Will Develop




My First Integrated Mobile App The Service We Will Use

SDN Developer Center ES1 system

Subset of the EPM model

https://sapes1.sapdevcenter.com/sap/opu/odata/sap/ZGWSAMPLE_SRV

$metadata for enti ties

Two OData entities:

1. Product

2. BusinessPartner




My First Integrated Mobile AppCreating Views and Binding Data

We wil l use four SAPUI5 views: App, ProductList , Product Detail, andSupplierDetail.

Views are separated into f iles and each view wil l have its own controller.

Use a central model for s imple global access to the data.



Thank you


[email protected]

opensap mobile1 week 01 introduction to mobile development

Documents