ReactJS y Firebase desde 0 en 4 horas
ReactJS y Firebase desde 0 en 4 horas
¡INSCRÍBETE A CUALQUIER CURSO CON UN 50% DE DESCUENTO PARA NUEVOS CLIENTES!


La combinación de ReactJS y Firebase ofrece una gran herramienta a los desarrolladores web ya que de un plumazo elimina grandes perdidas de tiempo en repetitivos sistemas de autenticación, mantenimiento y optimización de bases de datos, almacenamiento de archivos, notificaciones push y un sinfín de tareas muy repetitivas.

Conecta ReactJS y Firebase

Existen muchas herramientas en la web que te ofrecen un sistema completamente funcional para trabajar con ReactJS y Firebase, el problema de todo esto es que nunca sabrás cómo funciona realmente ya que estarás pasando por alto aspectos muy importantes.

En el Curso de ReactJS y Firebase aprenderás todo desde la base y en tan sólo 4 horas, no necesitas más tiempo.

Navegación basada en autenticación y roles

Otro tema muy importante que veremos es cómo podemos crear navegaciones dinámicas con ReactJS y Firebase utilizando la versión 4 del router de React, en esta ocasión también veremos cómo mostrar u ocultar elementos basándonos en el rol del usuario identificado.

Las bases de datos de Firebase

Imagina poder hacer que tus sitios web trabajen en tiempo real sin que tú tengas que hacer nada, es decir, que lo que tú estés haciendo en tu navegador lo pueda ver el resto del mundo, esa es una de las cosas que nos ofrece Firebase.

Creo que la mejor forma de explicar cómo funcionan las bases de datos de Firebase es leyendo la descripción de su sitio, que es la siguiente.

Almacena y sincroniza datos entre usuarios y dispositivos en tiempo real a través de una base de datos noSQL alojada en la nube. Los datos actualizados se sincronizan entre distintos dispositivos conectados en milisegundos y permanecen disponibles si la app pierde la conexión a la red, lo que brinda una experiencia del usuario de alta calidad sin importar el estado de la conectividad.

Autenticación en Firebase

Manejar la autenticación en Firebase es cosa de niños, podemos acceder con email y password, número de teléfono o utilizando OAUTH2 con google, facebook o github entre otros.

Para ello simplemente deberemos activar los sistemas que deseemos y en el caso de OAUTH2 configurar las credenciales de nuestra aplicación, a partir de ese momento podremos acceder con los sistemas que hayamos configurado.

Por lo tanto no tenemos que instalar dependencias, preocuparnos de actualizaciones ni tener que escribir un código distinto para cada caso, todas trabajan exactamente igual y la información se guarda en cada caso de la misma forma, algo fantástico.

Almacenar archivos de forma segura en Firebase

Teniendo en cuenta que Firebase es una plataforma de Google, creo que el tema de la seguridad está más que cubierto y es algo en lo que podemos confiar, y no es menos en el caso de Storage, gracias a esta funcionalidad podemos subir archivos de la misma forma que lo podemos hacer con AmazonS3 para más adelante poder acceder a ellos a través de urls seguras.

A lo largo de este curso veremos de forma completa la subida de archivos y cómo relacionar archivos con registros alojados en bases de datos NoSQL, algo que pienso es completamente necesario.

Establecer relaciones en DB con ReactJS y Firebase

Algo completamente necesario para cualquier aplicación es tener la posibilidad de estabecer relaciones en nuestra base de datos, y con Firebase podemos conseguirlo de varias formas.

A lo largo del curso crearemos una aplicación de CRUD donde tendremos proyectos y usuarios, y vamos a querer guardar un proyecto relacionado al usuario actual, pues eso lo conseguimos con el siguiente código.

Gracias a pushWithMeta ReactJS se apañará para decirle a Firebase que guarde este proyecto estableciendo una relación con el usuario que está actualmente identificado, es genial.

Para acceder a la información que hemos guardado simplemente deberíamos hacer lo siguiente.

Gracias a los decoradores firebaseConnect y connect conseguimos pasar el estado projects a una propiedad de nuestra clase, por lo tanto si accedemos a this.props.projects dentro de la clase tendremos la información que exista en el path projects de nuestra base de datos en Firebase, así de simple.

Curso de ReactJS y Firebase

Con la V4 del Router de ReactJS

En cursosdesarrolloweb.es tienes un curso completo para aprender a trabajar con ReactJS y Firebase con código completamente funcional utilizando las últimas versiones a través de ejemplos fáciles y útiles.