En esta sección, aprenderás cómo configurar Firebase para tu proyecto. Este proceso incluye la creación de un proyecto en la consola de Firebase, la integración de Firebase en tu aplicación y la configuración de los servicios que planeas utilizar.
- Creación de un Proyecto en Firebase
Paso 1: Acceder a la Consola de Firebase
- Abre tu navegador web y ve a la Consola de Firebase.
- Inicia sesión con tu cuenta de Google.
Paso 2: Crear un Nuevo Proyecto
- Haz clic en el botón "Agregar proyecto".
- Ingresa un nombre para tu proyecto y haz clic en "Continuar".
- (Opcional) Habilita Google Analytics para tu proyecto y selecciona una cuenta de Google Analytics.
- Haz clic en "Crear proyecto" y espera a que Firebase configure tu proyecto.
- Integración de Firebase en tu Aplicación
Paso 1: Agregar Firebase a tu Aplicación
- En la consola de Firebase, selecciona tu proyecto.
- Haz clic en el ícono "Agregar aplicación" (puede ser Android, iOS o Web).
Para una Aplicación Web:
-
Selecciona el ícono de Web.
-
Ingresa un nombre para tu aplicación web y haz clic en "Registrar aplicación".
-
Copia el fragmento de código de configuración que se te proporciona. Este código se verá algo así:
<!-- The core Firebase JS SDK is always required and must be listed first --> <script src="https://www.gstatic.com/firebasejs/8.6.8/firebase-app.js"></script> <!-- TODO: Add SDKs for Firebase products that you want to use https://firebase.google.com/docs/web/setup#available-libraries --> <script> // Your web app's Firebase configuration var firebaseConfig = { apiKey: "YOUR_API_KEY", authDomain: "YOUR_PROJECT_ID.firebaseapp.com", projectId: "YOUR_PROJECT_ID", storageBucket: "YOUR_PROJECT_ID.appspot.com", messagingSenderId: "YOUR_MESSAGING_SENDER_ID", appId: "YOUR_APP_ID" }; // Initialize Firebase firebase.initializeApp(firebaseConfig); </script>
-
Pega este código en el archivo HTML de tu aplicación, justo antes de la etiqueta
</body>
.
Para una Aplicación Android:
-
Selecciona el ícono de Android.
-
Ingresa el nombre del paquete de tu aplicación y haz clic en "Registrar aplicación".
-
Descarga el archivo
google-services.json
y colócalo en el directorioapp
de tu proyecto Android. -
Agrega las siguientes líneas a tu archivo
build.gradle
(nivel de proyecto):buildscript { dependencies { // Add this line classpath 'com.google.gms:google-services:4.3.5' } }
-
Luego, agrega esta línea al archivo
build.gradle
(nivel de aplicación):apply plugin: 'com.google.gms.google-services'
Para una Aplicación iOS:
-
Selecciona el ícono de iOS.
-
Ingresa el ID del paquete de tu aplicación y haz clic en "Registrar aplicación".
-
Descarga el archivo
GoogleService-Info.plist
y agrégalo a tu proyecto Xcode. -
Abre el archivo
AppDelegate.swift
y agrega la inicialización de Firebase:import Firebase @UIApplicationMain class AppDelegate: UIResponder, UIApplicationDelegate { func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { FirebaseApp.configure() return true } }
- Configuración de Servicios de Firebase
Habilitar Servicios en la Consola de Firebase
- En la consola de Firebase, navega a la sección "Desarrollar" en el menú de la izquierda.
- Selecciona el servicio que deseas habilitar (por ejemplo, Authentication, Firestore, Storage, etc.).
- Sigue las instrucciones específicas para configurar cada servicio.
Ejemplo: Habilitar Autenticación por Correo Electrónico y Contraseña
- En la consola de Firebase, ve a Authentication.
- Haz clic en la pestaña "Método de inicio de sesión".
- Habilita el proveedor de Correo electrónico/Contraseña y haz clic en "Guardar".
Ejercicio Práctico
Ejercicio 1: Configuración de un Proyecto Firebase para una Aplicación Web
- Crea un nuevo proyecto en la consola de Firebase.
- Agrega una aplicación web a tu proyecto.
- Copia el código de configuración y pégalo en un archivo HTML.
- Habilita la autenticación por correo electrónico y contraseña en la consola de Firebase.
Solución del Ejercicio 1
<!DOCTYPE html> <html> <head> <title>Mi Aplicación Firebase</title> </head> <body> <h1>Bienvenido a Mi Aplicación Firebase</h1> <!-- The core Firebase JS SDK is always required and must be listed first --> <script src="https://www.gstatic.com/firebasejs/8.6.8/firebase-app.js"></script> <!-- Add Firebase products that you want to use --> <script src="https://www.gstatic.com/firebasejs/8.6.8/firebase-auth.js"></script> <script> // Your web app's Firebase configuration var firebaseConfig = { apiKey: "YOUR_API_KEY", authDomain: "YOUR_PROJECT_ID.firebaseapp.com", projectId: "YOUR_PROJECT_ID", storageBucket: "YOUR_PROJECT_ID.appspot.com", messagingSenderId: "YOUR_MESSAGING_SENDER_ID", appId: "YOUR_APP_ID" }; // Initialize Firebase firebase.initializeApp(firebaseConfig); </script> </body> </html>
Conclusión
En esta sección, has aprendido cómo crear un proyecto en Firebase, integrar Firebase en tu aplicación y configurar los servicios necesarios. Esta configuración es fundamental para aprovechar las capacidades de Firebase en tus proyectos. En el próximo módulo, profundizaremos en la autenticación de Firebase, comenzando con una introducción a los conceptos clave y la implementación de la autenticación por correo electrónico y contraseña.
Curso de Firebase
Módulo 1: Introducción a Firebase
Módulo 2: Autenticación de Firebase
- Introducción a la autenticación de Firebase
- Autenticación por correo electrónico y contraseña
- Autenticación de redes sociales
- Gestión de usuarios
Módulo 3: Base de datos en tiempo real de Firebase
- Introducción a la base de datos en tiempo real
- Lectura y escritura de datos
- Estructura de datos y reglas de seguridad
- Capacidades sin conexión
Módulo 4: Cloud Firestore
- Introducción a Cloud Firestore
- Modelo de datos de Firestore
- Operaciones CRUD
- Consultas avanzadas
- Reglas de seguridad
Módulo 5: Almacenamiento de Firebase
- Introducción al almacenamiento de Firebase
- Subida de archivos
- Descarga de archivos
- Metadatos de archivos y seguridad
Módulo 6: Mensajería en la nube de Firebase
- Introducción a la mensajería en la nube
- Envío de notificaciones
- Manejo de notificaciones
- Características avanzadas de mensajería
Módulo 7: Análisis de Firebase
Módulo 8: Funciones de Firebase
- Introducción a las funciones de Firebase
- Escritura de funciones
- Despliegue de funciones
- Activación de funciones
Módulo 9: Monitoreo de rendimiento de Firebase
- Introducción al monitoreo de rendimiento
- Configuración del monitoreo de rendimiento
- Análisis de datos de rendimiento
Módulo 10: Laboratorio de pruebas de Firebase
- Introducción al laboratorio de pruebas de Firebase
- Ejecución de pruebas
- Análisis de resultados de pruebas