SlideShare ist ein Scribd-Unternehmen logo
1 von 23
Downloaden Sie, um offline zu lesen
IOS APPS MIT WEBTECHNOLOGIEN
          ERSTELLEN
           EIN ÜBERBLICK
MICHAEL KÜHNEL
Macht Internet seit Netscape 4.7

Frontend Developer bei der SMA Solar Technology AG
Twitter: @mkuehnel

Website: www.michael-kuehnel.de
WORUM GEHT ES
UIWebView

Apache Cordova (PhoneGap)
Appcelerator Titanium
NATIVE APPS = NATIVE TOOLCHAIN
                      VORAUSSETZUNGEN
Apple Macintosh

iOS SDK
   Xcode IDE
   UIKit Framework, iPhone-Simulator, weitere Tools, Compiler etc.

iOS Developer Program ( $99/Jahr )
UIWEBVIEW
 “ You use the UIWebView class to embed web content in your
  application. To do so, you simply create a UIWebView object,
attach it to a window, and send it a request to load web content.
                                 ”

                 Siehe developer.apple.com
FAKTEN
»Container« für Webinhalte

Bestandteil des Apple UIKit Frameworks

Kann »interne« und »externe« Inhalte laden

Build Prozess über Xcode
Native APIs teilweise über HTML5 APIs nachrüstbar:
    Offline / Storage : Application Cache, Local Storage, Web SQL & Indexed
   Database
    Geolocation , Media Capture and File API
VORTEILE
»Freiheit« in der Webentwicklung:
   Serverseitige -> Datenbanken, Skriptsprachen etc.

   Clientseitig -> Datenbanken, CSS und JavaScript Frameworks etc.
Gleiche Code-Basis ggf. für andere Plattformen nutzbar.
NACHTEILE
Performance: Andere JavaScript Engine als in Mobile Safari

Rudimentäre iOS SDK und Objective-C Kentnisse nötig
APACHE CORDOVA (PHONEGAP)




“ Apache Cordova is a platform for building native mobile
     applications using HTML, CSS and JavaScript. ”

        Siehe incubator.apache.org/cordova
FAKTEN
»Container« für Webinhalte
Kann nur mit »internen« Inhalten (HTML, CSS, Javascript) umgehen

Build Prozess über Xcode
Zusätzliche Javascript Device APIs:
Accelerometer , Camera , Capture , Compass , Connection , Contacts , Device ,
Events , File , Geolocation , Media , Notification , Storage
VORTEILE
»Freiheit« in der Webentwicklung:
   Clientseitig -> CSS und JavaScript Frameworks etc.
Alle wichtigen Geräte APIs werden unterstützt

Gleiche Code-Basis für andere Devices nutzbar:
    Unterstützt zur Zeit 7 mobile Plattformen.

Open Source und kostenlos
NACHTEILE
Performance: Andere JavaScript Engine als in Mobile Safari

Kein Einsatz von serverseitigen Scriptsprachen möglich
APPCELERATOR TITANIUM SDK




“ Create rich native iOS, Android, hybrid, and mobile web apps
             from a single JavaScript-based SDK. ”

                 Siehe appcelerator.com
FAKTEN
JavaScript basierte Plattform
   »JavaScript« -> »Objective C« Bridge

   Man programmiert JavaScript und die App nutzt letzlich native APIs
   Unterstütztung von JavaScript Modulen nach der
   CommonJS Module Specification

Build Prozess über Titanium Studio
VORTEILE
Native UI Elemente
Performance

Gleiche Code-Basis für andere Devices nutzbar:
    Unterstützt zur Zeit 3 mobile Plattformen.
NACHTEILE
Pure JavaScript Lösung. Kein HTML, kein CSS.
Kein Einsatz von serverseitigen Scriptsprachen möglich

Kommerzieles Produkt mit dem eine Firma Geld verdienen muss. Siehe
Preistabelle .
FAZIT
           »RICHTIGE« APPS BENÖTIGEN »RICHTIGE« APIS
Kein Unterschied an API Features zwischen Cordova und Titanium SDK

Letzlich eine Sache der persönlichen Präferenz:
   Performance vs. Flexibilität …
   Vorhandenes Wissen … etc …
DIREKTER VERGLEICH EINER APP IN ENTWICKLUNG
            »WORKOUT LOG« AUF GITHUB
                 Titanium Branch

                 Phonegap Branch
ALTERNATIVEN
RUBYMOTION
   “ RubyMotion is a revolutionary toolchain for iOS. It lets you
  quickly develop and test native iOS applications for iPhone or
iPad, all using the awesome Ruby language you know and love. ”

                   Siehe rubymotion.com
CORONA
   “ With Corona, you will develop mobile apps in record time.
Develop in Lua, an easy-to-learn language that coupled with our
elegant APIs allow you to add features like Facebook and physics
                   in just a few lines of code. ”

                   Siehe coronalabs.com
DAS WARS ; )




FRAGEN?
Twitter: @mkuehnel
E-Mail: mail@michael-kuehnel.de
APPENDIX – LINKS
Mobile JavaScript/CSS Frameworks
         Zepto
         jQTouch

         jQuery Mobile

         Sencha Touch

         Kendo UI Mobile
         Foundation 3

         Sidetap

Weitere ähnliche Inhalte

Was ist angesagt?

Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...Gregor Biswanger
 
Die besten 10 JavaScript Frameworks für moderne Web-Apps
Die besten 10 JavaScript Frameworks für moderne Web-AppsDie besten 10 JavaScript Frameworks für moderne Web-Apps
Die besten 10 JavaScript Frameworks für moderne Web-AppsDieter Ziegler
 
Spring - Frühling fürs iPhone - Spring-basierte Backends für iOS-Applikatione...
Spring - Frühling fürs iPhone - Spring-basierte Backends für iOS-Applikatione...Spring - Frühling fürs iPhone - Spring-basierte Backends für iOS-Applikatione...
Spring - Frühling fürs iPhone - Spring-basierte Backends für iOS-Applikatione...OPITZ CONSULTING Deutschland
 
Spiele entwickeln mit dem Adobe AIR SDK
Spiele entwickeln mit dem Adobe AIR SDKSpiele entwickeln mit dem Adobe AIR SDK
Spiele entwickeln mit dem Adobe AIR SDKIndieOutpost
 
Progressive Web Apps Presentation
Progressive Web Apps PresentationProgressive Web Apps Presentation
Progressive Web Apps PresentationSteffen Wagner
 
Erstellung von mobilen cross-platform-Apps
Erstellung von mobilen cross-platform-AppsErstellung von mobilen cross-platform-Apps
Erstellung von mobilen cross-platform-AppsRalf Lütke
 
UI5 Custom Controls (German language!) - Präsentation von den DSAG Thementage...
UI5 Custom Controls (German language!) - Präsentation von den DSAG Thementage...UI5 Custom Controls (German language!) - Präsentation von den DSAG Thementage...
UI5 Custom Controls (German language!) - Präsentation von den DSAG Thementage...Andreas Kunz
 
Digital Publishing Suite v29 Update
Digital Publishing Suite v29 UpdateDigital Publishing Suite v29 Update
Digital Publishing Suite v29 UpdateMichaela Lehr
 
Hochschule Darmstadt: NZSE/ENA Gastvortrag Xamarin/Fuse
Hochschule Darmstadt: NZSE/ENA Gastvortrag Xamarin/FuseHochschule Darmstadt: NZSE/ENA Gastvortrag Xamarin/Fuse
Hochschule Darmstadt: NZSE/ENA Gastvortrag Xamarin/FuseJens Becker
 
User Interface Trends für Geschäftsanwendungen
User Interface Trends für GeschäftsanwendungenUser Interface Trends für Geschäftsanwendungen
User Interface Trends für GeschäftsanwendungenStefan von Niederhäusern
 

Was ist angesagt? (12)

Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
 
.NET MAUI
.NET MAUI.NET MAUI
.NET MAUI
 
Die besten 10 JavaScript Frameworks für moderne Web-Apps
Die besten 10 JavaScript Frameworks für moderne Web-AppsDie besten 10 JavaScript Frameworks für moderne Web-Apps
Die besten 10 JavaScript Frameworks für moderne Web-Apps
 
Spring - Frühling fürs iPhone - Spring-basierte Backends für iOS-Applikatione...
Spring - Frühling fürs iPhone - Spring-basierte Backends für iOS-Applikatione...Spring - Frühling fürs iPhone - Spring-basierte Backends für iOS-Applikatione...
Spring - Frühling fürs iPhone - Spring-basierte Backends für iOS-Applikatione...
 
Spiele entwickeln mit dem Adobe AIR SDK
Spiele entwickeln mit dem Adobe AIR SDKSpiele entwickeln mit dem Adobe AIR SDK
Spiele entwickeln mit dem Adobe AIR SDK
 
Progressive Web Apps Presentation
Progressive Web Apps PresentationProgressive Web Apps Presentation
Progressive Web Apps Presentation
 
Erstellung von mobilen cross-platform-Apps
Erstellung von mobilen cross-platform-AppsErstellung von mobilen cross-platform-Apps
Erstellung von mobilen cross-platform-Apps
 
UI5 Custom Controls (German language!) - Präsentation von den DSAG Thementage...
UI5 Custom Controls (German language!) - Präsentation von den DSAG Thementage...UI5 Custom Controls (German language!) - Präsentation von den DSAG Thementage...
UI5 Custom Controls (German language!) - Präsentation von den DSAG Thementage...
 
Digital Publishing Suite v29 Update
Digital Publishing Suite v29 UpdateDigital Publishing Suite v29 Update
Digital Publishing Suite v29 Update
 
Hochschule Darmstadt: NZSE/ENA Gastvortrag Xamarin/Fuse
Hochschule Darmstadt: NZSE/ENA Gastvortrag Xamarin/FuseHochschule Darmstadt: NZSE/ENA Gastvortrag Xamarin/Fuse
Hochschule Darmstadt: NZSE/ENA Gastvortrag Xamarin/Fuse
 
Was ist Omnis?
Was ist Omnis?Was ist Omnis?
Was ist Omnis?
 
User Interface Trends für Geschäftsanwendungen
User Interface Trends für GeschäftsanwendungenUser Interface Trends für Geschäftsanwendungen
User Interface Trends für Geschäftsanwendungen
 

Andere mochten auch

Frontend Coding Guidelines - Ein Baustein zur Qualitätssicherung
Frontend Coding Guidelines - Ein Baustein zur QualitätssicherungFrontend Coding Guidelines - Ein Baustein zur Qualitätssicherung
Frontend Coding Guidelines - Ein Baustein zur QualitätssicherungMichael Kühnel
 
Cross Browser Testing mit DalekJS
Cross Browser Testing mit DalekJSCross Browser Testing mit DalekJS
Cross Browser Testing mit DalekJSMichael Kühnel
 
The state of JavaScript Linting - Deutsche Version
The state of JavaScript Linting - Deutsche VersionThe state of JavaScript Linting - Deutsche Version
The state of JavaScript Linting - Deutsche VersionMichael Kühnel
 
The state of JavaScript Linting - English version
The state of JavaScript Linting - English versionThe state of JavaScript Linting - English version
The state of JavaScript Linting - English versionMichael Kühnel
 
jQuery .data() und HTML5 data Attribute
jQuery .data() und HTML5 data AttributejQuery .data() und HTML5 data Attribute
jQuery .data() und HTML5 data AttributeMichael Kühnel
 
Tools and Tips for Moodle Developers - #mootus16
 Tools and Tips for Moodle Developers - #mootus16 Tools and Tips for Moodle Developers - #mootus16
Tools and Tips for Moodle Developers - #mootus16Dan Poltawski
 
Study: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving CarsStudy: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving CarsLinkedIn
 
Hype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerHype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerLuminary Labs
 

Andere mochten auch (8)

Frontend Coding Guidelines - Ein Baustein zur Qualitätssicherung
Frontend Coding Guidelines - Ein Baustein zur QualitätssicherungFrontend Coding Guidelines - Ein Baustein zur Qualitätssicherung
Frontend Coding Guidelines - Ein Baustein zur Qualitätssicherung
 
Cross Browser Testing mit DalekJS
Cross Browser Testing mit DalekJSCross Browser Testing mit DalekJS
Cross Browser Testing mit DalekJS
 
The state of JavaScript Linting - Deutsche Version
The state of JavaScript Linting - Deutsche VersionThe state of JavaScript Linting - Deutsche Version
The state of JavaScript Linting - Deutsche Version
 
The state of JavaScript Linting - English version
The state of JavaScript Linting - English versionThe state of JavaScript Linting - English version
The state of JavaScript Linting - English version
 
jQuery .data() und HTML5 data Attribute
jQuery .data() und HTML5 data AttributejQuery .data() und HTML5 data Attribute
jQuery .data() und HTML5 data Attribute
 
Tools and Tips for Moodle Developers - #mootus16
 Tools and Tips for Moodle Developers - #mootus16 Tools and Tips for Moodle Developers - #mootus16
Tools and Tips for Moodle Developers - #mootus16
 
Study: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving CarsStudy: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving Cars
 
Hype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerHype vs. Reality: The AI Explainer
Hype vs. Reality: The AI Explainer
 

Ähnlich wie iOS Apps mit Webtechnologien erstellen

We4IT LCTY 2013 - captain mobility - delivering your existing ibm domino appl...
We4IT LCTY 2013 - captain mobility - delivering your existing ibm domino appl...We4IT LCTY 2013 - captain mobility - delivering your existing ibm domino appl...
We4IT LCTY 2013 - captain mobility - delivering your existing ibm domino appl...We4IT Group
 
Automatisierte Generierung hybrider Apps für Mobile Devices (Kolloquium)
Automatisierte Generierung hybrider Apps für Mobile Devices (Kolloquium)Automatisierte Generierung hybrider Apps für Mobile Devices (Kolloquium)
Automatisierte Generierung hybrider Apps für Mobile Devices (Kolloquium)Jens Küsters
 
Java in the Cloud - am Beispiel der Google App Engineg
Java in the Cloud - am Beispiel der Google App EnginegJava in the Cloud - am Beispiel der Google App Engineg
Java in the Cloud - am Beispiel der Google App Engineggedoplan
 
Mobile Facts 2013: Apps & Websites
Mobile Facts 2013: Apps & WebsitesMobile Facts 2013: Apps & Websites
Mobile Facts 2013: Apps & WebsitesAdrian Oggenfuss
 
DACHNUG50 MX_Workshop.pdf
DACHNUG50 MX_Workshop.pdfDACHNUG50 MX_Workshop.pdf
DACHNUG50 MX_Workshop.pdfDNUG e.V.
 
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)greenrobot
 
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
.NET Core, .NET Standard & ASP.NET Core - Eine ÜbersichtJürgen Gutsch
 
Android Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickelnAndroid Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickelnAndré Krämer
 
ESE Conference: iOS, Android, WP7... Alle nativ auf einen Streich! streich
ESE Conference: iOS, Android, WP7...Alle nativ auf einen Streich! streichESE Conference: iOS, Android, WP7...Alle nativ auf einen Streich! streich
ESE Conference: iOS, Android, WP7... Alle nativ auf einen Streich! streichRomano Roth
 
Slides zum Impulsreferat: HCL UDP - DNUG Stammtisch Salzburg
Slides zum Impulsreferat: HCL UDP - DNUG Stammtisch SalzburgSlides zum Impulsreferat: HCL UDP - DNUG Stammtisch Salzburg
Slides zum Impulsreferat: HCL UDP - DNUG Stammtisch SalzburgDNUG e.V.
 
Rapid Application Development mit Openobject
Rapid Application Development mit OpenobjectRapid Application Development mit Openobject
Rapid Application Development mit Openobjectopenbig
 
Cross Plattform Entwicklung für Mobile Anwendungen
Cross Plattform Entwicklung für Mobile AnwendungenCross Plattform Entwicklung für Mobile Anwendungen
Cross Plattform Entwicklung für Mobile AnwendungenMarkus Eiglsperger
 
Referat: Architektur und Entwicklung mobiler Anwendungen
Referat: Architektur und Entwicklung mobiler AnwendungenReferat: Architektur und Entwicklung mobiler Anwendungen
Referat: Architektur und Entwicklung mobiler AnwendungenDigicomp Academy AG
 
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...DNUG e.V.
 
German: Softwareprodukte aus einem Source Code mit Javascript
German: Softwareprodukte aus einem Source Code mit JavascriptGerman: Softwareprodukte aus einem Source Code mit Javascript
German: Softwareprodukte aus einem Source Code mit JavascriptRalf Schwoebel
 
Cross-Apps-Entwicklung für iPhone, Android und Co.
Cross-Apps-Entwicklung für iPhone, Android und Co.Cross-Apps-Entwicklung für iPhone, Android und Co.
Cross-Apps-Entwicklung für iPhone, Android und Co.GFU Cyrus AG
 
JavaScript-Erweiterungen für UI und UX
JavaScript-Erweiterungen für UI und UXJavaScript-Erweiterungen für UI und UX
JavaScript-Erweiterungen für UI und UXKai Donato
 
Desktop Containers 12: Next Generation of ZENworks Application Virtualization
Desktop Containers 12: Next Generation of ZENworks Application VirtualizationDesktop Containers 12: Next Generation of ZENworks Application Virtualization
Desktop Containers 12: Next Generation of ZENworks Application VirtualizationGWAVA
 

Ähnlich wie iOS Apps mit Webtechnologien erstellen (20)

We4IT LCTY 2013 - captain mobility - delivering your existing ibm domino appl...
We4IT LCTY 2013 - captain mobility - delivering your existing ibm domino appl...We4IT LCTY 2013 - captain mobility - delivering your existing ibm domino appl...
We4IT LCTY 2013 - captain mobility - delivering your existing ibm domino appl...
 
Automatisierte Generierung hybrider Apps für Mobile Devices (Kolloquium)
Automatisierte Generierung hybrider Apps für Mobile Devices (Kolloquium)Automatisierte Generierung hybrider Apps für Mobile Devices (Kolloquium)
Automatisierte Generierung hybrider Apps für Mobile Devices (Kolloquium)
 
Java in the Cloud - am Beispiel der Google App Engineg
Java in the Cloud - am Beispiel der Google App EnginegJava in the Cloud - am Beispiel der Google App Engineg
Java in the Cloud - am Beispiel der Google App Engineg
 
Mobile Facts 2013: Apps & Websites
Mobile Facts 2013: Apps & WebsitesMobile Facts 2013: Apps & Websites
Mobile Facts 2013: Apps & Websites
 
DACHNUG50 MX_Workshop.pdf
DACHNUG50 MX_Workshop.pdfDACHNUG50 MX_Workshop.pdf
DACHNUG50 MX_Workshop.pdf
 
Hybride Entwicklung mit Ionic
Hybride Entwicklung mit IonicHybride Entwicklung mit Ionic
Hybride Entwicklung mit Ionic
 
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
Android Entwicklung (App Entwickler Konferenz 2010 der Telekom)
 
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
.NET Core, .NET Standard & ASP.NET Core - Eine Übersicht
 
Hdc2012 cordova-präsi
Hdc2012 cordova-präsiHdc2012 cordova-präsi
Hdc2012 cordova-präsi
 
Android Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickelnAndroid Apps mit Xamarin entwickeln
Android Apps mit Xamarin entwickeln
 
ESE Conference: iOS, Android, WP7... Alle nativ auf einen Streich! streich
ESE Conference: iOS, Android, WP7...Alle nativ auf einen Streich! streichESE Conference: iOS, Android, WP7...Alle nativ auf einen Streich! streich
ESE Conference: iOS, Android, WP7... Alle nativ auf einen Streich! streich
 
Slides zum Impulsreferat: HCL UDP - DNUG Stammtisch Salzburg
Slides zum Impulsreferat: HCL UDP - DNUG Stammtisch SalzburgSlides zum Impulsreferat: HCL UDP - DNUG Stammtisch Salzburg
Slides zum Impulsreferat: HCL UDP - DNUG Stammtisch Salzburg
 
Rapid Application Development mit Openobject
Rapid Application Development mit OpenobjectRapid Application Development mit Openobject
Rapid Application Development mit Openobject
 
Cross Plattform Entwicklung für Mobile Anwendungen
Cross Plattform Entwicklung für Mobile AnwendungenCross Plattform Entwicklung für Mobile Anwendungen
Cross Plattform Entwicklung für Mobile Anwendungen
 
Referat: Architektur und Entwicklung mobiler Anwendungen
Referat: Architektur und Entwicklung mobiler AnwendungenReferat: Architektur und Entwicklung mobiler Anwendungen
Referat: Architektur und Entwicklung mobiler Anwendungen
 
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
Slides (2) zu Teil 2 der Veranstaltungsreihe Anwendungsentwicklung mit Volt M...
 
German: Softwareprodukte aus einem Source Code mit Javascript
German: Softwareprodukte aus einem Source Code mit JavascriptGerman: Softwareprodukte aus einem Source Code mit Javascript
German: Softwareprodukte aus einem Source Code mit Javascript
 
Cross-Apps-Entwicklung für iPhone, Android und Co.
Cross-Apps-Entwicklung für iPhone, Android und Co.Cross-Apps-Entwicklung für iPhone, Android und Co.
Cross-Apps-Entwicklung für iPhone, Android und Co.
 
JavaScript-Erweiterungen für UI und UX
JavaScript-Erweiterungen für UI und UXJavaScript-Erweiterungen für UI und UX
JavaScript-Erweiterungen für UI und UX
 
Desktop Containers 12: Next Generation of ZENworks Application Virtualization
Desktop Containers 12: Next Generation of ZENworks Application VirtualizationDesktop Containers 12: Next Generation of ZENworks Application Virtualization
Desktop Containers 12: Next Generation of ZENworks Application Virtualization
 

iOS Apps mit Webtechnologien erstellen

  • 1. IOS APPS MIT WEBTECHNOLOGIEN ERSTELLEN EIN ÜBERBLICK
  • 2. MICHAEL KÜHNEL Macht Internet seit Netscape 4.7 Frontend Developer bei der SMA Solar Technology AG Twitter: @mkuehnel Website: www.michael-kuehnel.de
  • 3. WORUM GEHT ES UIWebView Apache Cordova (PhoneGap) Appcelerator Titanium
  • 4. NATIVE APPS = NATIVE TOOLCHAIN VORAUSSETZUNGEN Apple Macintosh iOS SDK Xcode IDE UIKit Framework, iPhone-Simulator, weitere Tools, Compiler etc. iOS Developer Program ( $99/Jahr )
  • 5. UIWEBVIEW “ You use the UIWebView class to embed web content in your application. To do so, you simply create a UIWebView object, attach it to a window, and send it a request to load web content. ” Siehe developer.apple.com
  • 6. FAKTEN »Container« für Webinhalte Bestandteil des Apple UIKit Frameworks Kann »interne« und »externe« Inhalte laden Build Prozess über Xcode Native APIs teilweise über HTML5 APIs nachrüstbar: Offline / Storage : Application Cache, Local Storage, Web SQL & Indexed Database Geolocation , Media Capture and File API
  • 7. VORTEILE »Freiheit« in der Webentwicklung: Serverseitige -> Datenbanken, Skriptsprachen etc. Clientseitig -> Datenbanken, CSS und JavaScript Frameworks etc. Gleiche Code-Basis ggf. für andere Plattformen nutzbar.
  • 8. NACHTEILE Performance: Andere JavaScript Engine als in Mobile Safari Rudimentäre iOS SDK und Objective-C Kentnisse nötig
  • 9. APACHE CORDOVA (PHONEGAP) “ Apache Cordova is a platform for building native mobile applications using HTML, CSS and JavaScript. ” Siehe incubator.apache.org/cordova
  • 10. FAKTEN »Container« für Webinhalte Kann nur mit »internen« Inhalten (HTML, CSS, Javascript) umgehen Build Prozess über Xcode Zusätzliche Javascript Device APIs: Accelerometer , Camera , Capture , Compass , Connection , Contacts , Device , Events , File , Geolocation , Media , Notification , Storage
  • 11. VORTEILE »Freiheit« in der Webentwicklung: Clientseitig -> CSS und JavaScript Frameworks etc. Alle wichtigen Geräte APIs werden unterstützt Gleiche Code-Basis für andere Devices nutzbar: Unterstützt zur Zeit 7 mobile Plattformen. Open Source und kostenlos
  • 12. NACHTEILE Performance: Andere JavaScript Engine als in Mobile Safari Kein Einsatz von serverseitigen Scriptsprachen möglich
  • 13. APPCELERATOR TITANIUM SDK “ Create rich native iOS, Android, hybrid, and mobile web apps from a single JavaScript-based SDK. ” Siehe appcelerator.com
  • 14. FAKTEN JavaScript basierte Plattform »JavaScript« -> »Objective C« Bridge Man programmiert JavaScript und die App nutzt letzlich native APIs Unterstütztung von JavaScript Modulen nach der CommonJS Module Specification Build Prozess über Titanium Studio
  • 15. VORTEILE Native UI Elemente Performance Gleiche Code-Basis für andere Devices nutzbar: Unterstützt zur Zeit 3 mobile Plattformen.
  • 16. NACHTEILE Pure JavaScript Lösung. Kein HTML, kein CSS. Kein Einsatz von serverseitigen Scriptsprachen möglich Kommerzieles Produkt mit dem eine Firma Geld verdienen muss. Siehe Preistabelle .
  • 17. FAZIT »RICHTIGE« APPS BENÖTIGEN »RICHTIGE« APIS Kein Unterschied an API Features zwischen Cordova und Titanium SDK Letzlich eine Sache der persönlichen Präferenz: Performance vs. Flexibilität … Vorhandenes Wissen … etc …
  • 18. DIREKTER VERGLEICH EINER APP IN ENTWICKLUNG »WORKOUT LOG« AUF GITHUB Titanium Branch Phonegap Branch
  • 20. RUBYMOTION “ RubyMotion is a revolutionary toolchain for iOS. It lets you quickly develop and test native iOS applications for iPhone or iPad, all using the awesome Ruby language you know and love. ” Siehe rubymotion.com
  • 21. CORONA “ With Corona, you will develop mobile apps in record time. Develop in Lua, an easy-to-learn language that coupled with our elegant APIs allow you to add features like Facebook and physics in just a few lines of code. ” Siehe coronalabs.com
  • 22. DAS WARS ; ) FRAGEN? Twitter: @mkuehnel E-Mail: mail@michael-kuehnel.de
  • 23. APPENDIX – LINKS Mobile JavaScript/CSS Frameworks Zepto jQTouch jQuery Mobile Sencha Touch Kendo UI Mobile Foundation 3 Sidetap