狠狠撸

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

Contenido
听
鈥⑩€� Manejo
听de
听Base
听de
听Datos
听(Client
听Side)
听
鈥⑩€� Almacenamiento
听Local
听
鈥撯€疨ermanente
听
鈥撯€疭esi贸n
听
鈥撯€疷sando
听Base
听de
听Datos
听
鈥⑩€� Conclusiones
听
Building Cross-Plaftform Mobile Applications 鈥� jQuery Mobile
狠狠撸 02 of 15

HTML 5: Data Storage
狠狠撸 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.

Permanent Storage and Session Storage
狠狠撸 04 of 15
Para habilitar el 鈥淪torage鈥� se utilizan dos objetos de
JavaScript:
鈥⑩€� localStorage: Permite el almacenamiento permanente
鈥⑩€� sessionStorage: Permite el almacenamiento en la sesi贸n

Permanent Storage
狠狠撸 05 of 15
localStorage.lname = 鈥淪arrion鈥�;
localStorage.fname = 鈥淓ric鈥�;

狠狠撸 06 of 15
Session Storage
sessionStorage.lname = 鈥淪arrion鈥�;
sessionStorage.fname = 鈥淓ric鈥�;

狠狠撸 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.

狠狠撸 08 of 15
Creando la Base de Datos
var
听db
听=
听openDatabase
听(鈥淭est鈥�,
听鈥�1.0鈥�,
听鈥淭est鈥�,
听65535);
听

狠狠撸 09 of 15
Transaction
db.transacKon
听(funcKon
听(transacKon)
听
听
{
听

听
听
听
听var
听sql
听=
听SQL
听query;
听

听
听
听
听transacKon.executeSql
听(sql,
听[parameters]
听/
听unde铿乶ed,
听
听

听
听
听
听funcKon
听()
听

听
听
听
听{
听
听

听
听
听
听
听
听
听
听//
听JavaScript
听code
听to
听execute
听if
听the
听query
听was
听successful
听

听
听
听
听},
听
听

听
听
听
听funcKon
听()
听

听
听
听
听{
听
听

听
听
听
听
听
听
听
听//
听JavaScript
听code
听to
听execute
听if
听the
听query
听failed
听

听
听
听
听}
听);
听
});
听

狠狠撸 10 of 15
Usando la Base de Datos
鈥⑩€� Crear Base de Datos
鈥⑩€� Insertar
鈥⑩€� Listar (SELECT)
鈥⑩€� Eliminar Tabla

狠狠撸 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)"
听

听
听
听
听(sql,
听unde铿乶ed,
听funcKon
听()
听

听
听
听
听{
听
听

听
听
听
听
听
听alert
听("Table
听created");
听

听
听
听
听},
听error);
听

听
听});
听

狠狠撸 12 of 15
DROP TABLE
db.transacKon
听(funcKon
听(transacKon)
听
听

听
听{
听

听
听
听
听var
听sql
听=
听"DROP
听TABLE
听customers";
听

听
听
听
听(sql,
听unde铿乶ed,
听ok,
听error);
听

听
听}
听

狠狠撸 13 of 15
INSERT INTO
db.transacKon
听(funcKon
听(transacKon)
听
听

听
听{
听

听
听
听
听var
听sql
听=
听"INSERT
听INTO
听customers
听(lname,
听fname)
听VALUES
听(?,
听?)";
听

听
听
听
听(sql,
听[lname,
听fname],
听funcKon
听()
听

听
听
听
听{
听
听

听
听
听
听
听
听alert
听("Customer
听inserted");
听

听
听
听
听},
听error);
听

听
听}
听

狠狠撸 14 of 15
Base de Datos Server Side (Elementos)
var
听sql
听=
听"SELECT
听*
听FROM
听customers";
听
transacKon.executeSql
听(sql,
听unde铿乶ed,鈥�
听
听

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
狠狠撸 15 of 15

狠狠撸

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

Recommended

More Related Content

Similar to 05 Building cross-platform mobile applications with jQuery Mobile / Desarrollo de Aplicaciones Cross-Platform para Dispositivos Moviles (20)

More from Cristian Rodr铆guez Enr铆quez (7)

Recently uploaded (20)

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