Ticketing App

Reto

Replicar el flujo esencial de un tablero tipo Trello —varios boards, columnas y tarjetas que se arrastran entre estados— sin que la interacción se sienta lenta ni el estado se desincronice. El arrastre toca estructura y UI al mismo tiempo, y el contenido debía conservarse entre sesiones sin backend.

Enfoque

El movimiento se resuelve con DnD Kit: el reorden dentro de cada columna con sortable y los drops entre columnas con core, traduciendo cada evento de arrastre a una operación sobre el estado en vez de mutaciones directas del DOM. Ese estado vive en Zustand con Immer —escrituras claras sin copiar estructuras anidadas a mano— y se serializa a localStorage. Los formularios de boards, columnas y tarjetas validan con react-hook-form y Zod, los borrados piden confirmación, y sumé una barra de filtros lateral y exportación de los datos del tablero desde un módulo propio.

Resultado

Un gestor de tareas completo y creciente: arrastres fluidos entre columnas, contenido persistente entre recargas y una capa de estado lista para conectarse a un backend sin reescribir la UI.

Responsabilidades

• - Varios tableros con listado de boards, columnas kanban y tarjetas arrastrables con DnD Kit (sortable dentro de columnas, core entre columnas)
• - Estado global del tablero en Zustand con Immer: crear, editar, mover y eliminar tarjetas sin prop drilling
• - Modales de boards, columnas y tarjetas con react-hook-form y validación de esquemas con Zod
• - Borrados con confirmación explícita mediante alert-dialog y avisos de acción con toasts
• - Barra lateral de filtros del tablero y módulo de exportación de datos (lib/export)
• - Persistencia del tablero en localStorage con next-themes para tema claro/oscuro