Este artículo ofrece una guía detallada y profunda para implementar Firebase Hosting y Cloud Functions en Google Cloud Platform (GCP). Aprenderás desde la configuración inicial hasta las mejores prácticas de despliegue, emulación local, seguridad y monitoreo.

Firebase Hosting es un servicio de alojamiento estático con contenido dinámico a través de Cloud Functions. Ofrece:

• Despliegue rápido: Integración con Firebase CLI.
• HTTPS y SSL automático: Certificados gestionados.
• Rewrites y redirecciones: Para Single Page Apps y funciones.
• Escalabilidad: Soporta miles de peticiones concurrentes.

Cloud Functions, por su parte, permite ejecutar código backend en respuesta a eventos en Firebase, HTTP o servicios de Google Cloud, sin preocuparte por servidores.

• Cuenta de Firebase y GCP.
• Node.js (versión LTS) instalado.
• Firebase CLI instalado: npm install -g firebase-tools.
• Proyecto de Firebase creado y configurado en la consola.
• Roles adecuados: Firebase Admin o Editor de Cloud Functions.

1. Autenticar Firebase CLI:

   firebase login

2. Inicializar el proyecto:

   firebase init

   Selecciona Hosting y Functions, después asocia tu proyecto.

3. Carpetas generadas:
   • public/ para archivos estáticos.
   • functions/ para código de Cloud Functions.

4.1 Estructura de archivos

4.2 Configuración de rewrites

hosting: {
  public: public,
  ignore: [firebase.json, /., /node_modules/],
  rewrites: [
    { source: /api/, function: api },
    { source: ,    destination: /index.html }
  ]
}
      

4.3 Despliegue

firebase deploy --only hosting

5.1 Instalación de dependencias

npm install firebase-admin firebase-functions express cors

5.2 Estructura básica

const functions = require(firebase-functions)
const admin = require(firebase-admin)
const express = require(express)
const cors = require(cors)
admin.initializeApp()
const app = express()
app.use(cors({ origin: true }))

app.get(/hello, (req, res) =gt {
  res.json({ message: ¡Hola desde Cloud Functions! })
})

exports.api = functions.https.onRequest(app)
      

5.3 Despliegue de funciones

firebase deploy --only functions

Gracias a los rewrites, todas las llamadas a /api/ son redirigidas a la función api. Así se crea un backend API junto al front.

Para probar sin desplegar:

firebase emulators:start

• Hosting en http://localhost:5000.
• Functions en http://localhost:5001.

Controla el acceso a tus funciones y datos con:

• Reglas de Firestore / Realtime Database: Configura quién puede leer o escribir datos.
• Identidad de llamadas a funciones: Verifica context.auth en tus Cloud Functions.
• Roles IAM: Asigna Cloud Functions Invoker a servicios o usuarios concretos.

• Logs de Functions: En consola de GCP gt Cloud Functions gt Ver registros.
• Hosting metrics: Uso de ancho de banda, estado de SSL y visitas.
• Stackdriver / Cloud Monitoring: Configura alertas y dashboards personalizados.

• Modulariza Functions: Separa lógicas en archivos separados para escalabilidad.
• Evita dependencias innecesarias: Reduce el tamaño del despliegue y el cold start.
• Versiona tu front: Usa public/version-1.0/ para rollback sencillo.
• Pruebas unitarias: Emplea mocha, jest o firebase-functions-test.
• Cacheo: Configura headers de caché en firebase.json para recursos estáticos.

• Documentación oficial de Firebase Hosting
• Guía de Cloud Functions
• Google Cloud SDK
• Ejemplos en GitHub

Combinar Firebase Hosting con Cloud Functions en GCP ofrece una solución robusta, escalable y de rápida implementación para aplicaciones web modernas. Siguiendo este tutorial, podrás lanzar tu sitio estático con funcionalidades dinámicas, mantener un entorno seguro y tener control total sobre el ciclo de vida de tu aplicación.

¡Empieza hoy mismo y lleva tu proyecto al siguiente nivel!