SQLite Ionic | Aprende a usarlas como un profesional aquí

¿Buscando la manera de guardar datos de tu aplicación en el teléfono de tu usuario? O, quizás ya sabes cómo hacerlo mediante SQLite Ionic, pero te falta conocer algún detalle cómo, por ejemplo, los parámetros de una función o el nombre de un campo de clase ¿verdad?

Mi nombre es Aitor Sánchez, soy desarrollador de apps desde 2014, y en este artículo aprenderás cómo puedes persistir los datos de tu app en el dispositivo de tu cliente mediante la librería SQLite Ionic.

Pero antes de continuar, ¿Quieres qué te enseñe a mejorar los ingresos por publicidad en tus apps? Suscríbete a la Flutter Mafia y recibirás un ebook donde te explicaré paso a paso como se hace.

Instalación de SQLite en Ionic

Cómo con todos los componentes desacoplados del core, y que requieren plugin de sistema, es necesario que lo instales. Para ello vas a usar las siguientes dos líneas de consola:

$ ionic cordova plugin add cordova-sqlite-storage
$ npm install @awesome-cordova-plugins/sqlite

La primera instalará el plugin para la comunicación con la parte nativa del sistema. Y la segunda instalará el módulo que permitirá la comunicación de tu código TS con el plugin.

Vale, ya está instalado, continuemos.

Configuración de SQLite Ionic

Por otro lado, también debes de incluir el módulo en tus providers para comenzar a usarlo.

Te recuerdo, cómo he hecho ya en algunos capítulos del curso, que no es necesario que esté en el AppModule.ts cómo lo ponen en todos los sitios. Puedes meterlo en el module que quieras. Eso sí, el rango del alcance de uso se limitará a ese componente y a las herencias de él.

Vas a utilizar el siguiente código:

...
import {SQLite} from "@awesome-cordova-plugins/sqlite/ngx"

...

providers: [
...,
SQLite,
...,
]

...

Bien, pues así ya estarías en disposición de usarlo donde quieras.

Plataformas soportadas

• Android
• iOS
• macOS
• Windows

Vale, ¿y cómo se usa?

Antes de comenzar a aburrirte con la parafernalia, veamos un ejemplo de código para que puedas ver por ti mismo cómo funciona todo.

import { SQLite, SQLiteObject } from '@awesome-cordova-plugins/sqlite/ngx';

constructor(private sqlite: SQLite) { }

...

this.sqlite.create({
  name: 'data.db',
  location: 'default'
})
  .then((db: SQLiteObject) => {
    //Lo ideal sería guardar esta instancia de SQLiteObject en una variables estática para utilizarla desde un servicio con un patrón singleton.
    db.executeSql('create table danceMoves(id INTERGER PRIMARY KEY, name VARCHAR(32))', [])
      .then(() => console.log('Executed SQL'))
      .catch(e => console.log(e));
  })
  .catch(e => console.log(e));

Aunque básico, el ejemplo no va más allá de esto. Cabe a la imaginación, por ejemplo, de aguantar el puntero de la base de datos con un método get o una variable estática en la clase AppModule. Eso, e inicializar todo a partir de la promesa que devuelve la función “create” para que no tengamos problemas.

Pero vamos, que el uso básico lo tenemos aquí. Ahora vas a ver los entresijos de esta clase. Así podrás realizar muchas más cositas.

Cómo funciona SQLite

Aunque no debería de incluirlo aquí directamente. Si no en un artículo apartado específico para ello.

El sistema genera un archivito “xml” o “html” (si, html) que contiene los datos que tu irás persistiendo. Estos datos se alojarán en pares de clave valor. Aunque parezca algo rudimentario te da muchísima funcionalidad.

Tengo que objetar que se vuelve lenta de manera exponencial cuando crecen. Pero cómo son para apps tampoco crecen mucho. Así que es un sistema óptimo para este fin.

Y, básicamente, SQLite es esto. Si quieres conocer algo más, este enlace es el de la web oficial. Hasta que haga el tutorial, puedes acceder a través de él.

Bien, sigamos…

Funciones y métodos de Ionic para SQLite

Para no perder la costumbre, solo veremos los métodos de esta clase explícitamente. No veremos métodos del padre. Así que, si echas en falta alguno, asegúrate que no sean de alguno de sus parientes.

create(config)

• Es el método que inicializa todo el sistema. El que abre el archivo de la base de datos cuando es llamado, etc…
• Parámetros
  • config -> SQLiteDatabaseConfig -> Es la clase/interface que contiene la configuración de la base de datos. Te enseñaré sus campos más abajo en el artículo.
• Retorna una promesa que tendrás que controlar y te informará cuando todo esté iniciado correctamente. Dentro de esta viene la instancia del objeto SQLiteObject que es el que hará todo el trabajo duro. También te lo enseñaré ahora, más abajo.

echoTest()

• Te permite verificar que todo está como tiene que estar. Verifica si el código Javascript y el nativo están instalados.
• Retorna una promesa que tienes que controlar y dentro lleva el resultado del test en un objeto “any”.

selfTest()

• También sirve para verificar que todo esté correcto. La diferencia de este con el anterior, es que este verifica si la base de datos está correcta y se puede conectar con ella.
• Retorna una promesa que tienes que controlar y que dentro lleva el resultado en un tipo “any”.

deleteDatabase(config)

• Al contrario que “create”, este te permite eliminar una base de datos.
• Parámetros:
  • config -> SQLiteDatabaseConfig -> La configuración de la base de datos que quieres eliminar. Cómo he dicho en el “create”, verás los campos de esta clase más abajo.
• Retorna una promesa que tienes que controlar y que lleva consigo el resultado de la eliminación en un tipo “any”.

Y listo, ya no hay más métodos de nuestro módulo. Ahora pasemos a ver los de las clases dependientes. Adelante…

SQLiteObject

Cómo he dicho en el método “create”. Este es el objeto que se va a encargar de todo en el sistema. Digamos, en pocas palabras, que es la “conexión” con la base de datos. Y ahora vas a ver todas sus funciones.

• databaseFeatures()
• openDBs()
• addTransaction()
• transaction(fn)
• readTransaction()
• startNextTransaction()
• open()
• close()
• executeSql(consulta)
• sqlBatch(consulta[])
• abortallPendingTransactions()

No es necesario que las comente, su propio nombre indica lo que hacen.

Las más importantes, quizás, son “executeSql(cadena)”, que ejecuta la cadena que se ha pasado cómo parámetro, y sqlBatch(querys[]), que ejecutará todas las consultas que se le pasen de manera secuencial.

SQLiteDatabaseConfig

Cómo has visto en el ejemplo de “create”, y en la especificación de “deleteDatabase”, esta es la clase que tienes que utilizar cómo parámetro en estos métodos.

Esta interface cuenta con los siguientes campos:

• name -> string -> El nombre de la base de datos
• location -> string -> La localización de la base de datos. EJ: “default”
• iosDatabaseLocation -> string -> La localización de la base de datos en iOS. EJ: “library”
• createFromLocation -> number -> Este parámetro es para crear una base de datos que ya está rellenada.
  • Ej: openDatabase({name: "my.db", location: 'default', createFromLocation: 1})
• key -> string -> Es para dar soporte a base de datos encriptadas. Este sería el campo de la contraseña.
  • Ej: openDatabase({ name: 'my-encrypted.db', key: 'user-password-here', location: 'default' });

SQLiteTransaction

Esta es un poco más compleja. Pero básicamente se trata de un sistema para realizar operaciones pre-programadas en la base de datos.

De momento, para lo que nos compete, no es necesario que lo especifiquemos más. Solo con conocer que está ahí, es suficiente. Cuando lo vayas a usar sabrás hacerlo sin necesidad de que yo te lo tenga que explicar.

Y si te gusta más ver que leer, en video también

Algo más que quizás te interesa

La optimización del logo de tu app es una tarea necesaria para ganar más instalaciones, y por extensión más dinero, con tus apps. Por esto hemos creado esta herramienta para ti. Podrás evaluar y optimizar tus logos y espiar los de la competencia. No es espoileo más, entra en el enlace.

Pues aquí termina este artículo. Nos vemos en el siguiente ¡Hasta entonces, que vaya bien!