Proyecto personal
FisioWorks - Front
React 19
Vite
React Router 7
Bootstrap 5
React 19 + Vite sobre una API Laravel, con modo demo de solo lectura.
Es la aplicación con la que se trabaja el día a día en una clínica de fisioterapia real, y el cliente de la API de FisioWorks. Nació de los requisitos recogidos directamente con el propietario de la clínica y hoy está en producción.
Qué ofrece. Un panel que se adapta al rol de quien entra (administrador, terapeuta o paciente), mostrando solo lo que le corresponde. El núcleo es una agenda con calendario interactivo donde se visualizan y gestionan las citas por estado, con modales de creación y edición que consultan al vuelo los huecos, terapeutas y salas libres. Alrededor, pantallas completas de gestión de usuarios, tratamientos, salas, especialidades, historiales clínicos y bonos, con filtros y paginación.
Arquitectura del cliente. Estado de autenticación global con la Context API, rutas protegidas y una capa de API centralizada sobre Axios con interceptores: inyección automática del token, redirección al login ante un 401 y aviso amable ante un 403.
Modo demo. Un botón «Probar demo» permite entrar sin registrarse: obtiene un token de solo lectura, muestra un banner permanente y convierte cualquier intento de escritura (que la API bloquea) en una notificación clara en lugar de un error.
Rendimiento. Trabajé el tamaño del bundle con code-splitting por rutas (React.lazy + Suspense), manteniendo la agenda en carga inmediata por ser la pantalla de inicio y aislando las librerías pesadas (FullCalendar, react-select) en chunks propios que cargan en paralelo. La carga inicial bajó a menos de la mitad.
El repositorio público es únicamente demostrativo y no refleja el estado real del código en producción.
Es la aplicación con la que se trabaja el día a día en una clínica de fisioterapia real, y el cliente de la API de FisioWorks. Nació de los requisitos recogidos directamente con el propietario de la clínica y hoy está en producción.
Qué ofrece. Un panel que se adapta al rol de quien entra (administrador, terapeuta o paciente), mostrando solo lo que le corresponde. El núcleo es una agenda con calendario interactivo donde se visualizan y gestionan las citas por estado, con modales de creación y edición que consultan al vuelo los huecos, terapeutas y salas libres. Alrededor, pantallas completas de gestión de usuarios, tratamientos, salas, especialidades, historiales clínicos y bonos, con filtros y paginación.
Arquitectura del cliente. Estado de autenticación global con la Context API, rutas protegidas y una capa de API centralizada sobre Axios con interceptores: inyección automática del token, redirección al login ante un 401 y aviso amable ante un 403.
Modo demo. Un botón «Probar demo» permite entrar sin registrarse: obtiene un token de solo lectura, muestra un banner permanente y convierte cualquier intento de escritura (que la API bloquea) en una notificación clara en lugar de un error.
Rendimiento. Trabajé el tamaño del bundle con code-splitting por rutas (React.lazy + Suspense), manteniendo la agenda en carga inmediata por ser la pantalla de inicio y aislando las librerías pesadas (FullCalendar, react-select) en chunks propios que cargan en paralelo. La carga inicial bajó a menos de la mitad.
El repositorio público es únicamente demostrativo y no refleja el estado real del código en producción.
Capturas
