Publicado por

PR2- Knittrack app- Nathalia Padrón

Publicado por

PR2- Knittrack app- Nathalia Padrón

Aquí les dejo el video y la documentación de mi aplicación, pueden ver la versión Live en el siguiente Link. https://knittracker.netlify.app/ Presentación   Entrega de la actividad PR2 …
Aquí les dejo el video y la documentación de mi aplicación, pueden ver la versión Live en el siguiente…

Aquí les dejo el video y la documentación de mi aplicación, pueden ver la versión Live en el siguiente Link. https://knittracker.netlify.app/

Presentación

 

Debate0en PR2- Knittrack app- Nathalia Padrón

No hay comentarios.

Publicado por

Batch Cooking App – PR2

Publicado por

Batch Cooking App – PR2

  Ideación inicial Batch Cook surge de un problema real: planificar la comida semanal sin perder la cabeza con el stock de…
  Ideación inicial Batch Cook surge de un problema real: planificar la comida semanal sin perder la cabeza con…

 

Ideación inicial

Batch Cook surge de un problema real: planificar la comida semanal sin perder la cabeza con el stock de la nevera, los tiempos de cocción y la lista de compra. La idea en PR1 era un gestor de batch cooking con secciones bien separadas (Recetario, Nevera, Semana, Batch, Lista, Timers). En PR2 el objetivo era completarla: que la búsqueda de recetas fuera real, no simulada, conectando con una API externa de verdad.


Consultas y pasos con la documentación de Capacitor

Seguí la Migration Guide oficial de Capacitor 8: actualizar los paquetes en package.json, ajustar variables.gradle (minSdk, compileSdk, targetSdk), y revisar la lista de breaking changes por plugin. La parte más costosa fue entender la cadena AGP → Gradle → JDK: el error de minSdk me llevó al de compileSdk, que me llevó a AGP 8.9.1, que requería Gradle 8.11.1, que requería JDK 21. Leyendo los release notes de Android Gradle Plugin esa cadena queda clara.


Pruebas con funcionalidades nativas

  • Camera (@capacitor/camera): foto de perfil de receta desde cámara o galería. Requirió minSdk 24.
  • Preferences (@capacitor/preferences): persistencia de todo el estado de la app (recetas, nevera, semana, timers). La funcionalidad central del proyecto.
  • Haptics (@capacitor/haptics): feedback táctil al marcar un ingrediente de la lista o al activar un timer.
  • Local Notifications (@capacitor/local-notifications): notificación cuando un timer llega a cero.
  • Filesystem (@capacitor/filesystem): explorado pero finalmente no usado en producción; el estado completo cabe en Preferences.

Decisiones tomadas y aprendizajes

La decisión más importante fue migrar a v8 aunque costara tiempo. Quedarme en v6 habría solucionado el problema a corto plazo pero habría ignorado el feedback directo de la profesora y dejado el proyecto con deuda técnica. Aprendí a leer la cadena de dependencias de Gradle de forma metódica en lugar de ir probando versiones a ciegas. También aprendí que noLoop() con la Page Visibility API es una mejora de rendimiento que cuesta 5 líneas y tiene impacto real en batería.


Bocetos, capturas e iteraciones

 


Justificación, problemas y conclusiones

Los tres problemas más relevantes de PR2: OneDrive bloqueaba npm install (solución: mover el proyecto fuera de la carpeta sincronizada), la cascada de incompatibilidades de Capacitor v8 (solución: leer los release notes y actualizar AGP, Gradle y JDK en orden), y Android Studio demasiado antiguo (solución: actualizar a Ladybug). Conclusión: PR2 ha sido más de infraestructura que de producto. La app mejora en rendimiento, compatibilidad y funcionalidad real de API, pero el trabajo visible es menor que el trabajo técnico que hay detrás.


Fuentes

  • Capacitor 8 docs y Migration Guide — capacitorjs.com
  • Android Gradle Plugin release notes — developer.android.com
  • TheMealDB API — themealdb.com/api.php
  • p5.js Reference (noLoop/loop) — p5js.org/reference
  • MDN Web Docs: Page Visibility API — developer.mozilla.org
  • Google Fonts, Iconify
  • Materiales del aula UOC PR2
  • Claude (Anthropic) — asistente de programación para debugging y resolución de problemas técnicos

Vídeo elevator pitch 


Como publicar en Google Play

Para publicar en Google Play necesitas:

  1. Cuenta de desarrollador — Google Play Console, pago único de 25$.
  2. APK/AAB firmado — en Android Studio: Build → Generate Signed Bundle/APK → Android App Bundle. Necesitas un keystore (créalo desde el mismo wizard).
  3. Play Console — crea una nueva app, completa la ficha (nombre, descripción, capturas de pantalla, política de privacidad obligatoria), sube el AAB a «Internal testing».
  4. Revisión — Google revisa en 1–3 días. Para apps de estudiante/prototipo, «Internal testing» es suficiente: puedes compartir un enlace con hasta 100 testers sin pasar por revisión pública.

La política de privacidad es el requisito que más gente ignora y que bloquea la publicación. Con una app que usa cámara o almacenamiento local es obligatoria.

Debate0en Batch Cooking App – PR2

No hay comentarios.

Publicado por

KraftBeat Mobile 2.0

Publicado por

KraftBeat Mobile 2.0

Entrega de la actividad PR2 …
Entrega de la actividad PR2 …

Debate0en KraftBeat Mobile 2.0

No hay comentarios.

Publicado por

Documentacion PR2

Publicado por

Documentacion PR2

Entrega de la actividad PR2 …
Entrega de la actividad PR2 …

Debate0en Documentacion PR2

No hay comentarios.

Publicado por

PR1 DOCUMENTACION

Publicado por

PR1 DOCUMENTACION

Entrega de la actividad PR1 …
Entrega de la actividad PR1 …

Debate0en PR1 DOCUMENTACION

No hay comentarios.

Publicado por

PR1

Publicado por

PR1

Entrega de la actividad PR1 …
Entrega de la actividad PR1 …

Debate0en PR1

No hay comentarios.

Publicado por

PR1 – Batch Cooking

Publicado por

PR1 – Batch Cooking

Muy buenas noches a tod@s, Os presento mi propuesta, se trata de una aplicación que gestiona el proceso de Batch Cooking (preparar…
Muy buenas noches a tod@s, Os presento mi propuesta, se trata de una aplicación que gestiona el proceso de…

Muy buenas noches a tod@s,

Os presento mi propuesta, se trata de una aplicación que gestiona el proceso de Batch Cooking (preparar comidas para toda una semana en una tarde). Os cuento un poco la historia:

La idea surgió a partir de un proyecto que empecé con una amiga, se que es un tema que tiene mucha utilidad y la verdad es que crear una aplicación móvil me parece una integración muy útil. Asi pues también estuve mirando las aplicaciones que ya existían en la Play Store y ninguna tenia todas las funcionalidades que buscaba.

Primeros bocetos de la idea:

Documentación de gran ayuda sobretodo el uso de integraciónes y plugins ya existentes:

El github del proyecto es el siguiente lo podeis descargar y probar, unicamente necesitais los comandos de npm install y npm run dev para tener el proyecto listo.

Link github: https://github.com/Ramonet02/PR1_Batch_Cooking.git

Debate0en PR1 – Batch Cooking

No hay comentarios.

Publicado por

Actividad PR1- Intro Capacitor / knitTracker (Capacitor + Android)

Publicado por

Actividad PR1- Intro Capacitor / knitTracker (Capacitor + Android)

Autor: Nathalia Padrón Knit Tracker App compilada con Capacitor, el web stack utilizado fue Javascript y Vite.js empaquetada en una aplicación Android…
Autor: Nathalia Padrón Knit Tracker App compilada con Capacitor, el web stack utilizado fue Javascript y Vite.js empaquetada en…
Autor: Nathalia Padrón
Knit Tracker App

compilada con Capacitor, el web stack utilizado fue Javascript y Vite.js empaquetada en una aplicación Android con Capacitor.

Para el Reto 1 he configurado y compilado una Aplicación Android con Capacitor. Se llama KnitTracker y es una aplicación para gestionar proyectos de tejido. Cuando se tejen muchos proyectos a la vez, es difícil tener una estructura para llevar el tiempo invertido en cada proyecto y a su vez es difícil conseguir un lugar en común donde guardar información de dónde me encuentro en el proyecto. Esta App ayuda gestionar proyectos de tejido en paralelo. Una unidad usada para leer patrones es el número de la vuelta, en físico se utilizan contadores de punto, pero a menudo es fácil perderlos y ésta App te permite accesar esa información.

Knittracker habilita un contador de vueltas que la persona va incrementando a medida que avanza en la labor, el App guarda en Local Storage esta información. Otra función es la de cronometrar el tiempo invertido en el proyecto, permite que actives el cronómetro cada vez que te sientes a tejer en un proyecto específico. El App permite asignar milestones por cada proyecto que a lo largo del tiempo a medida que se cumplen suman a un porcentaje de progreso. Con cada milestone cumplida el usuario recibe un mensaje celebratorio.

Objetivos del App:
– Crear proyectos de tejido
– Definir milestones
– Medir el tiempo invertido
– Visualizar el progreso
Funcionamiento
1 — Creating and Managing a Project
2- Tracking Progress
3 – Completing a Milestone
Referencias y recursos de aprendizaje

Este proyecto se desarrolló combinando documentación oficial y tutoriales prácticos.

### Documentación oficial

– Documentación de Capacitor
https://capacitorjs.com/docs

– API de Haptics de Capacitor
https://capacitorjs.com/docs/apis/haptics

– Documentación de Vite
https://vitejs.dev/guide/

– Documentación de Android Studio
https://developer.android.com/studio

– API de Web Storage (localStorage)
https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

Recursos en vídeo

– «Capacitor Crash Course»
https://www.youtube.com/watch?v=4n6X9y6Zy6Q

– «Build Android Apps with Capacitor»
https://www.youtube.com/watch?v=8s3vP3k5s0E

– «Vite JS Crash Course»

– «Understanding localStorage in JavaScript»

 

## Probar la Aplicación en el emulador de Android

Puedes correr la aplicación mediante el flujo

«`zsh
npm run build
npx cap sync android
npx cap open android«`

La configuración recomendada es:

Pixel 5, API Level: 33 / 34.

 

Aqui encuentras el link a mi proyecto en Github: https://github.com/NattyDCI/capacitor_app

Debate0en Actividad PR1- Intro Capacitor / knitTracker (Capacitor + Android)

No hay comentarios.

Publicado por

Reto 3 – Extensión de Firefox para visualización de tiempo en sitios web

Publicado por

Reto 3 – Extensión de Firefox para visualización de tiempo en sitios web

Autora: Nathalia Carolina Padrón Proyecto: Desarrollo de una extensión para Firefox que registra y muestra el tiempo que le dedicas a cada…
Autora: Nathalia Carolina Padrón Proyecto: Desarrollo de una extensión para Firefox que registra y muestra el tiempo que le…
Autora: Nathalia Carolina Padrón

Proyecto: Desarrollo de una extensión para Firefox que registra y muestra el tiempo que le dedicas a cada sitio web

Introducción

En este proyecto se ha desarrollado una extensión para el navegador Mozilla Firefox con el objetivo de mejorar la experiencia de navegación del usuario. A lo largo del trabajo se han abordado distintas fases, desde la idea inicial hasta la implementación y pruebas finales.

Screenshot

Concepto

Una extensión de navegador es un pequeño software que añade funcionalidades adicionales a un navegador web. En este caso, la extensión desarrollada permite ampliar las capacidades de Firefox, adaptándolo a necesidades específicas del usuario.

Screenshot

Finalidad y uso

La aplicación tiene como finalidad principal ayudar al usuario a tomar conciencia del tiempo que dedica a distintas páginas web durante su navegación diaria.

A diferencia de otras herramientas de control, esta extensión no limita el uso ni interrumpe la experiencia, sino que ofrece una visualización constante y accesible del tiempo transcurrido.

Entre sus principales casos de uso se encuentran:

  • Controlar el tiempo dedicado a tareas de trabajo o estudio
  • Detectar el uso excesivo de páginas de entretenimiento o redes sociales
  • Analizar hábitos de navegación a lo largo del día
  • Consultar de forma rápida el tiempo acumulado mediante el registro diario

Estructura técnica del proyecto

La extensión ha sido desarrollada utilizando tecnologías web como HTML, CSS y JavaScript, creando una interfaz sencilla e interactiva dentro del navegador Mozilla Firefox.

El popup de la extensión está diseñado con HTML y CSS, mientras que JavaScript se encarga de actualizar dinámicamente los elementos del DOM para mostrar información en tiempo real. La interacción con el usuario se realiza mediante botones que permiten reiniciar el tiempo registrado y consultar el historial de actividad diaria.

Para la gestión de datos, se utiliza el sistema de almacenamiento local del navegador (browser.storage.local), donde se guarda el tiempo de uso organizado por día y dominio. Esto permite mantener la información incluso después de cerrar el navegador, facilitando su recuperación y visualización en cualquier momento.

A nivel técnico, el proyecto se estructura en varios archivos con funciones específicas:

  • manifest.json, que define la configuración y permisos de la extensión
  • background.js, encargado del seguimiento del tiempo y la lógica principal
  • popup.html / popup-v2.html, que contiene la interfaz visible para el usuario
  • style.css, que define el diseño visual
  • popup.js, que gestiona la interacción y actualización de datos
  • popup-sketch.js, que implementa la visualización gráfica mediante la librería p5.js

Esta organización modular permite separar la lógica, la interfaz y la visualización, facilitando el mantenimiento y la escalabilidad del proyecto.

Enlace al repositorio de Github

https://github.com/NattyDCI/firefox_extension_app

Pdf del proyecto

Debate0en Reto 3 – Extensión de Firefox para visualización de tiempo en sitios web

No hay comentarios.

Publicado por

FIREFOX_RELOJ

Publicado por

FIREFOX_RELOJ

Entrega de la actividad R3 …
Entrega de la actividad R3 …

Debate0en FIREFOX_RELOJ

No hay comentarios.