Post on 08-Aug-2015
description
Giancarlo Marín Gaitán TRUJILLO – PERÚ
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
giankrlo_91@hotmail.com
@GianMarin
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 1
Hola a todos, en esta oportunidad mostraré como hacer una aplicación web para dispositivos móviles. A modo de ejemplo haremos un website tomando
como base nuestra antigua página web www.ifxperu.com. Para el cual haremos lo siguiente:
1. Pre-requisitos:
a. Descargar jquery mobile aquí [http://jquerymobile.com/download/]
b. Descargar phonegap aquí [http://phonegap.com/download]
2. Crear nuestro Prototipo:
.
NOTA:
Pero, ¿Por qué es necesario crear un prototipo? Porque en realidad, es una buena
práctica, que nos servirá tener ya conceptualizado de cómo será el resultado final;
en este caso la apariencia del software y porque a su vez nos permite enfocarnos
principalmente en la experiencia del usuario
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 2
3. Una vez plasmado lo que se hará, procedemos a crear nuestras páginas web usando Dreamviewer, para el cual crearemos nuestro sitio
IFXPERU_WEBAPP_MOVIL.
4. Seleccionamos el nombre de la carpeta y del sitio donde se alojarán las páginas web.
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 3
5. Creamos un nuevo documento en blanco html5.
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 4
6. Agregamos los javascript y hojas de estilo del jquery-mobile y phonegap a nuestra carpeta ‘WebSite’ que hemos creado en el Dreamveawer
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 5
7. Ahora a continuación codificaremos la página principal.
a. En la tag del head [cabecera]:
<head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,user-scalable=no" /> <title>IFX Informatrix | Con todo el power!!! < / title> <link href="jquery-mobile/jquery.mobile.theme-1.2.0.min.css" rel="stylesheet" type="text/css"/> <link href="jquery-mobile/jquery.mobile.structure-1.2.0.min.css" rel="stylesheet" type="text/css"/> <script src="jquery-mobile/jquery-1.8.3.min.js" type="text/javascript"></script> <script src="jquery-mobile/jquery.mobile-1.2.0.min.js" type="text/javascript"></script> <script src="phonegap/phonegap-1.4.1.js" type="text/javascript"></script> <script> document.addEventListener("deviceready", function() { // Vibrar el equipo navigator.notification.vibrate(400); }, false); </script> </head>
■■■ Permite la codificación al español, el cual nos posibilita utilizar letras como la ñ ■■■ Este tag nos permitirá según sus atributos “device-width” que el ancho de la pantalla del dispositivo, es independiente al tamaño, posición
o resolución del dispositivo móvil y “user-scalable=no” que el sitio se muestra en su escala original y que el usuario no tiene posibilidad de cambiar el tamaño.
■■■ Nombre del título de la página
■■■ Hojas de estilo propio del jquery-mobile, que nos permitirá darle una mejor apariencia a la interfaz ■■■ Javascript de propios de jquery-mobile y phonegap ■■■ Este es un evento propio que nos brinda phonegap, el cual una vez finalizado de iniciar la aplicación, el dispositivo móvil vibrará 400
milisegundos
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 6
b. En la tag del body <body> </body> escribimos los siguiente:
i. Página Principal:
<!--************** PAGINA PRINCIPAL - INICIO ****************--> <div data-role="page" id="inicio" data-theme="a"> <!--************** INICIO - CABECERA - INDEX****************--> <div data-role="header" data-theme="a" id="logo"> <div data-role="navbar"> <ul> <li><a href="#inicio" data-theme="a”><img src="jquery-mobile/images/logoReload.png" width="300" height="80"></a> </li> </ul> </div> </div> <!--************** FIN - CABECERA - INDEX****************--> <!--************** INICIO - CUERPO - INDEX****************--> <div data-role="content" data-theme="a" > <ul data-role="listview" data-theme="c" data-inset="true"> <li><a href="#blogger"><img src="jquery-mobile/images/Blogger.png" width="70" height="80">Blogger<span class="ui-li-count">4</span> </a></li> <li><a href="#contacto"><img src="jquery-mobile/images/Contact.png" width="70" height="80">Contacto</a> </li> <li><a href="#nosotros"><img src="jquery-mobile/images/About.png" width="70" height="80">Sobre Nosotros</a> </li> <li><a href="#ubicar"><img src="jquery-mobile/images/Location Marker.png" width="70" height="80">Ubicanos</a></li> </ul> </div> <!--************** FIN - CUERPO - INDEX****************--> <!--************** INICIO - PIE - INDEX****************--> <footer data-role="footer" data-theme="a" data-position="fixed"> <div data-role="navbar" data-theme="a" > <ul> <li><a href="#inicio" class="ui-btn-active" data-icon="home">Inicio</a></li> <li><a href="#contacto" data-icon="grid">Blogger</a></li> <li><a href="#nosotros" data-icon="info">Sobre Nosotros</a></li> </ul> </div> <p align="center" class="copyright">© 2013 IFX Informatrix - Perú</p> </div> <!--************** FIN - PIE - INDEX****************--> </div> <!--************** PAGINA PRINCIPAL - FIN ****************--></body>
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 7
ii. Adicionalmente agregamos al body el div propio de la página Bloggers:
<!--************** PAGINA BLOGGERS - INICIO ****************--> <div data-role="page" id="blogger" data-theme="a"> <!--************** INICIO - CABECERA - BLOGGERS ****************--> <div data-role="header" data-theme="a"> <a href="#inicio" data-rel="back" data-icon="arrow-l">Atrás</a> <h1>Bloggers</h1> <a href="galeria.html" data-icon="star" rel="external">Galería</a> </div> <!--************** FIN - CABECERA - BLOGGERS ****************--> <!--************** INICIO - CUERPO - BLOGGERS ****************--> <div data-role="content" data-theme="d"> <ul data-role="listview" data-dividertheme="e"> <li data-role="list-divider">Fredy Guibert</li> <li><a href="#">Programando en C Sharp</a></li> <li><a href="#">Programando en C Sharp 2</a></li> <li><a href="#">Programando en C Sharp 3</a></li> <li><a href="#">Programando en C Sharp 4</a></li> <li><a href="#">Webminar Gratuito Virus Informaticos</a></li> <li data-role="list-divider">Diego Ludeña</li> <li><a href="#">Six Sigma en la enseñanza de Ingeniería de Software</a></li> <li><a href="#">25 Cosas que debería de tener una ciudad futurista</a></li> <li><a href="#">Trabajando con Coffee.io</a></li> <li data-role="list-divider">Giancarlo Marín</li> <li><a href="#">Como hacer una aplicación de escritorio en menos de 5 minutos</a></li> <li><a href="#">Creando una aplicación web para dispositivos móviles con jquery mobile y phonegap</a></li> <li data-role="list-divider">Wilson Vargas</li> <li><a href="#">Lo que los desarrolladores deben saber de Windows 8</a></li> <li><a href="#">TypeScript, el nuevo lenguaje de programacion de Microsoft</a></li> <li><a href="#">Lo nuevo de Windows Defender en Windows 8</a></li> </ul> </div> <!--************** FIN - CUERPO - BLOGGERS ****************--> <!--************** INICIO - PIE - BLOGGERS ****************--> <footer data-role="footer" data-theme="a" data-position="fixed"> <div data-role="navbar" data-theme="a" > <ul> <li><a href="#inicio" data-icon="home">Inicio</a></li> <li><a href="#contacto" class="ui-btn-active" data-icon="grid">Blogger</a></li> <li><a href="#nosotros" data-icon="info">Sobre Nosotros</a></li> </ul> </div> <p align="center" class="copyright">© 2013 IFX Informatrix - Perú</p> </div> <!--************** FIN - PIE - BLOGGERS****************--> </div> <!--************** PAGINA BLOGGERS - FIN ****************-->
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 8
iii. Así mismo para la página Contacto:
<!--************** PAGINA CONTACTO - INICIO ****************--> <div data-role="page" id="contacto" data-theme="a"> <!--************** INICIO - CABECERA - CONTACTO ****************--> <div data-role="header" data-theme="a"> <a href="#inicio" data-rel="back" data-icon="arrow-l">Atrás</a> <h1>Contacto</h1> </div> <!--************** FIN - CABECERA - CONTACTO ****************--> <!--************** INICIO - CUERPO - CONTACTO ****************--> <div data-role="content" data-theme="c" > <form action="" method="post" name="tourDate"> <p>Nombre: <input name="nombre" id="nombre" type="text"></p> <p>Email: <input name="email" type="email"></p> <p>Asunto: <input name="asunti" type="text"></p> <p><label for="mensajes">Mensaje:</label> <textarea name="mensajes" id="mensajes"> </textarea></p> <input name="submit" type="submit" value="Enviar"> <p> </p> </form> </div> <!--************** FIN - CUERPO - CONTACTO ****************--> <!--************** INICIO - PIE - CONTACTO ****************--> <footer data-role="footer" data-theme="a" data-position="fixed"> <div data-role="navbar" data-theme="a" > <ul> <li><a href="#inicio" data-icon="home">Inicio</a></li> <li><a href="#contacto" data-icon="grid">Blogger</a></li> <li><a href="#nosotros" data-icon="info">Sobre Nosotros</a></li> </ul> </div> <p align="center" class="copyright">© 2013 IFX Informatrix - Perú</p> </div> <!--************** FIN - PIE - CONTACTO****************--> </div> <!--************** PAGINA CONTACTO - FIN ****************-->
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 9
iv. También para la página Sobre Nosotros:
<!--************** PAGINA NOSOTROS - INICIO ****************--> <div data-role="page" id="nosotros" data-theme="a" data-add-back-btn="true"> <!--************** INICIO - CABECERA - NOSOTROS ****************--> <div data-role="header" data-theme="a"> <a href="#inicio" data-rel="back" data-icon="arrow-l">Atrás</a> <h1>Nosotros</h1> </div> <!--************** FIN - CABECERA - NOSOTROS ****************--> <!--************** INICIO - CUERPO - NOSOTROS ****************--> <div data-role="navbar" data-theme="e" > <ul> <li><a href="http://www.ifxperu.com/" data-show-count="false" data-show-screen-name="false" target="_blank"><img src="jquery- mobile/images/browser.png" width="18" height="18" alt="Visitamos!"><br />Visitanos</a></li> <li><a href="#redes" class="twitter-follow-button" data-show-count="false" data-show-screen-name="false"><img src="jquery-mobile/images/redes.png" width="18" height="18" alt="Visitanos en las redes!"><br />Redes Sociales</a></li> </ul> </div> <div data-role="content" data-theme="d" > <p>Descripcion: IFXPERU Team - Grupo de informáticos sencillos con gustos en la cultura geek.<br>Slogan: Con todo el power!!!</br>Correo: info.ifxperu@gmail.com</p> <p> <strong>Misión</strong><br /><p>Brindar información de tecnología, programación, informática en general y sin formalismos.</p> <strong>Descripción</strong><br /> <p>IFX Informatrix nació como un proyecto bloggero creado por Clayder Gonzalez y William Medina en donde se intenta recopilar artículos de informática útiles, algunas noticias, videos, material y miscelánea basándose en el mundo informático en el que vivimos. </p><p> Creado originalmente como Online Desktop el 7 de diciembre del 2007 bajo la plataforma Blogspot, fue migrado en múltiples ocasiones y muchos post y artículos se perdieron en las consiguientes versiones, hasta llamarse como se llama hoy.</p><p> En la actualidad mantenemos la misma esencia, somos un grupo de informáticos con gustos en la cultura geek, programadores freelancers para proyectos de software, consultoría en tecnologías de información, charlas y capacitaciones.</p> </p> </div> <!--************** FIN - CUERPO - NOSOTROS ****************--> <!--************** INICIO - PIE - NOSOTROS ****************--> <footer data-role="footer" data-theme="a" data-position="fixed"> <div data-role="navbar" data-theme="a" > <ul> <li><a href="#inicio" data-icon="home">Inicio</a></li> <li><a href="#contacto" data-icon="grid">Blogger</a></li> <li><a href="#nosotros" class="ui-btn-active" data-icon="info">Sobre Nosotros</a></li> </ul> </div> <p align="center" class="copyright">© 2013 IFX Informatrix - Perú</p> </div> <!--************** FIN - PIE - NOSOTROS ****************--> </div> <!--************** PAGINA NOSOTROS - FIN ****************-->
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 10
v. Además adicionar para la página Redes
<!--************** PAGINA REDES - INICIO ****************--> <div data-role="page" id="redes" data-theme="a" data-add-back-btn="true" > <!--************** INICIO - CABECERA - REDES ****************--> <div data-role="header" data-theme="a"> <a href="#nosotros" data-rel="back" data-icon="arrow-l">Atrás</a> <h1>Redes Sociales</h1> </div> <!--************** FIN - CABECERA - REDES ****************--> <!--************** INICIO - CUERPO - REDES ****************--> <div data-role="navbar" data-theme="c" > <ul> <li><a href="https://twitter.com/ifxperu" class="twitter-follow-button" target="_blank"><img src="jquery-mobile/images/twitter.png" width="18" height="18"><br />Encuentranos</a></li> <li><a href="https://www.facebook.com/ifxperu" target="_blank"><img src="jquery-mobile/images/facebook.png" width="18" height="18"><br />Dale Me gusta</li> <li><a href="http://www.youtube.com/user/IFXPeru" target="_blank"><img src="jquery-mobile/images/youtube.png" width="18" height="18"><br />Miranos</a></li> </ul> </div> <div data-role="content" data-theme="d" > <h4>Nuestros últimos tweet</h4> <p><script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"> </script> <script> new TWTR.Widget({ version: 2, type: 'profile', rpp: 3, interval: 30000, width: 'auto', height: 300, theme: { shell: { background: '#05296E', color: '#ffffff' }, tweets: { background: '#faeca4', color: '#030303', links: '#05296E' } }, features: { scrollbar: true, loop: false, live: false, behavior: 'all” } }).render().setUser('ifxperu').start(); </script> </p> </div> <!--************** FIN - CUERPO - REDES ****************--> <!--************** INICIO - PIE - REDES ****************--> <footer data-role="footer" data-theme="a" data-position="fixed"> <div data-role="navbar" data-theme="a" > <ul> <li><a href="#inicio" data-icon="home">Inicio</a></li> <li><a href="#contacto" data-icon="grid">Blogger</a></li> <li><a href="#nosotros" class="ui-btn-active" data-icon="info">Sobre Nosotros</a></li> </ul> </div> <p align="center" class="copyright">© 2013 IFX Informatrix - Perú</p> </div> <!--************** FIN - PIE - REDES ****************--> </div> <!--************** PAGINA REDES - FIN ****************-->
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 11
vi. Y por último para la página Ubícanos:
<!--************** PAGINA UBICANOS - INICIO ****************--> <div data-role="page" id="ubicar" data-theme="a" data-add-back-btn="true"> <!--************** INICIO - CABECERA - UBICANOS ****************--> <div data-role="header" data-theme="a"> <a href="#inicio" data-rel="back" data-icon="arrow-l">Atrás</a> <h1>Ubicanos</h1> </div> <!--************** FIN - CABECERA - UBICANOS ****************--> <!--************** INICIO - CUERPO - UBICANOS ****************--> <div data-role="content" data-theme="d" > <h2>Estamos en:</h2> <div style="width: 100%; height:250px; margin-bottom:10px;" id="map_canvas"></div> <div id="geolocation"></div> </div> <!--************** FIN - CUERPO - UBICANOS ****************--> <!--************** INICIO - PIE - UBICANOS ****************--> <footer data-role="footer" data-theme="a" data-position="fixed"> <div data-role="navbar" data-theme="a" > <ul> <li><a href="#inicio" data-icon="home">Inicio</a></li> <li><a href="#contacto" data-icon="grid">Blogger</a></li> <li><a href="#nosotros" data-icon="info">Sobre Nosotros</a></li> </ul> </div> <p align="center" class="copyright">© 2013 IFX Informatrix - Perú</p> </div> <!--************** FIN - PIE - UBICANOS ****************--> </div> <!--************** PAGINA UBICANOS - FIN ****************-->
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 12
<script> // manejos de documentos listos y phonegap ya terminado de iniciarse window.addEventListener('load', function () { document.addEventListener('deviceready', onDeviceReady, false);}, false) // Phonegap está cargado y obtiene las coordenadas de la posicion gps function onDeviceReady(){ getPosition();} // obtiene la posición actual y lo muestra en un mapa function getPosition(){ var geoOptions = { enableHighAccuracy: true, timeout: 10000 }; navigator.geolocation.getCurrentPosition(function(position){ // geoSuccess var geolocation = $('#geolocation'); geolocation.html('<table></table>'); var table = geolocation.find('table'); if(position.coords.latitude) table.append('<tr><th>Latitud</th><td>' + position.coords.latitude + '</td></tr>'); if(position.coords.longitude) table.append('<tr><th>Longitud</th><td>' + position.coords.longitude + '</td></tr>'); if(position.coords.altitude) table.append('<tr><th>Altitud</th><td>' + position.coords.altitude + '</td></tr>'); if(position.coords.accuracy) table.append('<tr><th>Precisión</th><td>' + position.coords.accuracy + '</td></tr>'); if(position.coords.altitudeAccuracy) table.append('<tr><th>Altitud Precisión</th><td>' + position.coords.altitudeAccuracy + '</td></tr>'); if(position.coords.heading) table.append('<tr><th>Título</th><td>' + position.coords.heading + '</td></tr>'); if(position.coords.speed) table.append('<tr><th>Velocidad</th><td>' + position.coords.speed + '</td></tr>'); if(position.coords.timestamp) table.append('<tr><th>Marca de Tiempo</th><td>' + new Date(position.timestamp) + '</td></tr>'); /* muestra posición en un mapa */ var map_canvas = $('#map_canvas'); map_canvas.gmap( {'center' : position.coords.latitude + ',' + position.coords.longitude, 'zoom' : 12, 'disableDefaultUI':true, 'callback':function(){ var self = this; var marker = self.addMarker({ 'position' : this.get('map').getCenter() }); marker.click(function(){ self.openInfoWindow({ 'content' : 'Esta es su ubicación actual' }, this); }); } }); }, function(error){ // geoError navigator.notification.alert('error: ' + error.message + '\n' + 'code: ' + error.code); }, geoOptions); } </script>
NOTA:
Adicionalmente agregamos el script el cual hará que se capture las
coordenadas de nuestra móvil y lo muestre en una imagen, en la
imagen anterior no se muestra el mapa porque para visualizarlo se
debe hacer uso de un emulador y en este caso usaremos RIPPLE
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 13
8. Creamos una nueva página para nuestra página Galería:
<!doctype html><html><head><meta charset="utf-8"><title>Galería de Fotos</title> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <link href="jquery-mobile/jquery.mobile.theme-1.2.0.min.css" rel="stylesheet" type="text/css"/> <link href="jquery-mobile/jquery.mobile.structure-1.2.0.min.css" rel="stylesheet" type="text/css"/> <!--These are the photo gallery specific css files needed by photoswipe--> <link href="photoswipe/3.0.5/examples/jquery-mobile.css" type="text/css" rel="stylesheet" /> <link href="photoswipe/3.0.5/photoswipe.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="photoswipe/3.0.5/lib/klass.min.js"></script> <script src="jquery-mobile/jquery-1.8.3.min.js" type="text/javascript"></script> <script src="jquery-mobile/jquery.mobile-1.2.0.min.js" type="text/javascript"></script> <script type="text/javascript" src="photoswipe/3.0.5/code.photoswipe.jquery-3.0.5.min.js"></script> <!—Script para que la animacion de fotos funcione--> <script type="text/javascript"> (function(window, PhotoSwipe){document.addEventListener('DOMContentLoaded', function(){ var options = { getImageMetaData: function(el){return {href: el.getAttribute('href'),something:el.getAttribute('data-something'),anotherThing: el.getAttribute('data-another-thing')}}}, instance = PhotoSwipe.attach( window.document.querySelectorAll('#Gallery a'), options ); instance.addEventHandler(PhotoSwipe.EventTypes.onDisplayImage, function(e){var currentImage = instance.getCurrentImage(); console.log(currentImage.metaData.something); console.log(currentImage.metaData.anotherThing);});}, false); window, window.Code.PhotoSwipe)); </script> </head> <body> <div data-role="page" data-add-back-btn="true" data-theme="a"> <div data-role="header" data-theme="a"> <a href="index.html#contacto" rel="external" data-rel="back" data-icon="arrow-l">Atrás</a> <h1>Galeria de Fotos</h1> </div> <div data-role="content"> <ul id="Gallery" class="gallery"> <li><a href="galeriafoto/SliderIFX001B.png" rel="external"><img src="galeriafoto/SliderIFX001B.png" alt="Desarrollo de Software" /></a></li> <li><a href="galeriafoto/SliderIFX002B.png" rel="external"><img src="galeriafoto/SliderIFX002B.png" alt="Consultoría en Tecnologias de Informacion" /></a></li><li><a href="galeriafoto/SliderIFX003B.png" rel="external"><img src="galeriafoto/SliderIFX003B.png" alt="Charlas y Capacitaciones" /></a></li> </ul> </div> <footer data-role="footer" data-theme="a" data-position="fixed"> <div data-role="navbar" data-theme="a" > <ul> <li><a href="index.html#inicio" data-icon="home" rel="external">Inicio</a></li> <li><a href="index.html#contacto" data-icon="grid" rel="external">Blogger</a></li> <li><a href="index.html#nosotros" data-icon="info" rel="external">Sobre Nosotros</a></li></ul> </div> <p align="center" class="copyright">© 2013 IFX Informatrix - Perú</p> </div> </div></body></html>
NOTA:
Adicionalmente agregamos la siguiente
sentencia de código del recuadro
amarillo, el cual nos permitirá la
visualización de la galería de fotos.
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 14
9. Ahora procedemos a comprobarlo en un emulador, para lo cual bajamos la extensión para Google Chrome llamado RIPPLE que nos permitirá emular
nuestra aplicación en distintos móviles y plataformas
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 15
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 16
CREANDO UNA APLICACIÓN NATIVA PARA MÓVILES CON JQUERY MOBILE + PHONEGAP PARTE 1
Giancarlo Marín Gaitán 17