React

La librería RxJS: Reactive Extensions for JavaScript

El Problema En el desarrollo de aplicaciones web modernas, uno de los mayores retos es manejar flujos de datos en tiempo real, como puede ser una aplicación de mensajería instantánea, eventos de usuario, actualizaciones de una API... Con el uso tradicional de promesas anidadas, callbacks, estados múltiples, la complejidad del código aumenta de forma no sostenible. Es por esto que se utiliza la librería RxJS (Reactive Extensions for JavaScript). Puntos Importantes ¿Qué es RxJS?: RxJS es una librería que implementa el paradigma de programación reactiva en JavaScript. Permite trabajar con observables, que son…continue reading →

Entendiendo Stateful Components en React: Un Viaje Práctico con Tareas Pendientes

https://youtu.be/odY_Ta7dhL0 Introducción En React, uno de los conceptos fundamentales que debemos entender es el de "Componentes con Estado" o "Stateful Components". Este concepto se refiere a componentes de React que tienen la capacidad de mantener y gestionar su propio estado interno. ¿Pero qué significa exactamente esto y por qué es tan crucial para el desarrollo de aplicaciones dinámicas y receptivas? Se explorara este concepto a través de un ejemplo con una aplicación de gestión de tareas. ¿Qué son los "Stateful Components"? React se basa en la construcción de interfaces de usuario mediante componentes,…continue reading →

Crear un ChatBot en React

Lo primero que debemos saber es ¿qué es un chatbot? Un chatbot es una aplicación o programa informático que permite simular una conversación real, normalmente suelen estar basados en inteligencia artificial y son cada vez más habituales en diferentes servicios como marketing, ventas y posventa de las empresas, asistencia virtual… El objetivo de la aplicación es proporcionar una experiencia de comunicación fluida y amigable para los usuarios, para llevar a cabo esta idea utilizaremos la tecnología React. React nos permitirá construir una interfaz de usuario dinámica y receptiva que permitirá a los usuarios…continue reading →

Como obtener datos de un Excel con React

En este nuevo post os indicare como poder obtener los datos de un archivo Excel (.xlsx) con React. Lo primero es crear nuestro proyecto de React, en este caso yo usaré el comando npx create-react-app. https://flic.kr/p/2pifUwg Una vez tengamos nuestro proyecto creado correctamente, crearemos nuestro componente donde vamos a obtener los datos de nuestro Excel. En este caso yo he decidido llamarlo ExcelComponent.jsx, tú puedes darle el nombre que veas oportuno. https://flic.kr/p/2pihzkp Ahora tendremos que importar nuestro componente dentro de App.js para poder visualizarlo en nuestra aplicación y nos debería quedar tal que…continue reading →

Chakra UI en React

Chakra UI Chakra UI es una biblioteca de componentes sencilla, modular y accesible que nos proporciona bloques de construcción muy buenos para nuestros proyectos de React. Para empezar comenzaremos con la instalación de Chakra UI, en nuestro cmd tras crear un proyecto de React : https://www.flickr.com/photos/199600759@N03/53359944489/in/dateposted-public/ Nos introduciremos en el proyecto y descargaremos la librería de Chakra UI: https://www.flickr.com/photos/199600759@N03/53359619786/in/dateposted-public/ Tras descargarla dentro de nuestro proyecto de react en visual studio code o el editor de código que uses nos introduciremos en index.js para modificar el código. Lo primero que haremos dentro de index.js…continue reading →