Tiempo de lectura: < 1 minuto Hoy vamos a aprender cómo podemos añadir un vídeo de YouTube en React. Lo primero que tenemos que hacer es añadir esta dependencia: Una vez instalada vamos a crear el componente que se va a encargar de abrir el vídeo de YouTube. La llamamos YoutubePlayer.tsx Puedes personalizar las opciones añadiendo playerVars: referencia. Y este es … Leer más
Tiempo de lectura: 3 minutos Hoy vamos a aprender cómo podemos configurar ESLint para un proyecto que utiliza React y React Native y JavaScript o TypeScript. Nos permitirá reconocer los errores que aparecen en nuestro código y configurar el tipo de error que queremos. Lo primero de todo es instalar ESLint: Una vez instalado, lo instalamos en nuestro proyecto. Y … Leer más
Tiempo de lectura: 2 minutos Hoy os voy a compartir una configuración de contenedor para React basado en Nginx. Para ello vamos a crear este docker-compose.yml Ahora vamos a crear nuestro Dockerfile Finalmente, crearemos las carpetas necesarias: El fichero nginx.conf debe contener: Recuerda que la carpeta de distribución de React generada con Vite está dentro de dist, debes ponerla en … Leer más
Tiempo de lectura: < 1 minuto Hoy os comparto una solución para configurar correctamente el fichero nginx.conf y hacerlo compatible con la gestión de rutas de react-router-dom. Para solucionar el error, tenemos que añadir la línea try_files $uri $uri/ /index.html; dentro del archivo nginx.conf isMa Ingeniero en Informática, me encanta crear cosas o arreglarlas y darles una nueva vida. Escritor y … Leer más
Tiempo de lectura: < 1 minuto Hoy vamos a aprender cómo podemos generar un build de desarrollo con React Vite. Esto generará la carpeta dist con configuración de desarrollo. Para ello tenemos que ir al archivo packcage.json y añadir este comando dentro de «scripts»: { Y para poder utilizarlo tenemos que utilizar este comando: De esta forma generaremos el build en … Leer más
Tiempo de lectura: 2 minutos Vamos crear un componente de RadioGroup compuesto a su vez de RadioButtons. Primero vamos a crear el componente RadioGroup. Ahora creamos un componente RadioButton como muestro a continuación: Después vamos a usar los componentes de la siguiente manera. Por último muestro como queda el resultado. Espero que les sirva de ayuda. ¡Que tengan un feliz … Leer más
Tiempo de lectura: < 1 minuto Hoy vamos a aprender cómo podemos cargar un fichero XLS de Excel usando React. Lo primero que tenemos que hacer es instalar la librería xlsx: Una vez instalado creamos nuestra función de carga XLSLoader Aquí indicamos la ruta correcta al archivo: nuestra_ruta_al_xls.xls Si queremos hacer un componente independiente: Y para utilizarlo: isMa Ingeniero en Informática, … Leer más
Tiempo de lectura: 4 minutos Hoy vamos a aprender cómo podemos cargar un fichero XML dentro de nuestro proyecto React para mostrar los datos. Lo primero que vamos a hacer es instalar la librería necesaria, en este caso usaremos xml2js Una vez instalado vamos a crear el componente que se encargará de cargar nuestro fichero XML. XMLLoader.js En TypeScript: Explicación: … Leer más
Tiempo de lectura: < 1 minuto Hola, hoy vamos a aprender a añadir un Theme para personalizar los colores que se muestran en el tema de nuestra web en React. Para este tutorial vamos a utilizar Material UI Primero instalamos las dependencias necesarias: Ahora vamos a crear nuestro tema, creamos un archivo llamado theme.tsx (uso TypeScript, puedes crearlo en JavasScript) En … Leer más
Tiempo de lectura: < 1 minuto Hoy aprenderemos cómo podemos conectar nuestra aplicación desarrollada en React Native con un WebSocket usando la librería https://www.npmjs.com/package/react-native-websocket Configuración de la Aplicación React Native Asegúrate de reemplazar ws://localhost:8000/ws/1 con la URL de tu servidor FastAPI. o Visita http://localhost:3000 en tu navegador y verás la aplicación React Native. Puedes escribir mensajes, enviarlos y ver las respuestas … Leer más
