Crunch App es un prototipo de aplicación móvil construido con Expo + React Native. Permite crear, organizar, y dar seguimiento a tareas y medir la productividad. Este README documenta los pasos necesarios para clonar, instalar y ejecutar el proyecto.
Materia: Diseño y Evaluación de Interfaces de Usuario 6°F
Institución: Facultad de Telemática, Universidad de Colima
Estas son las librerías y frameworks clave utilizados en este proyecto:
Paquete | Versión | Descripción |
---|---|---|
expo | ~53.0.7 |
Framework base multiplataforma |
react‑native | 0.79.2 |
Motor UI nativo |
react | 19.0.0 |
Biblioteca de UI declarativa |
expo‑router | ~5.0.5 |
Enrutador estilo Next.js |
react‑native‑paper | ^5.14.1 |
UI Material Design |
@react-navigation/native
^7.1.6
@react-navigation/drawer
^7.3.11
@react-navigation/bottom-tabs
^7.3.10
@react-navigation/elements
^2.3.8
@react-native-async-storage/async-storage
2.1.2
– Storage local@react-native-community/datetimepicker
^8.3.0
– Picker nativoreact-native-toast-message
^2.3.0
– Toastsmoti
^0.30.0
– Animaciones declarativasdate-fns
^4.1.0
– Utilidades de fecha
@react-native-material/core
^1.3.7
@expo/vector-icons
^14.1.0
react-native-color-picker
,react-native-wheel-color-picker
expo-haptics
,expo-av
,expo-image
,expo-blur
,expo-font
,expo-status-bar
, etc.
eslint
, eslint-config-expo
, typescript
, @babel/core
, @types/react
git clone https://github.com/WhiteBryz/to-do-app
cd to-do-app
npm install
Requisito: Node.js 18.x y Expo CLI
npm install -g expo-cli
npx expo start
Al ejecutar npm start
o npx expo start
se abrirá en tu navegador el panel Expo Dev Tools.
Desde ahí puedes lanzar la app de tres maneras:
- Descarga Expo Go desde Google Play → Enlace para descargar Expo Go en GooglePlay
- Abre Expo Go y escanea el código QR que aparece en Expo Dev Tools.
La forma más rápida de probar en hardware real.
- En la consola de Metro presiona la tecla
w
o haz clic en Run in web browser.
Ideal para una vista rápida; recuerda que ciertas APIs nativas (notificaciones, sensores, etc.) pueden no estar disponibles.
- Instala Android Studio → Enlace hacia la página oficial de Android Studio
- Abre Device Manager y crea un AVD con una imagen de Android (API 34 recomendada).
- Asegúrate de que el emulador esté encendido.
- En tu terminal del proyecto ejecuta:
npm start
Requisito importante: Asegúrate de tener configuradas las variables de entorno:
ANDROID_HOME= Ruta a tu .../Android/Sdk
PATH += %ANDROID_HOME%\emulator
PATH += %ANDROID_HOME%\platform-tools
Guía oficial Expo + AVD: Guía oficial para instalar emulador de Android Studio + Expo
Otra opción altamente recomendada es instalar la app directamente desde un archivo .apk
generado con EAS Build.
📲 Puedes descargarla desde el siguiente enlace:
🔗 Descargar APK de la app (build Expo)
Al hacer clic en el botón Install, se descargará la APK en tu dispositivo.
Solo necesitas abrirla para instalarla (puede pedirte habilitar la instalación desde fuentes desconocidas).