Files
TechradarDev/docs/app/roadmap-code-source.md

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-yaml pour parsing robuste
  • Ajouter validation JSON Schema pour profils membres
  • Créer script validate-data.js pour 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.js utilise MutationObserver pour détecter changements d'URL
  • Solution fonctionnelle mais peut avoir des latences

Actions :

  • Implémenter détection via popstate event (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 numIter pour 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.html et config.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.html
  • public/admin/config.yml
  • public/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.js
  • scripts/import-profiles.js
  • scripts/generate-pdf-report.js

2.3 Analytics et métriques avancées (3 semaines)

Fonctionnalités existantes à étendre :

  • analyze-business-metrics.js existe 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.js
  • public/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.js
  • scripts/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)

  1. 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
  2. scripts/analyze-business-metrics.js

    • Génère rapports stratégiques
    • Dépendance : Format des blips radar-business
  3. 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éploiement
  • Dockerfile.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 :

  1. Robustesse : Validation, tests, gestion d'erreurs
  2. Fonctionnalités : Édition, export/import, analytics
  3. UX : Recherche, filtres, accessibilité
  4. 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