API WEB SQL ITParral

30
WEB SQL Objetivo: Investigar, ejemplificar y exponer una API HTML5. INSTITUTO TECNOLÓGICO DE PARRAL API Titular: M.C.C. Edgar Omar Bañuelos Lozoya. Materia: Tópicos de programación WEB. No.Control Alumno(s) 10410511 Fernando Cortez Rodríguez 10410554 Luis Fernando Sáenz Cisneros API WEB SQL

description

Exposición referente a la API de HTML5 WEB SQL, por alumnos de Ingeniería en Sistemas Computacionales del ITParral

Transcript of API WEB SQL ITParral

Page 1: API WEB SQL ITParral

API WEB SQL

WEB SQL

Objetivo: Investigar, ejemplificar y exponer una API HTML5.

INSTITUTO TECNOLÓGICO DE PARRAL

API

Titular: M.C.C. Edgar Omar Bañuelos Lozoya.

Materia: Tópicos de programación WEB.

No.Control Alumno(s)

10410511 Fernando Cortez Rodríguez

10410554 Luis Fernando Sáenz Cisneros

Page 2: API WEB SQL ITParral

API WEB SQL

ÍNDICE

Marco Conceptual WEB SQL

Introducción a WEB SQL e IndexedDb

¿Qué es WEB SQL?

¿En qué se diferencia IndexedDB de WEB SQL?

Ejemplo código IndexedDB

Características de la WEB SQL

Navegadores que lo soportan

Métodos principales WEB SQL

Creación de una BD

Declaración de variables y funciones

Método transaction para generar una consulta

Creación de Tablas e inicio de las consultas

Ejemplos

Referencias

Page 3: API WEB SQL ITParral

API WEB SQL

Marco Conceptual WEB SQL

Page 4: API WEB SQL ITParral

API WEB SQL

Introducción

Existen momentos en que los 5 o 10 MB de almacenamiento que ofrecen algunas APIS de almacenamiento WEB no son suficientes. Si se necesita almacenar una cantidad mayor de datos, y además que estén relacionados entre ellos, se necesitara utilizar una base de datos ordenadas para satisfacer las necesidades de almacenamiento que se necesitan.1

Por lo general las bases de datos son utilizados del lado del servidor, pero en la actualidad hay dos soluciones de base de datos para cubrir la necesidad del lado del cliente: API WEB SQL e INDEXDB.1

En esta presentación se hablara en lo particular del API WEB SQL.

Page 5: API WEB SQL ITParral

API WEB SQL

¿Qué es WEB SQL?

Es un API de almacenamiento web la cual utiliza una base de datos que se puede consultar mediante una variable de SQL.2

Este api ya está inactiva en cuanto a mantenimiento desde noviembre del 2010, en sustitución se ha implementado una norma alternativa potencial llamada API IndexedDB. 2

Actualmente IndexedDB está ganando terreno, pero queda ver cuál de ellas será la norma estándar para almacenamiento de datos importantes en el navegador.1

 

Page 6: API WEB SQL ITParral

API WEB SQL

¿En qué se diferencia IndexedDB de WEB SQL?1,5

WEB SQL INDEXED DATABASE

Es una base de datos compleja y estructurada

Es un almacén de datos

Es relacional Relación tradicional

Cuenta con tablas, columnas y filas Cuenta con tablas, columnas y filas, las cuales no se relacionan y se crean una para cada tipo de datos

Se ejecuta mediante código de SQL y JavaScript

Consulta por índice mediante JavaScript

Descontinuado Vigente

Page 7: API WEB SQL ITParral

API WEB SQL

Ejemplo Código IndexedDB

<!--encapsular la lógica de la base de datos.-->

var html5rocks = {}; html5rocks.indexedDB = {};

<!--Abrir la base de datos-->

html5rocks.indexedDB.db = null;

html5rocks.indexedDB.open = function() {

var request = indexedDB.open("todos");

request.onsuccess = function(e) {

html5rocks.indexedDB.db = e.target.result; };

request.onfailure = html5rocks.indexedDB.onerror; };

(…)

Page 8: API WEB SQL ITParral

API WEB SQL

Características WEB SQL

Permite almacenaje mayor a 5 o 10MB.1

El desarrollador indica la capacidad de almacenamiento para la BD que tendrá el navegador.1

Funcionaba en todos los navegadores que contaban con el WEBKit.3

WebKit: posibilita interactuar con un servidor web para recuperar y renderizar páginas web, descargar archivos, y administrar plugins.4

Utiliza código de ejecución SQL para:1

Crear bases de datos.

Insertar valores.

Modificar.

Consultar.

Eliminar.

Page 9: API WEB SQL ITParral

API WEB SQL

Navegadores Compatibles

Safari 3.2+

Chrome

Opera

Mobile Safari

Page 10: API WEB SQL ITParral

API WEB SQL

Métodos principalesWEB SQL

Existen 3 métodos principales de WEB SQL6:

1. OpenDatabase: Este método crea el objeto de base de datos, ya sea utilizando la base de datos existente o crear uno nuevo.

2. transacción: Este método nos da la capacidad de controlar una transacción y realizar cualquiera commit o rollback en base a la situación.

3. ExecuteSQL: Este método se utiliza para ejecutar la consulta SQL real.

Page 11: API WEB SQL ITParral

Creación de una BD7

El OpenDatabase método se encarga de abrir una base de datos si ya existe, en caso de que no exista creara una base de datos nueva.

Método toma 4 parámetros:

Nombre de la base ‘db’

Número de versión ‘1.0’

Descripción del texto ‘mi primera base de datos’

Tamaño de la base de datos 2*1024*1024

Page 12: API WEB SQL ITParral

API WEB SQL

Declaración de variables yfunciones7

Page 13: API WEB SQL ITParral

API WEB SQL

Método transaction para generar una consulta7

Page 14: API WEB SQL ITParral

API WEB SQL

Creación de Tablas e inicio de las consultas7

Page 15: API WEB SQL ITParral

API WEB SQL

Vista de la Tabla7

Page 16: API WEB SQL ITParral

API WEB SQL

Resultado

Page 17: API WEB SQL ITParral

API WEB SQL

Descarga Ejemplo1

http://goo.gl/A8osIq

Page 18: API WEB SQL ITParral

API WEB SQL

Ejemplo 2 WEB SQLCreación de la BD

Nombre de la base de datos ‘mydb’

Número de versión ‘1.0’

Descripción del texto ‘ejemplo2’

Tamaño de la base de datos 5000 kb = 5 MB otra forma de establecer

el tamaño de almacenamiento

Page 19: API WEB SQL ITParral

API WEB SQL

Declaración de variablesy funciones.

Page 20: API WEB SQL ITParral

API WEB SQL

Declaración de variablesy funciones.

Page 21: API WEB SQL ITParral

API WEB SQL

Imprimir Datos

Page 22: API WEB SQL ITParral

API WEB SQL

Resultado

Page 23: API WEB SQL ITParral

API WEB SQL

Descarga Ejemplo2

http://goo.gl/pVUEhK

Page 24: API WEB SQL ITParral

API WEB SQL

Actividad WEB SQL

*Actividad para llevarse a cabo en parejas*

Page 25: API WEB SQL ITParral

Objetivo: Que el alumno pueda ser capaz de implementar una base de datos del tipo WEB SQL y así reforzar el conocimiento acerca de esta API de HTML5.

Descripción:

Realice una pagina WEB que contenga como titulo “Mi primera WEB SQL”, en idioma español; además acepte caracteres especiales.

Deberá contener el numero de control y nombre de cada uno de los integrantes.

En una etiqueta de párrafo comentar su opinión referente a esta API.

Crear una base de datos llamada “escuela", con una tabla llamada “materias” la que contendrá dos parámetros “materia” y “profesor”.

Deberá insertar los valores para “materia” y “profesor” al dar clic sobre un botón, este obtendrá los valores de dos campos de texto que tendrán los valores a agregar.

Por ultimo deberá mostrar los elementos agregados en una tabla con borde de 5px en color azul.

Actividad WEB SQL

Page 26: API WEB SQL ITParral

API WEB SQL

Ejemplo

Page 27: API WEB SQL ITParral

API WEB SQL

Conclusión

Page 28: API WEB SQL ITParral

API WEB SQL

Conclusión

En la opinión propia y criterio de cada uno de los integrantes que presentamos esta exposición, podemos decir que la utilización de las bases de datos en un entorno web son de suma importancia; Pero en lo particular la API WEB SQL no tiene una función de suma relevancia, si no al contrario, carece de seguridad para la protección de datos, cualquier persona con acceso a un navegador del lado del cliente puede ver la base de datos estructurada, por lo que decimos que no es la mejor opción para el almacenamiento WEB

Inconvenientes: La falta de información acerca de esta API a consecuencia de estar descontinuada retardo y complico la elaboración de la exposición.

El tiempo aproximado de la elaboración de la exposición fue de 20 horas.

Page 29: API WEB SQL ITParral

API WEB SQL

Referencias

o1 Goldstein, Alexis, Lazaris, Louis y Weyl, Estelle. 2011. HTML5 and CSS3 for the real World. [PDF] [ed.] Kelly Steele. 400, New York , USA : SitePoint Pty. Ltd., 2011. PDF.

o2 Hikson,Lan. W3C. Sitio WEB W3C. [En línea] 18 de Noviembre de 2010. [Citado el: 07 de Febrero de 2014.] http://www.w3.org/TR/webdatabase/#terminology.

o3 Sharp, Remy. 2010. HTML5 Doctor. Sitio WEB HTML5 Doctor. [En línea] 24 de Febrero de 2010. [Citado el: 10 de Febrero de 2014.] http://html5doctor.com/introducing-web-sql-databases/.

o4 Wikipedia. 2014. Wikipedia. Sitio WEB Wikipedia.org. [En línea] 10 de Enero de 2014. [Citado el: 10 de Febrero de 2014.] http://es.wikipedia.org/wiki/WebKit.

Page 30: API WEB SQL ITParral

API WEB SQL

o5 Kinalan, Paul. 2013. html5rocks. Sitio WEB html5rocks. [En línea] 29 de Octubre de 2013. [Citado el: 10 de Febrero de 2014.] http://www.html5rocks.com/es/tutorials/indexeddb/todo/.

o6 Tutorials Point TP. Tutorials Point TP. Sitio WEB Tutorials Point TP. [En línea] [Citado el: 10 de Febrero de 2014.] http://www.tutorialspoint.com/html5/html5_web_sql.htm.

o7 Lubber, Peter, Frank, Salim and Brian, Albers. 2011. Pro HTML5 Programming. Segunda. s.l. : Apress, 2011. p. 352.

Referencias