Categorías
Angular Dev TypeScript

Cómo extender la clase Error en TypeScript para manejar mejor los Errores en una aplicación

El manejo de errores es uno de los grandes faltantes en la mayoría de tutoriales disponibles en la web. Muchas veces, simplemente lanzar instancias de Error no es suficiente para poder lidiar con los diferentes tipos de Error que puede emitir una clase o una función.

Esto es aun peor cuando se consumen APIs externas, que pueden emitir muchos tipos diferentes de errores, que en cada caso habrá que manejar apropiadamente y de manera diferente.

El primer paso para lograrlo es extender la clase Error, para que pueda ser un poco más descriptiva:

export class Failure extends Error {
  public code = '';
  constructor(message: string, code: string | null = null) {
    super(message);
    if (code) {
      this.code = code;
    }
    Object.setPrototypeOf(this, new.target.prototype);
  }
}

Ahora contamos con una clase Failure, que extiende Error y que adicional nos permite tener un code, que en algunos casos es muy útil. Ahora es solo cuestión de extender dicha clase para cada uno nuestros errores:

export class NotFoundFailure extends Failure {}
export class UnknownFailure extends Failure {}

Así, en nuestro código podemos lanzar errores específicos y documentar apropiadamente nuestras funciones, indicando que también devuelven ‘never’, es decir, que podrían emitir un error. El ejemplo a continuación intenta ilustrarlo. Usen su imaginación!:

export class CosaClient {
  // ...

  /**
   * Devuelve una Cosa.
   * ...
   *
   * @throws NotFoundFailure | UnknownFailure
   */
  fetchId(id: string): Promise<Cosa | never> {
    // ...
    
    // Tirar un error!
    if (...) {
    throw new NotFoundFailure('Mensaje', '123');

    // ...

    // Tirar otro error!
    if (...) {
      throw new UnknownFailure('Mensaje', '123');
    }

    // ...
  }
}

Luego, cuando hagamos uso de la clase CosaClient, podemos saber por la documentación que emite determinados errores y hacer el manejo apropiado de ellos:

try {
  // Instanciar la clase.
  const cosaClient = new CosaClient();

  // Recuperar el ID 123.
  const cosa = CosaClient.fetchId('123');

  // ...

// Manejar los errores que puedan ocurrir en el catch.
} catch (e) {

  if (e instanceof NotFoundFailure) {
    // Decirle al usuario que ese ID no existe.

  } else if (e instanceof UnknownFailure) {
    // Decirle al usuario que ocurrió un error inesperado.

  } else if (e instanceof Error) {
    // Manejar cualquier error genérico que venga de otra parte.

  } else {
    // Manejar cualquier otra cosa inesperada.
  }
}

Finalmente, cómo nuestros propios Failures cuentan con campos para un mensaje y un código de error, podremos tener mensajes más claros y hacer un mejor manejo con las variantes de cada error.

¡Espero que esto les de ideas de como lidiar mejor con sus Errores!

Categorías
Angular Dev Firebase TypeScript

Cómo contar registros fácil y rápido en firebase

Partiendo de que ya se tenga un proyecto en Typescript con Firebase configurado, basta con crear la siguiente función:

Categorías
Angular Dev TypeScript

Sobre fechas y toLocaleDateString()

Es posible convertir un objeto Date en UTC a una fecha en hora local usando toLocaleDateString(). Toda la información de como hacerlo está aquí:

Categorías
Angular Dev Firebase TypeScript

Adaptador para un selector de fechas en Angular

Firebase entrega TimeStamps, no fechas, por lo que toca hacer la conversión respectiva. Pero es posible implementar una directiva que resuelva este problema así:

Categorías
Angular Cloud Dev Firebase TypeScript

Cómo utilizar el emulador de Firebase sin sufrir en el intento

Este post tiene como origen divertidos problemas que hemos tenido. Recomendamos solo habilitar los Emuladores necesarios. Hemos tenido algunos líos, en especial con el Emulador Pub/Sub.

Para comenzar, es necesario tener instalado Node.js 10.13 o mayor y verificar que se tiene la última versión de firebase-tools con el siguiente comando:

npm install -g firebase-tools

Asumiendo que firebase ya está corriendo y funcionando, entonces lo siguiente es inicializar el emulador:

Categorías
Angular Dev TypeScript

Las cosas del Typescript

Mediocremente me robé estas cosas de un post y las voy a listar aquí para que no se me olviden. Tengo muy claro que la calidad de este post es bastante mala, que probablemente solo sea útil como autoreferencia y que el bot de google lo mirará con profundo desprecio. Ahí va:

Categorías
Angular Cloud Dev Firebase TypeScript

Como convertir un archivo .kmz a json en javascript

Como para casi cualquier cosa, existe un paquete para eso; parse2-kmz, disponible en https://www.npmjs.com/package/parse2-kmz. Utilizarlo es muy simple:

Categorías
Dev TypeScript

Como lidiar con diferentes tipos de errores en Typescript

Ahí les va:

Categorías
Angular Dev TypeScript

Por qué Angular no carga bien los datos cuando se reutilizan componentes y eso del Dependency Injection

Imagínese que usted tiene una tienda virtual y que a su producto se le pueden asignar atributos así:

Obviamente cada uno de estos selectores es un componente aparte que se reutiliza varias veces en el formulario. Y en este caso concreto, el selector del Termino depende del valor del Atributo para poder filtrar los datos. Obviamente no se pueden mostrar colores cuando lo que se está asignando es una talla.

Categorías
Dev TypeScript

Cómo definir un objeto de tipos específicos (key: value) en TypeScript

Esta es una de esas cosas que se me olvidan y que luego no encuentro nunca, cada vez que la necesito hacer. Por eso a continuación les explicaré el lío y la solución: