En este artículo encontrarás el vídeo de una sesión práctica sobre Firebase, una clase emitida en directo donde explicamos muchas de las cosas que dispones en Firebase cuando comienzas a desarrollar. Además, al final del artículo recogemos los materiales generados como el código producido durante la sesión, así como las reglas de seguridad básicas utilizadas y el juego de datos con el que partimos para la realización del ejemplo.

En esta clase nos saltaremos la debida introducción teórica a este servicio de Google orientado para desarrolladores, ya que es estudio de otros artículos y vídeos que encontrarás en el Manual de Firebase. Así que nos centraremos en la práctica y desarrollaremos con Javascript "Vanilla" para la web.

Solo decir, por si alguien se encuentra un poco perdido, que Firebase es un servicio de Google que permite programar aplicaciones asombrosas con mucho menos esfuerzo. Con un solo SDK del lado del cliente podrás hacer muchas de las partes que deberías desarrollar del lado del backend.

Algunos de los servicios de Firebase son autenticación, acceso a base de datos, seguridad, almacenamiento, notificaciones, etc. Y sirve tanto para web como para apps de dispositivos. Lo mejor es que los mismos datos, usuarios, servicios, archivos... los puedes acceder desde cualquier plataforma, web, Android o iOS, facilitando enormemente el desarrollo de aplicaciones multidispositivo y web en general.

Firebase puede ser usado para crear aplicaciones completas o puede ser integrado dentro de una aplicación existente, ya que su flexible sistema de seguridad permite muchas variantes que se adaptan a cualquier tipo de requisito y de modelo de negocio.

Contenido de la clase de Firebase

Todo el contenido de esta clase se impartió como previo del Curso de Firebase de EscuelaIT. Puedes tomar esta como una clase cero, con una demostración de la potencia de esta herramienta, pero obviamente, en el curso veremos las cosas con mucho más detenimiento y rigor.

En el espacio de una hora y media aproximadamente verás cómo se realiza una aplicación web en el que podremos experimentar algunas de las posibilidades de Firebase en cuanto al tiempo real. Veremos cómo se realiza autenticación de usuarios con redes sociales, usando las cuentas de Google. Verás cómo realizar el acceso la base de datos directamente desde Javascript, enviando datos y recibiendo actualizaciones de la base de datos en tiempo real.

Partimos de un proyecto comenzado con un poco de HTML y CSS, para no entretenernos con cosas ajenas al propio servicio de Google. Explicaremos un poco los códigos con que se parte y veremos q es una página donde, básicamente, no tenemos nada de contenido, como si fuera una plantilla. El contenido lo cargaremos extrayéndolo desde Firebase.

Acceso a documentos

Veremos cómo acceder a documentos que encontramos dentro de la base de datos en tiempo real y como, si el contenido de esos documentos cambia, los datos se actualizan automáticamente en la página.

Acceso a colecciones

Son un tipo especial de documentos en el que tenemos diversos item de un conjunto de datos. Las colecciones son como los arrays, aunque en Firebase no hay arrays por lo que se expresan como objetos. El acceso a colecciones se realiza de forma ligéramente distinta del acceso a los documentos, por lo que es importante para dar los primeros pasos con Firebase.

Autenticacion de usuarios

Una de las partes basicas de cualquier aplicación es la autenticación de usuarios y en Firebase resulta extremadamente sencilla, sin necesidad de involucrar codigo del lado del servidor. Veremos cómo autenticar usuarios de cuentas de Google, en muy pocas lineas de codigo.

Reglas de seguridad

Para garantizar el acceso a datos privados solamente por aquellos usuarios a los que pertenecen, o el acceso a datos de una aplicación restringidos, en las que se requiera autenticación en general, tenemos las reglas de seguridad. Ya que todo en Firebase se hace del lado del cliente, las reglas de seguridad forman un papel fundamental frente a la autorización de usuarios y la validación de los datos. En este vídeo no entramos a explicar cómo se construyen las reglas de seguridad, pues es un tema suficientemente complejo como para verlo de manera individual. En cambio verás que hemos traído realizadas de antemano unas cuantas reglas sencillas y lo que sí se aborda es su función y cómo nos ayudan a que nuestra aplicación responda positivamente a las acciones sólo cuando son permitidas.

Hosting

Firebase contiene un espacio de hosting gratuito, que puede tener incluso un dominio personalizado. Veremos cómo se realiza el deploy en el hosting de Firebase, mediante un sencillo comando de consola.

Vídeo de la clase

En este punto es importante que puedas dedicarle un tiempo a acompañar el siguiente vídeo, en el que podrás aprender muchas cosas de Firebase con las que comenzar cualquier tipo de aplicación.

El vídeo puede parecer un poco largo, pero es que se ven bastantes cosas. Dedicarle un tiempo es una inversión que seguro te vendrá bien para comenzar con Firebase con un buen punto de partida. No se tratan los conocimientos con un rigor y detalle igual que en los siguientes capítulos del Manual de Firebase (y por supuesto en el curso de EscuelaIT), pero podrás entender muy bien qué es Firebase, para qué se puede usar y lo sencillo y rápido que es trabajar con este sistema orientado a desarrolladores.

Código del proyecto realizado en clase

El código del proyecto lo hemos dividido en varios archivos. Si sigues el vídeo lo podrás reconocer todo sin problemas, básicamente porque se realiza el proyecto casi partiendo desde cero.

Para facilitar la vida a todos lo encuentras disponible en Github. El repositorio está en esta URL: https://github.com/deswebcom/demo-firebase-encuesta

En el repositorio verás todos los archivos, HTML, CSS e incluso las reglas de seguridad usadas para el proyecto. Además encuentras también los juegos de datos (JSON) para crear las entidades de la encuesta y sus posibles respuestas, de modo que solo tienes que importar los json, si te hace falta, en tu propio proyecto de Firebase, desde la sección "database".

Con todo esto estamos seguros que podrás reproducir el ejemplo en tu propia aplicación y comenzar con Firebase de una manera sencilla y práctica.