Cómo conectar Firebase y Flutterflow en 2023

Descubre cómo integrar Firebase en Flutterflow en 2023 de forma sencilla

La integración de Firebase en FlutterFlow proporciona una forma sencilla de mejorar tus aplicaciones con potentes funciones como autenticación de usuarios, almacenamiento en la nube, bases de datos en tiempo real y mucho más.

Pero si es la primera vez que intentas conectar Firebase con Flutterflow puede ser un proceso un poco tedioso, es por ello que en este artículo te explicamos todo lo que debes hacer para conectar Firebase y Flutterflow en 2023.

Lo primero que debemos hacer es crear una cuenta en firebase.com dándole a “comienza ahora” y posteriormente crearemos un proyecto.

A continuación le pondremos un nombre a nuestro proyecto, le damos a siguiente, habilitamos o deshabilitamos google analytics (nosotros lo deshabilitaremos) y le daremos a “crear proyecto”.

Cuando cargue la barrita de progreso le daremos a continuar y ya estaremos en nuestro proyecto.

Iremos a ajustes y entraremos dentro de “usuarios y permisos”.

Una vez dentro agregaremos un nuevo miembro cuyo correo será firebase@flutterflow.io y tendrá la función de editor, esta acción permitirá a firebase poder gestionar nuestro proyecto.

Sin embargo, necesitaremos darle a Firebase 2 roles extras, para ello iremos a “configuración avanzada de permisos”.

Una vez dentro editaremos la cuenta principal.

Le daremos a “agregar otro rol” y seleccionaremos el rol “administrador de Cloud Functions” (buscándolo en el buscador).

Una vez agregado, volveremos a darle a “agregar otro rol” y esta vez seleccionaremos el rol “Usuario de cuenta de servicio” (buscándolo en el buscador nuevamente).

Finalmente le daremos a guardar y ya tendremos todo lo necesario configurado.

Ahora volveremos a nuestro proyecto de Firebase y ahora lo que tendremos que hacer es crear nuestra base de datos, para en “compilación” iremos a Firestore Database.

Una vez dentro de Firestore Database le daremos a “crear base de datos”, iniciaremos en modo de producción, le daremos a “siguiente” y en “ubicación de Cloud Firestore” si estás en Europa deberás cambiarlo a “eur3 (Europe)” (si estás en Latam puedes dejarlo tal y como está) y le daremos a “habilitar”.

Ahora ya hemos creado nuestra base dentro de Firebase.

Continuaremos yendo a ajustes, a “configuración del proyecto” y…

… a continnuación copiaremos la “ID del proyecto” (lo que necesitaremos para crear nuestro proyecto) y nos iremos a Flutterflow.

Dentro de nuestro proyecto en Flutterflow iremos a Settings (ajustes)

En settings, le daremos a Firebase y pegaremos el Project ID

Una vez pegado, le daremos a “connect” y posteriormente a “Auto generate config files” y “generate files”.

Una vez listo, nos quedará por configurar el Firebase Storage, para ello iremos a Firebase y entraremos dentro de Storage.

Dentro del Storage le daremos a “comenzar” en “iniciar en modo de producción”, le daremos a siguiente y le daremos a “listo”.

Ahora volveremos a Flutterflow, le daremos a “deploy” y ya estará listo.

Ahora ya tendremos configurada nuestra conexión de Firebase a Flutterflow correctamente.

Esperamos que este tutorial te haya servido de ayuda y hayas conseguido conectar Firebase a Flutterflow satisfactoriamente. Si prefieres ver el tutorial en video, aquí tienes nuestro tutorial subido a youtube.

Si quieres aprender Flutterflow desde 0 creando tu primera app, aquí tienes un curso completamente gratuito.

Empieza a aprender desde hoy

Entiende en menos de una hora cómo el No-code te puede ayudar a convertir tus ideas en realidades sin código.

Introducción al No-code

Curso gratis