En este proyecto de desarrollo web, creé una barra de búsqueda de productos con debouncing utilizando Node.js y la Vue.js Composition API, integrada con la API de DummyJSON. El objetivo era optimizar el rendimiento de búsqueda añadiendo un retraso de 300 milisegundos antes de ejecutar la solicitud a la API, reduciendo así las llamadas innecesarias al servidor.

AOV - 2022-01 - Barra de búsqueda de regalos

En este proyecto de desarrollo web, creé una barra de búsqueda de productos con debouncing utilizando Node.js y la Vue.js Composition API, integrada con la API de DummyJSON. El objetivo era optimizar el rendimiento de búsqueda añadiendo un retraso de 300 milisegundos antes de ejecutar la solicitud a la API, reduciendo así las llamadas innecesarias al servidor.

AOV - 2022-01 - Barra de búsqueda de regalos

Se te asigna la tarea de construir una barra de búsqueda con "debouncing" para productos utilizando la API de productos de DummyJSON. En caso de que no estés familiarizado con el concepto de "debouncing", es una técnica que permite retrasar la ejecución de una función hasta que haya transcurrido un tiempo específico desde la última llamada.

Para este desafío, necesitarás agregar un retraso de 300 milisegundos a la función findProducts. Puedes hacer uso de implementaciones de debounce ya disponibles o intentar escribir una por ti mismo.

También necesitarás mostrar un indicador de carga genérico (un spinner o mensaje), y si la función se ejecuta con éxito, mostrar los nombres y precios de los productos sugeridos dentro de una lista desordenada. En caso contrario, usa el método nativo alert() para mostrar un mensaje de error genérico.

Si el término de búsqueda se restablece a una cadena vacía, también debes borrar las sugerencias de búsqueda.

https://gitlab.com/ingmanuelcaicedo/2022-01-gift-search-bar

Capturas de pantalla

En este proyecto de desarrollo web, creé una barra de búsqueda de productos con debouncing utilizando Node.js y la Vue.js Composition API, integrada con la API de DummyJSON. El objetivo era optimizar el rendimiento de búsqueda añadiendo un retraso de 300 milisegundos antes de ejecutar la solicitud a la API, reduciendo así las llamadas innecesarias al servidor.
En este proyecto de desarrollo web, creé una barra de búsqueda de productos con debouncing utilizando Node.js y la Vue.js Composition API, integrada con la API de DummyJSON. El objetivo era optimizar el rendimiento de búsqueda añadiendo un retraso de 300 milisegundos antes de ejecutar la solicitud a la API, reduciendo así las llamadas innecesarias al servidor.
En este proyecto de desarrollo web, creé una barra de búsqueda de productos con debouncing utilizando Node.js y la Vue.js Composition API, integrada con la API de DummyJSON. El objetivo era optimizar el rendimiento de búsqueda añadiendo un retraso de 300 milisegundos antes de ejecutar la solicitud a la API, reduciendo así las llamadas innecesarias al servidor.
En este proyecto de desarrollo web, creé una barra de búsqueda de productos con debouncing utilizando Node.js y la Vue.js Composition API, integrada con la API de DummyJSON. El objetivo era optimizar el rendimiento de búsqueda añadiendo un retraso de 300 milisegundos antes de ejecutar la solicitud a la API, reduciendo así las llamadas innecesarias al servidor.

Fuentes y recursos:

Developed by: Me Copyright 2024
Ing. Manuel Caicedo Logo