15 KiB
Roadmap basée sur le code source
Date de création : 2025-12-09
Basé sur : Analyse du code source actuel (version 4.3.0)
Vue d'ensemble
Ce document présente la roadmap de développement basée sur l'analyse du code source existant. Les priorités sont établies en fonction des fonctionnalités déjà implémentées, des scripts disponibles, et des opportunités d'amélioration identifiées dans le code.
État actuel du système
Architecture existante
┌─────────────────────────────────────────────────────────────┐
│ APPLICATION STATIQUE │
│ (Next.js export - 100% client-side) │
└─────────────────────────────────────────────────────────────┘
│
┌───────────────┼───────────────┐
▼ ▼ ▼
┌──────────┐ ┌──────────────┐ ┌──────────────┐
│ Radar │ │ Strategie │ │ Team │
│ Tech │ │ (Markdown) │ │ Visualisation│
└──────────┘ └──────────────┘ └──────────────┘
│
┌───────────────┼───────────────┐
▼ ▼ ▼
┌──────────────┐ ┌──────────────┐ ┌──────────────┐
│ Scripts │ │ Docker │ │ Data/JSON │
│ Generation │ │ Deploy │ │ Static │
└──────────────┘ └──────────────┘ └──────────────┘
Fonctionnalités implémentées
✅ Core Application
- Radar technologique : Visualisation interactive des technologies par quadrant/ring
- Pages stratégie : 4 pages markdown intégrées (
strategie,business,dataviz,dataviz-details) - Page équipe : Visualisation des compétences avec 3 vues (graphe réseau, matrice congestion, équipe genèse)
- Cartes de profil membres : Modal cliquable depuis toutes les visualisations
- Authentification simple : Protection par mot de passe (
laplank-radar) pour pages stratégie
✅ Scripts d'automatisation
| Script | Fonction | Status |
|---|---|---|
generate-team-visualization-data.js |
Génère team-visualization-data.json avec profils complets |
✅ Actif |
analyze-business-metrics.js |
Analyse métriques business et génère rapport | ✅ Actif |
extract-technologies.js |
Extrait technologies depuis markdown | ✅ Actif |
verify-blips.js |
Vérifie la cohérence des blips | ✅ Actif |
migrate-rings.sh |
Migration entre versions de rings | ✅ Actif |
patch-navigation.sh |
Ajoute liens navigation | ✅ Actif |
✅ Infrastructure
- Docker Compose : Déploiement containerisé (business + local)
- Build automatisé : Scripts npm pour build/serve
- CI/CD ready : Structure prête pour intégration GitLab/GitHub
Roadmap par priorité
🔴 Priorité 1 : Consolidation & Robustesse (Court terme - 1-3 mois)
1.1 Améliorer la gestion des données (2 semaines)
Problèmes identifiés dans le code :
- Parsing YAML manuel fragile dans
generate-team-visualization-data.js - Pas de validation des schémas de données
- Extraction de compétences basée sur regex (peut échouer)
Actions :
// TODO: Remplacer parsing YAML manuel par librairie
// Fichier: scripts/generate-team-visualization-data.js
// Ligne ~12-16: extractYaml() fonction basique
- Intégrer
js-yamlpour parsing robuste - Ajouter validation JSON Schema pour profils membres
- Créer script
validate-data.jspour vérifier cohérence avant build - Tests unitaires pour fonctions d'extraction
Impact : Réduit les erreurs de build, améliore la maintenabilité
1.2 Améliorer la détection navigation SPA (1 semaine)
État actuel :
team-block-script.jsutiliseMutationObserverpour détecter changements d'URL- Solution fonctionnelle mais peut avoir des latences
Actions :
- Implémenter détection via
popstateevent (plus fiable) - Ajouter debounce pour éviter multiples initialisations
- Tester navigation Next.js sur différentes versions
Fichiers concernés :
public/team-block-script.js(lignes 342-350)
1.3 Optimiser les performances des visualisations (2 semaines)
Problèmes identifiés :
- Graphe Cytoscape peut ralentir avec 50+ nœuds
- Pas de lazy loading des données
- Pas de cache côté client
Actions :
- Implémenter pagination/filtrage pour graphe réseau
- Ajouter cache localStorage pour
team-visualization-data.json - Optimiser layout Cytoscape (réduire
numIterpour perf) - Code splitting pour bibliothèques externes (Cytoscape, ECharts)
Fichiers concernés :
public/team-block-script.js(initNetwork, initCongestion)scripts/generate-team-visualization-data.js
🟠 Priorité 2 : Fonctionnalités métier (Moyen terme - 3-6 mois)
2.1 Edition via NetlifyCMS + Gitea (1 mois)
Plan détaillé disponible : docs/app/plan-edition-cms.md
Actions :
- Créer
public/admin/index.htmletconfig.yml - Configurer OAuth Gitea
- Ajouter bouton "Éditer" dans cartes de profil
- Intégrer régénération dans CI/CD
- Gérer CORS si nécessaire (proxy OAuth)
Fichiers à créer/modifier :
public/admin/index.htmlpublic/admin/config.ymlpublic/team-block-script.js(ajout lien édition).gitlab-ci.yml(étape régénération)
2.2 Export/Import de données (2 semaines)
Opportunité identifiée :
- Scripts d'extraction existants mais pas d'export structuré
- Pas de format d'échange standard
Actions :
- Créer script
export-team-data.js(CSV/JSON/Excel) - Ajouter import depuis CSV pour profils membres
- Générer rapports PDF automatiques
- API REST simple pour export (si besoin backend)
Scripts à créer :
scripts/export-team-data.jsscripts/import-profiles.jsscripts/generate-pdf-report.js
2.3 Analytics et métriques avancées (3 semaines)
Fonctionnalités existantes à étendre :
analyze-business-metrics.jsexiste mais limité- Pas de visualisation des métriques dans l'UI
Actions :
- Ajouter dashboard de métriques dans page équipe
- Graphiques d'évolution temporelle (si historique disponible)
- Alertes automatiques sur gaps critiques
- Export des métriques en format standardisé
Fichiers à créer/modifier :
scripts/generate-metrics-dashboard.jspublic/team-block-script.js(nouveau onglet métriques)scripts/analyze-business-metrics.js(enrichir)
🟡 Priorité 3 : Expérience utilisateur (Moyen terme - 6-9 mois)
3.1 Recherche et filtrage avancés (2 semaines)
Fonctionnalité manquante identifiée :
- Pas de recherche dans les profils membres
- Pas de filtrage dans les visualisations
Actions :
- Ajouter barre de recherche dans page équipe
- Filtres par compétence, disponibilité, séniorité
- Recherche full-text dans descriptions
- Sauvegarder filtres dans URL (partageable)
Fichiers à modifier :
public/team-block-script.jsscripts/generate-team-visualization-data.js(index de recherche)
3.2 Responsive design et accessibilité (3 semaines)
Problèmes identifiés :
- Visualisations Cytoscape/ECharts peuvent être difficiles sur mobile
- Pas de support clavier pour navigation
- Couleurs peuvent poser problème (daltonisme)
Actions :
- Adapter layouts pour petits écrans
- Ajouter navigation clavier (Tab, Enter, Escape)
- Palette de couleurs accessible (WCAG AA)
- Mode sombre/clair
- Support lecteur d'écran (ARIA labels)
Fichiers concernés :
public/team-block-script.js(CSS et interactions)custom.css
3.3 Notifications et alertes temps réel (4 semaines)
Opportunité :
- Détecter automatiquement les changements critiques
- Alerter sur gaps de compétences
Actions :
- Système de webhooks pour changements Git
- Notifications push (si service worker)
- Dashboard d'alertes
- Email automatique sur seuils critiques
🟢 Priorité 4 : Innovation et différenciation (Long terme - 9-12 mois)
4.1 IA pour recommandations d'équipe (2 mois)
Opportunité identifiée dans stratégie :
- Section "Knowledge Management + Private AI" dans stratégie
- Graph RAG mentionné dans
strategie-script.js
Actions :
- Analyser profils avec LLM local (Mistral, Llama)
- Recommandations automatiques pour équipe genèse
- Détection de patterns dans compétences
- Prédiction de gaps futurs
Prérequis :
- Infrastructure ThreeFold pour IA privée
- Modèles LLM open source
4.2 Visualisation avancée : Web of Trust (3 mois)
Mentionné dans stratégie :
- Cytoscape.js déjà intégré
- Web of Trust visualisé dans roadmap
Actions :
- Intégrer données Duniter/Ğ1 (si API disponible)
- Graphe de confiance interactif
- Analyse de clusters
- Export pour analyses externes
4.3 API REST complète (2 mois)
Évolution naturelle :
- Passer d'app statique à hybride
- Exposer données via API
Actions :
- Backend Node.js/Express ou Rust
- Endpoints REST pour données radar/équipe
- GraphQL optionnel
- Documentation OpenAPI/Swagger
- Rate limiting et authentification
Architecture proposée :
Frontend (Next.js) ←→ API REST ←→ Base de données
↓
Scripts generation
Dépendances techniques
Bibliothèques externes actuelles
| Bibliothèque | Usage | Version | Maintenance |
|---|---|---|---|
| Cytoscape.js | Graphe réseau équipe | 3.26.0 (CDN) | ✅ Active |
| ECharts | Matrice congestion | 5.4.3 (CDN) | ✅ Active |
| Next.js | Framework principal | 14.2.4 | ✅ Active |
| aoe_technology_radar | Base du radar | 4.4.0 | ✅ Active |
Opportunités de migration
- Cytoscape : Considérer migration vers version locale (npm) pour meilleur contrôle
- ECharts : Déjà bien intégré, pas de migration nécessaire
- Next.js : Évaluer migration vers App Router (v13+) pour meilleures perfs
Métriques et KPIs techniques
Métriques à suivre (basées sur code actuel)
| Métrique | Cible | Mesure actuelle |
|---|---|---|
| Temps de build | < 2 min | ~35-40s (OK) |
| Taille bundle JS | < 200 KB | ~100 KB (OK) |
| Temps chargement page team | < 2s | ~1-2s (OK) |
| Couverture tests | > 80% | 0% (⚠️ À ajouter) |
| Nombre de scripts | 9 | 9 scripts (OK) |
Actions pour améliorer métriques
- Ajouter tests unitaires (Jest/Vitest)
- Tests E2E pour visualisations (Playwright)
- Monitoring performances (Web Vitals)
- Analyse de bundle (webpack-bundle-analyzer)
Fichiers critiques à maintenir
Scripts de génération (priorité haute)
-
scripts/generate-team-visualization-data.js- Génère toutes les données de visualisation
- Dépendance : Structure YAML des profils
- Risque : Changements de format cassent la génération
-
scripts/analyze-business-metrics.js- Génère rapports stratégiques
- Dépendance : Format des blips radar-business
-
public/team-block-script.js- Logique principale page équipe
- Complexité élevée (500+ lignes)
- Risque : Bugs navigation SPA
Scripts d'infrastructure
docker-compose.business.yml: Configuration déploiementDockerfile.business: Build containerisé.gitlab-ci.yml: CI/CD (si configuré)
Points d'attention identifiés dans le code
1. Parsing YAML manuel (risque élevé)
Fichier : scripts/generate-team-visualization-data.js
Lignes : 12-96
Problème : Regex fragiles, peuvent échouer sur formats non standards
Solution recommandée : Intégrer js-yaml ou gray-matter (déjà en dépendance)
2. Protection mot de passe en clair
Fichier : public/strategie-script.js
Ligne : 101
Problème : Mot de passe hardcodé dans code client
Solution recommandée : Hash côté serveur ou authentification OAuth
3. Gestion navigation SPA complexe
Fichier : public/team-block-script.js
Lignes : 342-350
Problème : MutationObserver peut avoir des latences
Solution recommandée : Utiliser router Next.js ou événements natifs plus fiables
4. Pas de gestion d'erreurs robuste
Fichiers : Tous les scripts
Problème : Try/catch basiques, pas de logging structuré
Solution recommandée : Intégrer logger (Winston, Pino) et gestion d'erreurs centralisée
Évolution architecture proposée
Étape 1 : Amélioration progressive (0-6 mois)
Application Statique
↓
+ Validation données
+ Tests automatiques
+ Monitoring
Étape 2 : Hybridation (6-12 mois)
Application Statique
↓
+ API REST simple (Node.js)
+ NetlifyCMS pour édition
+ Webhooks CI/CD
Étape 3 : Plateforme complète (12+ mois)
Frontend (Next.js)
↓
API Gateway (Rust/Node)
↓
Services: Data | Analytics | IA
↓
ThreeFold Infrastructure
Plan d'action immédiat (prochaines 4 semaines)
Semaine 1-2 : Consolidation
- Migrer parsing YAML vers librairie
- Ajouter validation JSON Schema
- Créer script de tests basiques
Semaine 3-4 : Amélioration UX
- Recherche dans profils
- Filtres dans visualisations
- Optimisation performances
Estimation des efforts
| Priorité | Épics | Effort estimé | Complexité |
|---|---|---|---|
| P1 | Consolidation | 4-6 semaines | Moyenne |
| P2 | Fonctionnalités métier | 8-12 semaines | Élevée |
| P3 | UX/UI | 6-9 semaines | Moyenne |
| P4 | Innovation | 12-16 semaines | Très élevée |
Total estimé : 30-43 semaines (~7-10 mois de développement)
Conclusion
La roadmap est basée sur l'analyse du code source existant et identifie des améliorations réalistes et prioritaires. Les fonctionnalités core sont solides, mais il existe des opportunités d'amélioration significatives dans :
- Robustesse : Validation, tests, gestion d'erreurs
- Fonctionnalités : Édition, export/import, analytics
- UX : Recherche, filtres, accessibilité
- Innovation : IA, visualisations avancées, API
L'architecture actuelle permet une évolution progressive sans refonte majeure.
Document généré le 2025-12-09
Prochaine révision recommandée : Après implémentation P1