Upload
cesar-eduardo-suarez-t
View
198
Download
3
Embed Size (px)
DESCRIPTION
Presentación de phonegap 2014
Citation preview
2. @cesarlarsson 3. QUE ES PHONEGAP?S Este framework nace en SanFrancisco en 2009 por laempresa Nitobi Softwareobteniendo el premio del publicoen el OReilly Media de ese ao.S En Octubre de 2011 Adobecompra Nitobi@cesarlarsson 4. cmo funciona?Esta grafica ilustra fcilmente como funciona @cesarlarsson 5. Una imagen vale ms que mil palabras 6. Tipo de aplicacionesWeb Apps: Portales o aplicaciones web diseadas para verse biendesde dispositovs moviles y/o tabletas.Hybrid Apps: Son aplicaciones web empaquetadas dentro un browserde pantalla completa las cuales cuentan con extensiones para accedera funcionalidades del hardware del equipo.Native Apps: Son escritas en diferentes lenguajes dependiendo de lapaltaforma. Tiene acceso completo a todas las capacidades deldispositivo.@cesarlarsson 7. Otras alternativaswww.appcelerator.comwww.xamarin.comwww.sencha.com 8. Phonegap vs TitaniumPhonegap es una aplicacin web quese ejecuta en la vista de unnavegador web nativo. Nos permiteusar HTML5, CSS3 y JavaScript, ascomo frameworks de interfaz deusuario (front-end), como JqueryMobile, Sencha, etcAppcelerator es JavaScript puro yduro, que se compila a cdigonativo. Phonegap es compatiblecon muchas ms plataformas(sobre todo plataformas mviles),pero Appcelerator puede darnosun mejor rendimiento en segnqu casos, como por ejemploanimaciones. 9. Primeros pasosS Lo primero que tenemos que saber que a pesar deque nuestra aplicacin tcnicamente solo la vamos aescribir una vez (html- css -javascript). Cadaplataforma de desarrollo tiene sus libreras propiaspara la compilacin del proyecto.S En esta gua hablaremos de Android y iOS 10. Instalando Phonegap1- Instalar NODE.JS http://nodejs.org/download/2- Instalar desde la terminal3- Crear y correr nuevo proyecto 11. Hardware soportado 12. Ambiente de trabajoNo es necesario un IDE especifico para desarrollar en Phonegap, pero recomiendoNetbeans que desde su versin 8 permite desarrollar un proyecto para Phonegap deManera facil. 13. Javascript, Que puedo usar? 14. JQuery MobileS jQuery mobile es un framework de javascript queextiende la funcionalodad del framework estandar dejQuery como lo hace jQueryUI para las aplicacionesweb. 15. Por qu JQuery Mobile?S Nuestra aplicacin requiere una interfaz, es por eso que recurrimos ajQuery Mobile.S Ventajas: Simple: El framework es muy facil de usar. Mejora progresiva: La filosofa de jQuery Mobile es soportar tanto lagama alta de los dispositivos, como aquellos que no soportan grandesfuncionalidades. Accesibilidad: jQuery Mobile ha sido diseado pensando en laaccesibilidad. Tamao pequeo: El tamao total de jQuery Mobile framework esrelativamente pequeo. Unos 12kb de la biblioteca JavaScript, 6kb deCSS y algunos conos. Tematizacin: proporciona un sistema de temas que nos ofrece unaaplicacin a nuestro propio estilo. 16. BenchmarkArea JQueryMobile Sencha Touch SproutCore DHTMLX Touch jQTouch Dojo Toolkit Vaadin GWTExecution 70% 75% 58% 62% 55% 55% 57% 57%Development 98% 77% 52% 73% 80% 64% 41% 52%Product 88% 100% 48% 48% 55% 60% 48% 63%Support and65% 65% 65% 65% 65% 65% 65% 65%DocumentationAcumulated score 3,20 3,17 2,23 2,47 2,55 2,44 2,10 2,36Average 80,06% 79,32% 55,78% 61,72% 63,64% 60,91% 52,52% 59,11% 17. Estructura bsica 18. S Un solo documento html puede contener multiples paginas 19. EtiquetasComponent HTML5 data-*Header, Footer