¿Cómo agregar un filtro personalizado en el cuadro de búsqueda en ReactJS?

El filtro personalizado significa agregar nuestro propio inicio de sesión comercial para filtrar las opciones que se muestran en el cuadro de búsqueda o en cualquier menú desplegable. Material UI for React tiene este componente disponible para nosotros y es muy fácil de integrar. Podemos crear nuestro propio filtro personalizado para opciones en ReactJS utilizando … Continue reading «¿Cómo agregar un filtro personalizado en el cuadro de búsqueda en ReactJS?»

Next.js SWR (Obsoleto mientras se revalida) Introducción

State While Revalidate es la biblioteca React Hooks para la obtención remota de datos, creada por Zeit. Se utiliza para  Devuelve los datos del caché (obsoleto) Envía la solicitud de recuperación (revalidar), y luego Viene con los datos actualizados de nuevo. Google dice sobre el concepto de SWR:   “Ayuda a los desarrolladores a equilibrar entre … Continue reading «Next.js SWR (Obsoleto mientras se revalida) Introducción»

Diferencia entre HTML y manejo de eventos React

El manejo de eventos en HTML y React son diferentes entre sí en términos de sintaxis y algunas reglas. La razón detrás de esto es que React funciona con el concepto de DOM virtual, por otro lado, el HTML tiene acceso al DOM real todo el tiempo. Vamos a ver cómo podemos agregar los eventos … Continue reading «Diferencia entre HTML y manejo de eventos React»

Galería de páginas deslizantes animadas usando framer-motion y React.js

El siguiente enfoque cubre cómo crear una galería de páginas deslizantes animadas usando framer-motion y ReactJS. requisitos previos: Conocimiento de JavaScript (ES6) Conocimientos de HTML y CSS . Conocimientos básicos de ReactJS . Creación de la aplicación React e instalación del módulo: Paso 1: Cree una aplicación React usando el siguiente comando: $ npx create-react-app … Continue reading «Galería de páginas deslizantes animadas usando framer-motion y React.js»

¿Cómo usar el componente Icon en ReactJS?

Material UI for React tiene este componente disponible para nosotros y es muy fácil de integrar. Podemos usar el componente Icon en ReactJS usando el siguiente enfoque. Creación de la aplicación React e instalación del módulo: Paso 1: Cree una aplicación React usando el siguiente comando. npx create-react-app foldername Paso 2: después de crear la … Continue reading «¿Cómo usar el componente Icon en ReactJS?»

Gancho useParams de ReactJS

En nuestra aplicación React a veces queremos acceder a los parámetros de la ruta actual, en este caso entra en acción el gancho useParams. El paquete react-router-dom tiene enlaces useParams que le permiten acceder a los parámetros de la ruta actual. Sintaxis: useParams(); Creación de la aplicación React e instalación de los módulos necesarios: Paso … Continue reading «Gancho useParams de ReactJS»

¿Cómo pasar datos del componente secundario a su padre en ReactJS?

Los siguientes son los pasos para pasar datos del componente secundario al componente principal: En el componente principal, cree una función de devolución de llamada. Esta función de devolución de llamada recuperará los datos del componente secundario. Pase la función de devolución de llamada al elemento secundario como accesorios del componente principal. El componente secundario … Continue reading «¿Cómo pasar datos del componente secundario a su padre en ReactJS?»

¿Cómo obtener datos de una API en ReactJS?

ReactJS: ReactJS es una biblioteca de JavaScript declarativa, eficiente y flexible para crear interfaces de usuario. Es ‘V’ en MVC. ReactJS es una biblioteca front-end de código abierto basada en componentes responsable solo de la capa de visualización de la aplicación. Es mantenido por Facebook. API: API es una abreviatura de Interfaz de programación de … Continue reading «¿Cómo obtener datos de una API en ReactJS?»

Componente de tostado ReactJS Reactstrap

Reactstrap es una biblioteca front-end popular que es fácil de usar con componentes React Bootstrap 4. Esta biblioteca contiene los componentes React sin estado para Bootstrap 4. Podemos usar el siguiente enfoque en ReactJS para usar el componente ReactJS Reactstrap Toast. Accesorios para tostadas: className: se utiliza para indicar el nombre de la clase para … Continue reading «Componente de tostado ReactJS Reactstrap»

Componente de botón de diseño de hormiga ReactJS UI

. El componente de botón proporciona Podemos usar el siguiente enfoque en ReactJS para usar el componente de botón Ant Design. Accesorios de botón: peligro: Se utiliza para establecer el estado de peligro del botón. block: Se utiliza como opción para ajustar el ancho del botón al ancho de su padre. disabled: se utiliza para … Continue reading «Componente de botón de diseño de hormiga ReactJS UI»