Cómo agregar un Modo Oscuro en React con Tailwind CSS de forma manual

Cómo agregar un Modo Oscuro en React con Tailwind CSS de forma manual

Tiempo de lectura: 2 minutos Cómo añadir modo oscuro con React y Tailwind CSS de forma manual. 1️⃣ Configurar Tailwind CSS Si aún no tienes Tailwind instalado en tu proyecto, agrégalo con: Luego, en tailwind.config.js, habilita el modo oscuro basado en clases: 2️⃣ Crear un Hook para manejar el modo oscuro Creamos un hook useDarkMode.ts que guarda la preferencia en … Leer más

Cómo arrastrar elementos por la pantalla con React

Cómo arrastrar elementos por la pantalla con React

Tiempo de lectura: 2 minutos Hoy vamos a aprender cómo podemos arrastrar elementos por la pantalla con React. 1️⃣ Instalar react-draggable Primero, instala la librería con npm o yarn: 2️⃣ Crear el componente de arrastre Ahora, crearemos un componente básico que se pueda arrastrar: 🔹 Explicación: 3️⃣ Usarlo en tu aplicación Importa y usa el componente en App.tsx o cualquier … Leer más

Mejorando la App de Tareas con SQLite y Estilos en React Native

Mejorando la App de Tareas con SQLite y Estilos en React Native

Tiempo de lectura: 2 minutos En esta segunda parte, mejoraremos nuestra app de tareas de React Native con las siguientes mejoras: Requisitos previos 1. Instalando SQLite Expo proporciona un wrapper para SQLite, lo instalamos con: Creamos un archivo database.js en src/utils/ para manejar la base de datos: 2. Modificar la Pantalla para Usar SQLite Editamos HomeScreen.js: 3. Aplicando Estilos con … Leer más

Crea una App de Tareas con React Native

Crea una App de Tareas con React Native

Tiempo de lectura: 2 minutos En este tutorial, vamos a construir una sencilla app de tareas con React Native, que incluya: Requisitos previos 1. Creación del Proyecto Ejecuta el siguiente comando en tu terminal para crear un nuevo proyecto Expo: Iniciamos el proyecto con: 2. Instalación de Dependencias Instalamos las librerías necesarias: 3. Configurar Navegación Creamos navigation.js dentro de src/: … Leer más

Comparar fechas en UTC (defecto en MariaDB) y obtener los segundos de diferencia con React Native (también sirve para React o JavaScript general)

Comparar fechas en UTC (defecto en MariaDB) y obtener los segundos de diferencia con React Native (también sirve para React o JavaScript general)

Tiempo de lectura: < 1 minuto Hoy os traigo un pequeño script para vuestras aplicaciones móviles qué permitirá comparar dos fechas en formato UTC en React Native, React o JavaScript Vanila y obtener los segundos de diferencia. El código obtiene una fecha que llega en formato UTC desde la base de datos. A veces no incluye la Z al final, se … Leer más

Creando una Aplicación Web Interactiva Usando FastAPI, React y WebSockets

Creando una Aplicación Web Interactiva Usando FastAPI, React y WebSockets

Tiempo de lectura: 3 minutos Aprender a construir una aplicación web en tiempo real, utilizando FastAPI para el backend y React con WebSockets para el frontend. Esta app permitirá a los usuarios interactuar en tiempo real, mostrando cómo integrar tecnología moderna en un flujo de trabajo eficiente. Requisitos Previos Paso 1: Configuración del Entorno Backend (FastAPI + WebSockets) Instalar FastAPI … Leer más

Crear una app interactiva usando FastAPI y React ejemplo de integración Backend – Frontend

Crear una app interactiva usando FastAPI y React ejemplo de integración Backend – Frontend

Tiempo de lectura: 2 minutos Desarrollaremos una aplicación web que utiliza FastAPI para el backend y React para el frontend. La app permitirá a los usuarios interactuar con un sistema de recomendaciones básicas, pero sin la complejidad de la IA. Las recomendaciones se basarán simplemente en las acciones que el usuario ingrese. Tecnologías a usar Requisitos previos Parte 1: Backend … Leer más

Eliminar permisos no necesarios al generar APK o app-bundle con Expo 52 React Native y plugin en build.gradle con gradle 8.10.2

Eliminar permisos no necesarios al generar APK o app-bundle con Expo 52 React Native y plugin en build.gradle con gradle 8.10.2

Tiempo de lectura: 2 minutos Hoy vamos a aprender cómo podemos eliminar permisos no necesarios qué se puedan añadir automáticamente a nuestro build desde librerías externas en React Native con Expo. Para realizar esta eliminación automática de los permisos tendremos qué crear un plugin para expo que añada un pequeño script dentro de build.gradle de Android en tiempo de generación … Leer más

Modificar proguard con Expo React Native usando app.json

Modificar proguard con Expo React Native usando app.json

Tiempo de lectura: < 1 minuto Hoy vamos a aprender cómo podemos modificar la configuración de proguard usando Expo en React Native. Primero tenemos que abrir nuestro app.json. Y vamos a plugins: Aquí dentro añadiremos la propiedad qué queramos para proguard-rules.pro En mi caso es la linea: Ahora generaremos el proyecto android: Y con esto podemos comprobar el archivo app/proguard-rules.pro isMa … Leer más

Crear un componente bocadillo animado para un videojuego React Native o React

Crear un componente bocadillo animado para un videojuego React Native o React

Tiempo de lectura: 2 minutos Hoy vamos a crear un componente que representa un bocadillo de texto animado para React o React Native. El componente recibirá un texto o un elemento qué represente un texto y además mostrará un puntero animado al final del texto. Y para utilizarlo haremos esto: También podemos utilizarlo con el componente TextoAnimado animado que hemos … Leer más