Kurze Einführung in die Hybrid Mobile App Entwicklung und deren Architektur.

1. Hybrid App Development
mit Intel XDK
Hansruedi Tremp
M.A., MAS, dipl. W’Informatiker

2. Lernziele
• Sie können:
– die Architektur von Hybrid-Apps aufzeichnen und erläutern.
– die Stärken und Schwächen von Hybrid-Apps aufzählen.
– die verwendeten Frameworks in der Cross-Plattform
Entwicklungsumgebung XDK nennen.
– die Schritte im Entwicklungsprozess mit XDK darlegen.
– die Elemente der Schulungs-App "Währungsrechner" im XDK IDE
nachvollziehen.

3. Architektur Hybrid-App
Mobile API’s
Nativer App-
Rahmen
Content mit
HTML 5
CSS 3
JavaScript
Server
Web-APIs
REST

4. Stärken und Schwächen von Hybrid-Apps
• Vorteile
– Hohe Portabilität
– Tiefe Entwicklungskosten
– Schnelles Time-to-Market
– Vertrieb über App-Stores
– Zugriff auf alle Gerätefunktionen
• Nachteile
– Performance
– Gewisse Einschränkungen im Look-and-Feel des User-Interfaces
– Abhängigkeiten zu mehreren Entwicklungs-Frameworks

5. Cross-Plattform Development mit Intel XDK IDE
• Multiplattform-Framework
– Apache Cordova
cordova.apache.org
• Content
– Seitenstruktur
• HTML5
– Eigenschaften
• CSS 3
– Funktionalität
• JavaScript
• Frameworks:
– App Framework 3 (Intel)
– jQuery Mobile
– …

6. Quelle: cordova.apache.org

7. Entwicklungsprozess mit Intel XDK
Codieren
HTML
CSS
JS
Editor
Designer
Testen
in IDE
Emulator
Debugger
Testen
in Device
Preview App
Build
Generieren
der
plattformsp.
Apps
Distribuieren
Upload in die
gewünschten
Stores

8. Schulungs App
• Währungskonverter
• Die aktuelle Währung ist über
ein Web API zu holen
apilayer.net/api
• Wichtige Dateien:
wwwindex.html
wwwjsindex_user_scripts.js
• gesamtes XDK-Projekt:
– CurrConvJQMobileFramework.zip

9. Demo in Intel XDK