NeoTasks AI — Micro-app Kanban (drag & drop natif)
Trois colonnes À faire / En cours / Fait avec drag & drop HTML5 (sans dépendance). Bouton de génération de tâches (mock IA), filtre en temps réel et compteur. Interface épurée, lisible et accessible.
Demo
À faire
2Installer Tailwind & configurer tokens
À faire
Ajouter ESLint + TS strict
À faire
En cours
1Mettre en place App Router (Next 14)
En cours
Fait
1Optimiser images (next/image)
Fait
Fonctionnalités
- Drag & drop HTML5 natif entre colonnes (aucune lib externe).
- Bouton “Générer des tâches” (mock IA) — ajoute 5 tâches crédibles.
- Filtre instantané + compteur (visible / total).
- 100% front, données mockées en TypeScript.
- Esthétique sobre, halos subtils, coins 2xl.
Tech & Architecture
- Next.js 14 (App Router), TypeScript.
- Tailwind CSS + composants maison.
- DnD via
DragEvent
(onDragStart/Over/Drop) — HTML5 natif. - Composant
<Kanban />
isolé dans /components
.
UX & Accessibilité
- Contrastes élevés, focus visibles, texte lisible sur fond sombre.
- ARIA : colonnes
role="list"
, cartes role="listitem"
. - Animations légères, non agressives.
Limites & pistes
- Pas de persistance au-delà du rechargement (démo front-only).
- Pas de multi-utilisateur.
- Pistes : localStorage, tri avancé, multi-boards.