Your SlideShare is downloading. ×
05 Building cross-platform mobile applications with jQuery Mobile / Desarrollo de Aplicaciones Cross-Platform para Dispositivos Moviles
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

05 Building cross-platform mobile applications with jQuery Mobile / Desarrollo de Aplicaciones Cross-Platform para Dispositivos Moviles

266

Published on

Building cross-platform mobile applications with jQuery Mobile …

Building cross-platform mobile applications with jQuery Mobile
Desarrollo de Aplicaciones Cross-Platform para Dispositivos Moviles

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
266
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Desarrollo de Aplicaciones Cross- Platform para Dispositivos Moviles Building Cross-Platform Mobile Applications M.S.C. Raquel Vásquez Ramírez M.S.C. Cristian A. Rodríguez Enríquez
  • 2. Contenido   •  Manejo  de  Base  de  Datos  (Client  Side)   •  Almacenamiento  Local   – Permanente   – Sesión   – Usando  Base  de  Datos   •  Conclusiones   Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 02 of 15
  • 3. HTML 5: Data Storage Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 03 of 15 HTML5 offers two types of data storage on the client: •  Storage via a database containing the tables described in SQL •  Storage through localStorage and sessionStorage objects, to store information made up of strings.
  • 4. Permanent Storage and Session Storage Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 04 of 15 Para habilitar el “Storage” se utilizan dos objetos de JavaScript: •  localStorage: Permite el almacenamiento permanente •  sessionStorage: Permite el almacenamiento en la sesión
  • 5. Permanent Storage Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 05 of 15 localStorage.lname = “Sarrion”; localStorage.fname = “Eric”;
  • 6. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 06 of 15 Session Storage sessionStorage.lname = “Sarrion”; sessionStorage.fname = “Eric”;
  • 7. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 07 of 15 Usando una Base de Datos Como se puede observar el almacenamiento temporal y permanente no provee las facilidades de las bases de datos SQL. Gracias a HTML 5 es posible usar bases de SQL de forma local.
  • 8. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 08 of 15 Creando la Base de Datos var  db  =  openDatabase  (“Test”,  “1.0”,  “Test”,  65535);  
  • 9. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 09 of 15 Transaction db.transacKon  (funcKon  (transacKon)     {          var  sql  =  SQL  query;          transacKon.executeSql  (sql,  [parameters]  /  undefined,            funcKon  ()          {                    //  JavaScript  code  to  execute  if  the  query  was  successful          },            funcKon  ()          {                    //  JavaScript  code  to  execute  if  the  query  failed          }  );   });  
  • 10. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 10 of 15 Usando la Base de Datos •  Crear Base de Datos •  Insertar •  Listar (SELECT) •  Eliminar Tabla
  • 11. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 11 of 15 CREATE TABLE db.transacKon  (funcKon  (transacKon)        {          var  sql  =  "CREATE  TABLE  customers  "  +                  "  (id  INTEGER  NOT  NULL  PRIMARY  KEY  AUTOINCREMENT,  "  +                  "lname  VARCHAR(100)  NOT  NULL,  "  +                    "fname  VARCHAR(100)  NOT  NULL)"          transacKon.executeSql  (sql,  undefined,  funcKon  ()          {                alert  ("Table  created");          },  error);      });  
  • 12. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 12 of 15 DROP TABLE db.transacKon  (funcKon  (transacKon)        {          var  sql  =  "DROP  TABLE  customers";          transacKon.executeSql  (sql,  undefined,  ok,  error);      }  
  • 13. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 13 of 15 INSERT INTO db.transacKon  (funcKon  (transacKon)        {          var  sql  =  "INSERT  INTO  customers  (lname,  fname)  VALUES  (?,  ?)";          transacKon.executeSql  (sql,  [lname,  fname],  funcKon  ()          {                alert  ("Customer  inserted");          },  error);      }  
  • 14. Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 14 of 15 Base de Datos Server Side (Elementos) var  sql  =  "SELECT  *  FROM  customers";   transacKon.executeSql  (sql,  undefined,…    
  • 15. Conclusiones   •  jQuery provee los elementos necesarios para desarrollar aplicaciones para dispositivos móviles •  Desarrollo Ágil •  Si se desea sincronizar datos con un servidor, se requiere usar una base de datos local y sincronizar cuando se disponga de conexión mediante una consulta constante del estado de la conexión (Push?) •  Optimización de Aplicaciones Web Building Cross-Plaftform Mobile Applications – jQuery Mobile Slide 15 of 15

×