Gestor de tareas en React
Gestor de tareas personales en React y TypeScript con filtros, prioridades y estados.
01 Problema y contexto
En un gestor de tareas lo que se rompe no es la lista sino las reglas: qué estado hereda una copia, qué desaparece de la vista al archivarse, cómo se deriva el vencimiento de la fecha límite. Repartidas por los componentes, esas reglas se contradicen entre sí en cuanto la aplicación crece.
Un gestor de tareas personal donde lo interesante no es la lista sino las reglas: qué estado hereda una copia, qué desaparece de la vista al archivarse, cómo se deriva el vencimiento de la fecha límite. Funciona íntegramente en el navegador, sin cuenta y sin servidor. Es el proyecto más acotado del conjunto y cumple un papel claro: fijar el modelo de dominio y las reglas de negocio en TypeScript antes de llevarlas a una arquitectura con base de datos y multiusuario.
02 Solución
El modelo de dominio se escribió primero en TypeScript, con estado, prioridad y fecha límite como campos de primera clase, y las reglas de negocio se centralizaron en el estado global tras un contrato de cinco operaciones. La verificación se hizo contra un guion escrito que cubre los dos casos que más se rompen: el duplicado que debe volver a Pendiente y la tarea archivada que debe salir de la lista principal.
- Modelo de dominio primero: tipos en TypeScript para tarea, proyecto, lista y etiqueta, con estado, prioridad y fecha límite como campos de primera clase.
- Reglas de negocio centralizadas en el estado y no repartidas por los componentes: el título es obligatorio, una tarea nueva o duplicada nace en Pendiente, lo archivado sale de las vistas por defecto y el vencimiento se deriva del plazo.
- Estado global con React Context exponiendo un contrato acotado de cinco operaciones.
- Dos vistas: un panel con el resumen y una lista con búsqueda, filtrado combinado y ordenamiento.
- Interfaz propia en CSS plano con variables, sin framework de componentes.
- Verificación manual con un guion escrito de seis pasos, incluidos los dos casos que más se rompen: el duplicado que debe volver a Pendiente y la tarea archivada que debe salir de la lista principal.
03 Resultados
Cifras verificables en el repositorio y su documentación:
04 Cómo está construido
Aplicación web de gestión de tareas personales ("Tasker.io") construida como SPA con React 18, TypeScript y Vite. Permite crear, editar, duplicar, archivar y completar tareas con prioridades, fechas límite, proyectos, listas y etiquetas. El estado se maneja con React Context, aplicando reglas de negocio como que las tareas duplicadas vuelven a estado pendiente y las archivadas se omiten de la vista principal. Incluye un panel de resumen y una vista de listado con búsqueda, filtros combinados y ordenamiento.
05 Decisiones éticas
- Sin cuenta, sin servidor y sin telemetría: la aplicación no recolecta nada porque no tiene dónde enviarlo. Es una consecuencia del alcance más que una postura elaborada, y se declara como tal.
06 Aspectos destacados
- SPA en React 18 con TypeScript estricto y build con Vite.
- Estado global con React Context aplicando reglas de negocio propias.
- Listado con búsqueda, filtrado por prioridad, estado y fecha, y ordenamiento.
- Modelo de datos tipado para tareas, proyectos, listas, etiquetas y categorías.
07 Limitaciones
No hay conjunto de datos ni persistencia: el estado vive en memoria de React y una recarga de página lo borra por completo. No es una limitación descubierta después, es lo que el alcance permitía, y explica por qué el proyecto está archivado en lugar de mantenido: su continuación natural, con cuentas, base de datos y aislamiento por usuario, se implementó después en el centro de mando.