Flutter on Fire

0
411
Compartir

Últimamente
he estado trabajando con Flutter el framework
desarrollado por Google para realizar aplicaciones móviles para IOS y Android.
Así que creo que llego la hora de empezar a conectarlo con Firebase y para eso
existe un conjunto de plugins llamado Flutter
Fire.

Plugins existentes

La
colección de plugins que engloba Flutter fire es amplia y cubre casí todas las
apis que tiene firebase de forma nativa. Es importante recordar que la mayoría
de estos se encuentran en beta y solo existen unos cuantos que ya tienen reléase
oficial.

Codelab

Para
empezar con esto me he ayudado con el codelab que está publicado por Google ( Firebase
for Flutter ). En este ejemplo realizamos una conexión a la base de datos
FireStore y realizamos actualizaciones de forma transaccional a un listado que
cargamos en la pantalla.

Actualizar
dependencias

Lo
primero es actualizar las dependencias de nuestro proyecto y en este caso no
necesitamos ingresar cada dependencia en las distintas variaciones. Incluiremos
la librería de Cloud_Firestore. Para
eso nos dirigimos al archivo pubspec.yaml
 donde utilizando el formato agregamos
la librería de está forma:

Agregar la interfaz

Una
vez que nuestro proyecto tiene las librerías necesarias para su correcto funcionamiento
pasamos a crear la interfaz. Esta interfaz es muy simple, se compone de 6
elementos básicos donde los últimos 3 se repetirán por cada elemento del
listado. Podemos realizarla toda en el archivo lib/main.dart.

Configuración especifica de Firebase

Debido
a la naturaleza de las configuraciones y por razones incluso de seguridad, es
necesario realizar ciertas tareas en cada sistema operativo. En este caso te
explico en el caso de Android.

Registra tú
aplicación en la consola de Firebase

Modifica el archivo
android/app/build.gradle

Agrega la dependencia
a android/build.gradle

Crea tú base de
datos

En
este proyecto como vimos en las dependencias usaremos Firebase Cloud Firestore
por lo que solo tenemos que ir a la sección de “database” en la consola y
activarla. Lo mejor es que al momento de activarla creemos un registro por lo
que se verá así.

Conecta tú
aplicación

Si
has realizado la Configuración
especifica de Firebase correctamente tú aplicación ya está conectada y
ahora empezaremos a consumir datos de la base de datos que creamos
anteriormente. Para eso haremos un StreamBuilder
mediante el cual podremos conectarnos y recibir cualquier cambio de la
colección en forma automática. Este objeto tiene dos propiedades el strem donde pondremos la consulta a la
base de datos y un builder donde
podemos crear los ítems de la lista.

Agregar interacción

Ahora
que tenemos el listado de elementos agregaremos interacción para los toques del
usuario. Para ello usaremos la función onTap
dentro del objeto ListTile para
detectar el toque del usuario.

Transaccionalidad

Finalmente
puedes agregar un concepto de transaccionalidad para que al actualizar el
registro de la base de datos respete si un usuario lo ha actualizado pocos
segundos antes que tú y así evitar perder votos. Para ello agregaremos unos
detalles al método onTap que creamos
en el paso anterior.

Si deseas ver el detalle completo de este proyecto puede verlo en mi repositorio: https://goo.gl/zjn4sX.

Descarga este post en pdf: https://goo.gl/ie2qec
Source: Javier

Dejar respuesta

Please enter your comment!
Please enter your name here