Desarrollo de aplicaciones web móviles
Post on 01-Nov-2014
927 Views
Preview:
DESCRIPTION
Transcript
Desarrollo de aplicaciones web móviles
¿Qué es Mozilla?
¿Qué es Mozilla?
Comunidad global que considera que Internet debe ser un bien para
beneficio de la humanidad, para lo que es clave promover su apertura e
innovación.
Ahora si, hablemos de móviles
Desarrollo para móviles: Nativo● Android
● iOS
Desarrollo para móviles: Nativo● Blackberry
● Symbian
● Bada
● Windows Mobile OS / Windows Phone
Desarrollo para móviles: Multiplataforma
● PhoneGap (Apache Cordova)
● Sencha Touch
● AppAcelerator
● Rhodes
Desarrollo para móviles● Web móvil
– Un sólo desarrollo
– Muchas plataformas
El mercado de los navegadores móviles
http://arstechnica.com/information-technology/2012/08/ firefox-continues-to-gain-as-internet-explorer-chrome-slide/
Conoce las capacidades de los móviles
Resoluciones de pantalla y PPI
Touchscreens● Resistivas
● Capacitivas
Orientación● Lanscape vs Portrait
Acelerómetro● Giroscopio que registra movimientos en
tres ejes
Sensor de proximidad● Si al llamar y acercar a la oreja la
pantalla se apaga, y al alejarlo la pantalla se enciende: ¡Felicidades, tienes uno!
Teclado físico
GPS
Cámara (y QR)
Wireless (WiFi, 3G)
jQuery Mobile
Introducción a jQuery Mobile
¿Cómo me ayuda jQuery Mobile?1. Una disposición que se ve casi igual en cada móvil.
2. Un diseño adaptable a móviles y escritorios.
3. Proporciona velocidad y funcionalidad.
4. Ayuda a reducir el ancho de banda usado en el móvil.
Plataformas soportadas● A-grade
– Apple iOS 3.2-5.0
– Android 2.1-2.3, 3.1, 4.0
– Blackberry 6, 7
– Opera Mobile 11.5
– Y muchos más ...
Plataformas soportadas● B-grade
– Blackberry 5
– Opera Mini (5.0-6.5)
– Nokia Symbian^3
¡Hora de construir!
Caso: Servicio de una ruta de transporte● Ejemplo: El Metropolitano (Android)
¿Qué vamos a hacer?● Estructura de la página principal
● Pop-ups
● Formularios
● Imágenes
● Mapas
Una idea de implementación● Una aplicación web móvil
● Un repositorio en GitHub
● GitHub Pages
● juaneladio.github.com/Metropolitano-Mobile
¿Qué posibilidades adicionales hay?● Incrustar video
● Codificar tu propio video para móviles
● Crear códigos QR
● 'Minimizar' código CSS y JS
● Usar emuladores de móviles
¿Qué posibilidades adicionales hay?● Construir una aplicación con PhoneGap
y jQuery Mobile.
La filosofía de PhoneGap● http://phonegap.com/2012/05/09/phonegap-beliefs-goals-
and-philosophy/
“We have two high level goals with PhoneGap:
The web as a first class development platform.
The ultimate purpose of PhoneGap is to cease to exist.”
Bibliografía (1)
http://jquerymobile.com/demos/1.1.1/
Bibliografía (2)● Sams Teach Yourself jQuery
Mobile in 24 Hours
● By: Phil Dutson
● Publisher: Sams
● Pub. Date: July 13, 2012
● Pages in Print Edition: 496
Y más● The Mobile Frontier, by: Rachel Hinman
(Rosenfeld Media)● Programming the Mobile Web, by:
Maximiliano Firtman (O'Reilly Media, Inc.)● HTML, CSS, and JavaScript Mobile
Development For Dummies, by: William Harrel (For Dummies)
● Sams Teach Yourself HTML5 Mobile Application Development in 24 Hours, by: Jennifer Kyrnin (Sams)
● jQuery Mobile, by: Jon Reid (O'Reilly Media, Inc.)
●
● jQuery Mobile First Look, by: Giulio Bai (Packt Publishing)
● Pro jQuery Mobile, by: Brad Broulik (Apress)
● Mobile Design Pattern Gallery, Color Edition, by: Theresa Neil (O'Reilly Media, Inc.)
● Designing Mobile Interfaces, by: Steven Hoober; Eric Berkman (O'Reilly Media, Inc.)
●
Y más (2)●
● Build Mobile Websites and Apps for Smart Devices, by: Earle Castledine; Myles Eftos; Max Wheeler (SitePoint)
● PhoneGap Essentials: Building Cross-Platform Mobile Apps, by: John M. Wargo (Addison-Wesley Professional)
● Beginning PhoneGap, by: Thomas Myer (Wrox)
● PhoneGap Beginner's Guide, by: Andrew Lunny (Packt Publishing)
Mozilla en el frente móvil
Futuras publicaciones de Firefox
Firefox (Estable), Aurora y Mobilefirefox.com/channel
Firefox Mobile
Firefox OS
Mozilla Marketplace
The Kilimanjaro Eventhttps://wiki.mozilla.org/Kilimanjaro
¿Porqué hacemos esto?
Mozilla Perú
/mozillaperu
top related