# Fit Evolution: un dashboard web para exprimir los datos de tu báscula de bioimpedancia > Por qué construí fit.pacoforet.com, una app web personal y de código abierto para analizar la evolución física, recomposición corporal y métricas de bioimpedancia con arquitectura sin base de datos. - URL: https://pacoforet.com/posts/fit-dashboard-seguimiento-peso-bioimpedancia/ - Autor: Paco Foret - Publicado: 2026-09-03 - Temas: Proyectos - Actualizado: 2026-09-23 La mayoría de básculas de bioimpedancia actuales (RENPHO, Withings, Xiaomi, Fitbit) miden mucho más que el peso bruto: registran porcentaje graso, masa muscular esquelética, grasa visceral, agua corporal o tasa metabólica basal. El problema habitual reside en sus aplicaciones móviles propietarias: suelen estar cargadas de opciones superfluas, intentan vender suscripciones premium y presentan gráficas simplistas que no permiten analizar la recomposición corporal con rigor. Para resolver esto creé **Fit Evolution**, un dashboard web personal, optimizado como PWA móvil y con arquitectura *zero-database*, cuyo código he liberado en abierto en GitHub para que cualquiera pueda usarlo con sus propios datos. - **Repositorio:** [github.com/pacoforet/fit.pacoforet.com](https://github.com/pacoforet/fit.pacoforet.com) - **Demo funcional:** [fit.pacoforet.com](https://fit.pacoforet.com) *(en la pantalla de acceso, pulsa **"Ver la demo con datos de ejemplo"** para explorar el panel con datos de prueba)* > [!INFO] > **Actualizado el 23 de septiembre de 2026:** la app estrena diseño, con tres vistas (Resumen, Tendencias e Historial), el inicio de sesión se valida ahora en el servidor y el importador acepta el nuevo formato de CSV de RENPHO. El post refleja la versión actual. ![Fit Evolution: vista Resumen con el peso en tendencia de 7 días, la meta con fecha estimada de llegada y las métricas clave](https://pacoforet.com/_astro/fit-dashboard-preview.BDMAuGyX_Zp0twR.webp) --- ## Por qué el peso diario engaña El peso en báscula fluctúa a diario entre 1 y 3 kilos debido a la retención de líquidos, el contenido digestivo, el consumo de sodio o los depósitos de glucógeno muscular. Obsesionarse con la variación de un martes a un miércoles solo genera frustración. Lo que determina si un plan de entrenamiento o nutrición funciona es: 1. **La tendencia suavizada:** una media móvil de 7 días que filtra el ruido diario. 2. **El ritmo relativo:** cuánto cambias por semana en porcentaje de tu peso corporal. Bajar 1 kg a la semana no significa lo mismo con 70 kg que con 110 kg. 3. **La recomposición corporal:** qué parte del peso perdido es grasa y qué parte es masa magra. 4. **El índice FFMI (Fat-Free Mass Index):** un indicador más representativo que el clásico IMC para evaluar la masa libre de grasa en función de la estatura. Fit Evolution está diseñado en torno a estas premisas. --- ## Qué incluye la aplicación La interfaz se organiza en tres vistas. En el ordenador se cambia entre ellas con pestañas y en el móvil con una barra inferior, junto a un botón flotante para añadir un pesaje. ### Resumen: ¿voy bien? - **Peso en tendencia de 7 días** como cifra principal, con el cambio desde el inicio, el de los últimos 7 días y el ritmo en kg/semana. - **Etiqueta de ritmo** calculada según el porcentaje de peso corporal por semana: saludable, rápido, lento, estable o alejándote de la meta. - **Un resumen en lenguaje natural**, del tipo *"En 9 días has bajado 1,5 kg. A este ritmo llegarás a 75,0 kg hacia el 16 de septiembre"*, con un consejo cuando el ritmo es demasiado rápido. - **Tarjeta de meta** con el progreso, los kilos que faltan y la **fecha estimada de llegada**, calculada con el ritmo real de las últimas semanas. - **Métricas clave** (grasa corporal, masa magra y grasa visceral) con minigráficas de evolución. - **Gráfica principal** sobre un eje de tiempo real: línea de tendencia, pesajes diarios como puntos, línea de meta y selectores para peso, grasa, músculo o masa grasa frente a masa magra en 7, 30, 90 días o todo el histórico. - **Qué has perdido:** cuánto del peso perdido es grasa y cuánto masa magra, con una valoración de la calidad de la pérdida. - **Hitos:** inicio, números redondos superados, mínimo histórico, mejor semana, próximo hito y meta. ### Tendencias - Cambio medio semanal en gráfica de barras y en tabla. - Todas las métricas que registra la báscula (masa grasa, masa magra, músculo esquelético, grasa visceral y subcutánea, agua, proteína, masa ósea, BMR, edad metabólica e IMC), más el **FFMI** normalizado por estatura. ### Historial - Búsqueda por fecha, selección de columnas visibles, paginación y borrado con opción de **deshacer**. ### Además - **Imagen de progreso para compartir** en formato 1080 × 1350, con la hoja nativa de compartir en el móvil. - **PWA instalable** en iOS y Android, con tema claro y oscuro. - **Accesibilidad:** diálogos nativos, navegación por teclado, foco visible, zonas táctiles de 40 px o más y soporte para movimiento reducido. - **Los pesajes manuales no se inventan datos:** si solo introduces el peso, las métricas de bioimpedancia de ese día quedan vacías. ![Fit Evolution en tema oscuro en el ordenador y en el móvil, con la barra de navegación inferior y el botón para añadir un pesaje](https://pacoforet.com/_astro/fit-dashboard-dark-mobile.D8NlQ9b0_1R9jpe.webp) --- ## Arquitectura técnica: privacidad sin base de datos Uno de los objetivos del proyecto era evitar costes de servidores, suscripciones y riesgos de privacidad con datos sensibles de salud. - **Frontend:** **Astro 6** con TypeScript y **Tailwind CSS v4** con tokens de diseño semánticos para los temas claro y oscuro. La salida es un sitio estático. - **Gráficas:** **Chart.js 4**, empaquetado con la app en lugar de cargarse desde un CDN. - **Almacenamiento local:** los pesajes se guardan siempre en el `localStorage` del navegador. Sin configurar la sincronización, los datos no salen de tu dispositivo. - **Sincronización opcional con GitHub Gist:** para tener los mismos datos en el ordenador y en el móvil, la app guarda un archivo JSON en un Gist privado de tu propia cuenta. El servidor solo conoce un token de GitHub limitado a Gists y el hash de tu contraseña, nunca tus datos. - **Inicio de sesión en el servidor:** dos Vercel Edge Functions gestionan el acceso. `/api/session` comprueba la contraseña con PBKDF2-SHA256 y crea una cookie de sesión firmada (`HttpOnly`, `Secure`, `SameSite=Strict`), y `/api/fit-sync` exige esa cookie y valida cada registro antes de escribir en el Gist. - **Cabeceras de seguridad:** CSP, `X-Frame-Options`, `nosniff` y `Referrer-Policy`. Los scripts y las fuentes se sirven desde el propio dominio. - **Importación de datos:** importador de CSV de RENPHO (con cabeceras en español o en inglés, incluido su formato nuevo), formulario de registro manual y exportación en CSV o JSON para copias de seguridad. --- ## Cómo ponerlo en marcha en tu propio entorno ### 1. Probarlo en local Necesitas Node.js 22.12 o superior. ```bash title="Terminal" ln git clone https://github.com/pacoforet/fit.pacoforet.com.git cd fit.pacoforet.com npm install npm run dev ``` Abre `http://localhost:4321` y pulsa **"Ver la demo con datos de ejemplo"**. `npm run dev` solo sirve el frontend: la demo funciona, pero el inicio de sesión y la sincronización no. Para probar también la API en local hay que usar `vercel dev` con un archivo `.env`. ### 2. Desplegar tu propio dashboard Son unos 10 minutos y cabe en los planes gratuitos de Vercel y GitHub: 1. Haz un fork del repositorio e impórtalo en Vercel. 2. Crea un Gist **secreto** con un archivo `fit-data.json` que contenga `{}` y copia su ID. 3. Crea un token *fine-grained* de GitHub con permiso **Gists: Read and write** y nada más. 4. Ejecuta `npm run auth:hash` en tu copia local: te pide usuario y contraseña (mínimo 10 caracteres) y genera el valor de `FIT_PASSWORD_HASH`. 5. Añade en Vercel las variables `FIT_PASSWORD_HASH`, `FIT_GITHUB_TOKEN` y `FIT_GIST_ID`, y vuelve a desplegar. Sin las variables del Gist el dashboard sigue funcionando, pero guarda los datos solo en ese navegador. El [README del repositorio](https://github.com/pacoforet/fit.pacoforet.com#-deploy-your-own-dashboard) tiene la guía completa, la referencia de variables y una sección de problemas frecuentes. ### 3. Cargar tus datos 1. Inicia sesión con el usuario y la contraseña del paso 4. 2. Exporta tu histórico en CSV desde la app de RENPHO y súbelo desde **⋯ → Importar CSV de RENPHO**. 3. En **⋯ → Metas y perfil**, indica tu nombre, tu estatura y tus metas de peso y grasa corporal. 4. A partir de ahí puedes añadir pesajes a mano con el botón **Añadir pesaje**. El código está disponible bajo licencia MIT en [github.com/pacoforet/fit.pacoforet.com](https://github.com/pacoforet/fit.pacoforet.com).