Nextodo — Aplicación Kanban tipo Trello desarrollada con Next.js

Contexto

Nextodo es una aplicación web de gestión de tareas inspirada en interfaces Kanban como Trello.

El proyecto se realizó en el marco de un ejercicio técnico destinado a explorar las buenas prácticas del desarrollo front-end moderno con React y Next.js, así como la puesta en marcha de tests unitarios y end-to-end.

El objetivo era concebir una interfaz fluida que permitiera organizar visualmente las tareas y manipular los elementos mediante arrastrar y soltar.

Problema

La gestión de tareas se vuelve rápidamente difícil cuando los proyectos no están organizados visualmente.

Las herramientas tipo Kanban permiten estructurar las tareas en columnas e identificar rápidamente:

• las tareas por hacer
• las tareas en curso
• las tareas terminadas.

El proyecto pretendía reproducir esta lógica poniendo en práctica los conceptos modernos del desarrollo front-end.

Solución

Nextodo ofrece una interfaz sencilla para crear columnas y organizar en ellas las tareas en forma de tarjetas.

Los usuarios pueden reorganizar los elementos gracias a un sistema de arrastrar y soltar, que facilita la priorización y el seguimiento del avance.

La aplicación se apoya en Next.js y React, con gestión del estado mediante Redux y el uso de la biblioteca react-beautiful-dnd para el desplazamiento fluido de las tarjetas y columnas.

Funcionalidades principales

• creación y supresión de columnas Kanban
• creación, modificación y supresión de tareas
• organización de tareas por arrastrar y soltar
• desplazamiento de tarjetas entre columnas
• gestión del estado de las tareas (por hacer / terminadas)
• filtros de visualización de tareas
• supresión rápida de las tareas terminadas.

Cada columna dispone además de filtros para mostrar solo determinadas tareas según su estado.

Resultados

Nextodo constituye una demostración práctica de la creación de una interfaz Kanban moderna con React.

El proyecto pone de relieve:

• la gestión del estado de una aplicación front-end
• la manipulación de elementos dinámicos mediante arrastrar y soltar
• el diseño de interfaces interactivas y modulares.