Architecture - 1hemmem/vigilant-meme GitHub Wiki

Description des couches

1. Frontend (Vue.js)

• Interface utilisateur réactive
• Gestion de l’état via Vuex
• Consommation de l’API backend

2. Backend (Node.js / Express)

• Exposition d’une API REST
• Routes : /login, /projects, /tasks, /comments
• Gestion de la sécurité (JWT)

3. Base de données (MongoDB)

• Collections : Users, Projects, Tasks, Comments
• Relations :
  • Un utilisateur peut avoir plusieurs projets
  • Un projet contient plusieurs tâches

4. Communication

• Frontend ↔ Backend via HTTP/JSON
• WebSocket pour les notifications (optionnel)

Diagrams du projet

#1 Class Diagram

Définition : Représente les classes du système, leurs attributs, méthodes et relations. Montre la structure globale du projet, les entités principales et leurs interactions.

#2 Sequence Diagram

Définition : Montre le flux d’exécution et l’ordre des interactions entre les acteurs et le système pour différents scénarios (login, création projet, gestion des tâches, commentaires, notifications).

#3 Entity-Relationship Diagram (ERD)

Définition : Représente les entités de la base de données, leurs attributs et relations. Utile pour visualiser la structure de MongoDB (Users, Projects, Tasks, Comments, Notifications…).

#4 Mindmap

Définition : Carte mentale qui résume tous les aspects du projet : architecture, méthodologie agile, fonctionnalités, collaboration, tests et résultats. Permet de visualiser l’organisation globale et la hiérarchie des informations.

#5 Flowchart

Définition : Représente le flux des opérations principales du système, depuis l’ouverture de la plateforme jusqu’à la déconnexion. Montre les étapes et décisions pour créer un projet, gérer les tâches, ajouter des commentaires et recevoir des notifications.