docs: mise à jour documentation page Équipe
- Architecture hybride Next.js + HTML statique via iframe - Lien intégré directement dans Navigation React - Script create-team-page.sh pour automatisation - Section dépannage améliorée - Fichiers associés détaillés
This commit is contained in:
@@ -2,13 +2,23 @@
|
|||||||
|
|
||||||
## Introduction
|
## Introduction
|
||||||
|
|
||||||
La page **Équipe & Technologies** (`/team.html`) est une interface de visualisation interactive qui permet d'analyser les compétences de l'équipe, d'identifier les congestions (technologies avec peu de personnes) et de composer une équipe de genèse pour un MVP.
|
La page **Équipe & Technologies** (`/team`) est une interface de visualisation interactive qui permet d'analyser les compétences de l'équipe, d'identifier les congestions (technologies avec peu de personnes) et de composer une équipe de genèse pour un MVP.
|
||||||
|
|
||||||
Cette page est accessible depuis le radar via le lien **"👥 Équipe"** dans le header de navigation.
|
Cette page est accessible depuis le radar via le lien **"👥 Équipe"** dans le header de navigation.
|
||||||
|
|
||||||
|
## Architecture Technique
|
||||||
|
|
||||||
|
La page utilise une architecture hybride :
|
||||||
|
- **Page Next.js** : `/team` (route Next.js générée automatiquement)
|
||||||
|
- **Contenu HTML** : Chargé via iframe depuis `/team.html` (fichier statique)
|
||||||
|
- **Navigation** : Lien intégré directement dans le composant React `Navigation.tsx`
|
||||||
|
|
||||||
|
Cette approche combine les avantages de Next.js (routing, intégration native) avec la flexibilité d'un HTML statique autonome.
|
||||||
|
|
||||||
## Accès
|
## Accès
|
||||||
|
|
||||||
- **URL** : `/team.html`
|
- **URL** : `/team` (route Next.js)
|
||||||
|
- **Fichier HTML source** : `/team.html` (servi statiquement)
|
||||||
- **Lien de navigation** : Disponible dans le header du radar (bouton "👥 Équipe")
|
- **Lien de navigation** : Disponible dans le header du radar (bouton "👥 Équipe")
|
||||||
- **Authentification** : Même protection que le radar (mot de passe `laplank-radar`)
|
- **Authentification** : Même protection que le radar (mot de passe `laplank-radar`)
|
||||||
|
|
||||||
@@ -150,15 +160,31 @@ node scripts/generate-team-visualization-data.js
|
|||||||
|
|
||||||
### Intégration dans le Build
|
### Intégration dans le Build
|
||||||
|
|
||||||
Pour automatiser la génération lors du build, vous pouvez ajouter dans `package.json` :
|
La page est automatiquement créée lors du build Docker via le script `scripts/create-team-page.sh` :
|
||||||
|
|
||||||
```json
|
1. **Création de la page Next.js** : Génère `.techradar/src/pages/team.tsx`
|
||||||
{
|
2. **Modification de Navigation** : Ajoute le lien "👥 Équipe" dans `.techradar/src/components/Navigation/Navigation.tsx`
|
||||||
"scripts": {
|
3. **Copie des fichiers** : Assure que `team.html` et `team-visualization-data.json` sont copiés dans `out/`
|
||||||
"generate-team-data": "node scripts/generate-team-visualization-data.js",
|
|
||||||
"build": "npm run generate-team-data && npm run build:data"
|
Le script est exécuté automatiquement dans `Dockerfile.business` avant le build Next.js.
|
||||||
}
|
|
||||||
}
|
**Pour régénérer les données de visualisation** :
|
||||||
|
|
||||||
|
```bash
|
||||||
|
node scripts/generate-team-visualization-data.js
|
||||||
|
```
|
||||||
|
|
||||||
|
**Pour tester localement** :
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Générer les données
|
||||||
|
node scripts/generate-team-visualization-data.js
|
||||||
|
|
||||||
|
# Créer la page Next.js et modifier Navigation
|
||||||
|
./scripts/create-team-page.sh
|
||||||
|
|
||||||
|
# Démarrer le serveur
|
||||||
|
npm run serve-business
|
||||||
```
|
```
|
||||||
|
|
||||||
## Technologies Utilisées
|
## Technologies Utilisées
|
||||||
@@ -171,9 +197,10 @@ Pour automatiser la génération lors du build, vous pouvez ajouter dans `packag
|
|||||||
|
|
||||||
### Chargement
|
### Chargement
|
||||||
|
|
||||||
Les bibliothèques sont chargées via CDN dans la page HTML :
|
Les bibliothèques sont chargées via CDN dans la page HTML (`public/team.html`) :
|
||||||
- Pas besoin d'installation locale
|
- Pas besoin d'installation locale
|
||||||
- Mise à jour possible en modifiant les URLs dans `public/team.html`
|
- Mise à jour possible en modifiant les URLs dans `public/team.html`
|
||||||
|
- Les bibliothèques sont chargées dans l'iframe, isolées du reste de l'application
|
||||||
|
|
||||||
## Personnalisation
|
## Personnalisation
|
||||||
|
|
||||||
@@ -256,19 +283,58 @@ Pour ajouter une nouvelle visualisation :
|
|||||||
- Suggestions de formation basées sur les gaps
|
- Suggestions de formation basées sur les gaps
|
||||||
- Intégration avec un système de planning (Gantt)
|
- Intégration avec un système de planning (Gantt)
|
||||||
|
|
||||||
## Support
|
## Dépannage
|
||||||
|
|
||||||
|
### Le lien "👥 Équipe" n'apparaît pas dans le header
|
||||||
|
|
||||||
|
1. Vérifier que le script `create-team-page.sh` s'est exécuté correctement
|
||||||
|
2. Vérifier dans les logs Docker que le script a bien modifié `Navigation.tsx`
|
||||||
|
3. Vérifier que le fichier `.techradar/src/components/Navigation/Navigation.tsx` contient le lien
|
||||||
|
|
||||||
|
### La page `/team` retourne une 404
|
||||||
|
|
||||||
|
1. Vérifier que `team.html` est bien copié dans `out/` après le build
|
||||||
|
2. Vérifier les logs du Dockerfile pour voir si la copie a réussi
|
||||||
|
3. Vérifier que `scripts/start-business.sh` copie bien les fichiers au démarrage
|
||||||
|
4. Vérifier que la page Next.js `team.tsx` a bien été créée dans `.techradar/src/pages/`
|
||||||
|
|
||||||
|
### Les visualisations ne se chargent pas
|
||||||
|
|
||||||
|
1. Vérifier que `team-visualization-data.json` est accessible à `/team-visualization-data.json`
|
||||||
|
2. Vérifier la console du navigateur pour les erreurs de chargement
|
||||||
|
3. Régénérer les données avec `node scripts/generate-team-visualization-data.js`
|
||||||
|
4. Vérifier que les fichiers Markdown des profils sont bien formatés
|
||||||
|
|
||||||
|
### Support
|
||||||
|
|
||||||
Pour toute question ou problème :
|
Pour toute question ou problème :
|
||||||
- Consulter les logs du script de génération
|
- Consulter les logs du script de génération
|
||||||
- Vérifier que les fichiers Markdown sont bien formatés
|
- Vérifier que les fichiers Markdown sont bien formatés
|
||||||
- Vérifier que le fichier JSON est bien généré et accessible
|
- Vérifier que le fichier JSON est bien généré et accessible
|
||||||
|
- Consulter les logs Docker pour voir l'exécution de `create-team-page.sh`
|
||||||
|
|
||||||
## Fichiers Associés
|
## Fichiers Associés
|
||||||
|
|
||||||
- **Script de génération** : `scripts/generate-team-visualization-data.js`
|
### Fichiers Source
|
||||||
- **Page HTML** : `public/team.html`
|
- **Page HTML** : `public/team.html` (contenu principal avec visualisations)
|
||||||
- **Données JSON** : `public/team-visualization-data.json`
|
- **Données JSON** : `public/team-visualization-data.json` (données générées)
|
||||||
- **Profils équipe** : `docs/data/team/*.md`
|
- **Profils équipe** : `docs/data/team/*.md` (fichiers Markdown avec métadonnées YAML)
|
||||||
- **Technologies** : `radar-business/2025-01-15/*.md`
|
- **Technologies** : `radar-business/2025-01-15/*.md` (fichiers Markdown du radar)
|
||||||
- **Navigation** : `public/strategie-script.js` (fonction `addLinksToHeader()`)
|
|
||||||
|
### Scripts
|
||||||
|
- **Génération des données** : `scripts/generate-team-visualization-data.js`
|
||||||
|
- Charge les technologies et membres
|
||||||
|
- Génère le fichier JSON pour les visualisations
|
||||||
|
- **Création de la page Next.js** : `scripts/create-team-page.sh`
|
||||||
|
- Crée `.techradar/src/pages/team.tsx` (page Next.js avec iframe)
|
||||||
|
- Modifie `.techradar/src/components/Navigation/Navigation.tsx` (ajoute le lien)
|
||||||
|
|
||||||
|
### Fichiers Générés (pendant le build)
|
||||||
|
- **Page Next.js** : `.techradar/src/pages/team.tsx` (générée par le script)
|
||||||
|
- **Navigation modifiée** : `.techradar/src/components/Navigation/Navigation.tsx` (modifiée par le script)
|
||||||
|
- **Fichiers dans out/** : `out/team.html` et `out/team-visualization-data.json` (copiés après build)
|
||||||
|
|
||||||
|
### Configuration
|
||||||
|
- **Dockerfile** : `Dockerfile.business` (exécute `create-team-page.sh` avant le build)
|
||||||
|
- **Script de démarrage** : `scripts/start-business.sh` (vérifie et copie les fichiers au démarrage)
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user