Promesas

El API en texto que se debe consumir es este:

https://api.escuelajs.co/api/v1/products

Les comparto mis apuntes. 😄

Axios

Es una forma interesante de hacer request y conectarnos a servicios web, nos va a servir para hacer peticiones desde el frontend como en el backend.

Asincronismo y TypeScript

Podemos correr promesas y código asíncrono con TypeScript de la misma forma que lo haríamos con JavaScript.

Tipado y promesas

En el caso de no colocar el tipo de dato de retorno de nuestra función asíncrona, TypeScript supondrá que es una promesa, pero no sabe el tipo de dato que retorna esa promesa.

Podemos tipar a una promesa con genéricos

const variableName = new Promese<dataType>(...);

Fetch con NODE v18

Podemos utilizar nodejs para poder realizar peticiones fetch pero solo lo podemos hacer con la versión 18, es una feature no estable así que puede tener sus errores.

Ejemplo en base al código de la clase

async function getProductsFetch () {
    const promise = await fetch('https://api.escuelajs.co/api/v1/products');
    const rta = await promise.json();
    return rta;
}

No se pronuncia ‘asainc’, se pronuncia ‘eisinc’

Una mejor manera (a mi parecer) de escribir la función de async await es usando la destructuración de objetos sabiendo qué vamos a extraer de la respuesta:

import axios from "axios"

(async() => {
  async function getProducts() {
    const { data } = await axios.get('https://api.escuelajs.co/api/v1/products')
    return data
  }

  const products = await getProducts()
  console.log(products)
})()

Aquí una forma más elegante de declarar un delay. Es similar al time.sleep de Python. Yo lo uso en algunos de mis proyectos:

const sleep = async(delay: number) => {
    await new Promise((resolve) => setTimeout(resolve, delay));
  }

await sleep(1000);

Con console.time() y console.timeEnd() podemos saber exactamente cuanto tiempo tarda en ejecutarse un proceso asíncrono. Aquí un ejemplo:

  console.time('delay')
  const rta = await delay(5000);
  console.log(rta);
  console.timeEnd('delay')

y la salida de mi consola:
true
inicio: 5.018s

En los comentarios ya está el nuevo link que hay que usar ❤️, pero si quieren explorar más esa api, hay un nuevo diseño y cositas geniales que se han desarrollado https://fakeapi.platzi.com/

En la v2 del get product, si ya dentro de la funcion getProductsAsync tenemos un await para luego obtener el valor de la promesa ¿Por qué llamamos de nuevo el await en la ejecución de la función? en const productsv2 = ++await ++ getProductsAsync ¿Cuál es la función de ese await?

Woooah estaba viendo documentación de librerías con TS y en algun momento vi que se le pasaban “parámetros” a las interfaces asi: <T> y pensé ¿Esto que es? resulta que eran Genericos :0

En node v17+ fetch esta disponible como opción experimental

Ya no es necesario estar en un contexto asincrono para ejecutar await, una pasada 🍺

Está caida el api 🥲.