Gestionnaire de Taches

Presentation

Objectif principal : Une app de gestion de taches style Trello mais simplifie. Des colonnes (A faire, En cours, Fait), des cartes qu'on drag-and-drop, des etiquettes, des deadlines.

Technologies utilisees : Vue.js 3 avec Composition API, Pinia pour le state, drag-and-drop natif HTML5, localStorage pour la persistence (pas de backend).

Fonctionnalites cles : Boards avec colonnes personnalisables, cartes avec titre/description/deadline/etiquettes, drag-and-drop entre colonnes, filtrage par etiquette, export JSON.

Livrables attendus : SPA qui marche entierement cote client. Donnees persistantes dans le navigateur. Interface responsive.

Calendrier previsionnel : Deux semaines. Le drag-and-drop c'est plus complexe qu'on croit pour le faire bien.

Parties prenantes & criteres de succes : Projet perso pour apprendre Vue.js 3 et sa Composition API. Je l'utilise vraiment pour gerer mes projets perso.

Le Defi

Le drag-and-drop fluide. Avec l'API native ca marche mais c'est pas lisse. Les fantomes sont moches, y'a pas d'animation. Et faut gerer les cas edge (drop au meme endroit, drop en dehors, etc.).

La Solution

J'ai utilise l'API native mais avec un ghost element custom (une copie de la carte stylee). CSS transitions pour les animations quand les cartes se decalent. Et un systeme de "drop zones" qui s'activent visuellement au survol.

Architecture Technique

Points Cles

• Drag-and-drop fluide
• 100% client-side
• Vue 3 Composition API

Apercu

Resultats & Apprentissages

L'app est vraiment utilisable, j'ai abandonne Trello pour ca (pour mes projets simples). Vue 3 avec la Composition API c'est vraiment bien, beaucoup plus flexible que l'Options API. Le drag-and-drop ca m'a appris la patience.

Evolutions Futures

Backend pour sync entre appareils. Collaboration en temps reel avec WebSockets. Sous-taches et checklists. Templates de boards pre-configures.