Inserción de documentos en Firestore con JavaScript
Clase 17 de 32 • Curso de Firebase 5 para Web
Resumen
¿Cómo configurar Firestore en el método constructor?
Para conectar con Firestore, primero deberás configurar tu objeto POST. Es importante que la instancia de Firestore esté disponible para ser utilizada en las diferentes funciones. Por ello, definimos una variable db
y obtenemos la instancia de Firestore a través de:
this.db = firebase.firestore();
Luego, debes definir ciertas configuraciones. Una configuración clave es TimeStamp in snapshots
, la cual permite recuperar todos los valores almacenados como DayTime
en formato TimeStamp
. Para aplicarlo:
const settings = { timestampsInSnapshots: true };
this.db.settings(settings);
Esta configuración garantiza que las fechas se manipulen correctamente como TimeStamp
, optimizando así la gestión de datos temporales.
¿Cómo se crea un Post en Firestore?
Crear un documento en Firestore es un proceso sencillo y dinámico. Primero, debes dirigirte a la colección específica, y si esta no existe, Firestore la creará automáticamente. Para agregar un documento a una colección llamada "Post" usa:
this.db.collection('Post').add({
uid: this.userUid,
author: this.userEmail,
title: this.postTitle,
description: this.postDescription,
imageLink: this.postImageLink,
videoLink: this.postVideoLink,
createdAt: firebase.firestore.FieldValue.serverTimestamp()
})
.then((ref) => {
console.log('ID del POST:', ref.id);
})
.catch((error) => {
console.error('Error creando el POST', error);
});
Aquí, cada campo se define como un par llave: valor
en el objeto JS que representa al documento.
¿Cómo gestionar el almacenamiento de Fecha y Hora?
Para obtener la fecha y hora del sistema (servidor) usamos firebase.firestore.FieldValue.serverTimestamp()
. Con esto, logramos que Firestore maneje automáticamente las marcas de tiempo, lo cual asegura que siempre operamos con la hora del servidor.
¿Cómo manejar errores al crear un Post?
La inserción en Firestore utiliza promesas, lo cual facilita la gestión de errores de forma eficiente. Si algo sale mal durante la operación de creación, el bloque catch
se encargará de alertar sobre el error:
.catch((error) => {
console.error('Error creando el POST', error);
});
Este enfoque permite una depuración más sencilla y un seguimiento efectivo de errores, asegurando un flujo ininterrumpido en la aplicación.
¿Cómo se vincula el Post Controller con la autenticación del usuario?
El Post Controller se encarga de comprobar si un usuario está autenticado antes de permitir la creación de un Post. Este proceso incluye:
- Validación del usuario: Usamos la función
firebase.auth().currentUser
para verificar al usuario actual.
const user = firebase.auth().currentUser;
if (!user) {
console.warn('Para crear un POST debe estar autenticado.');
return;
}
- Recuperación de datos: Si el usuario está autenticado, se recuperan sus detalles y datos del Post desde los campos editables.
const title = this.titleInput.value;
const description = this.descriptionInput.value;
const videoLink = this.videoLinkInput.value;
const imageLink = this.imageLinkInput.value;
- Llamada a la función
crearPost
: Se pasa el UID del usuario autenticado y otros detalles necesarios para crear el Post.
crearPost(user.uid, user.email, title, description, imageLink, videoLink);
Esto garantiza que solo los usuarios autenticados puedan interactuar con la creación de contenido, proporcionando un nivel de seguridad adicional.
¿Qué sucede después de que se crea un Post?
Una vez que el Post se ha creado exitosamente, el sistema devuelve un mensaje de confirmación al usuario:
.then(() => {
console.log('POST creado correctamente');
})
Por otro lado, en caso de error, el sistema también notificará apropiadamente, permitiendo que los desarrolladores puedan reaccionar eficazmente ante posibles inconvenientes.
Estos pasos aseguran que la aplicación no solo funciona adecuadamente, sino que también mantiene la seguridad y la integridad de la base de datos y la experiencia del usuario. ¡Anímate a seguir explorando y desarrollando con Firestore!