- Création de docs/app/ pour la documentation de l'application - Création de docs/data/ pour les données utilisées par l'application - Déplacement de la documentation technique vers docs/app/ - Déplacement des données métier vers docs/data/ - Mise à jour de tous les liens et références dans les fichiers - Mise à jour des scripts (extract-technologies.js, analyze-business-metrics.js) - Mise à jour des fichiers JavaScript (custom.js, strategie-link.js) - Création de README.md dans docs/, docs/app/ et docs/data/ - Mise à jour du Readme.md principal avec les nouveaux chemins
5.1 KiB
Configuration
Fichier config.json
Le fichier config.json contient toute la configuration du radar. Il définit l'apparence, le comportement et la structure du radar.
Structure de configuration
Paramètres de base
{
"basePath": "",
"baseUrl": "",
"editUrl": "https://git.open.us.org/syoul/TechradarDev/_edit/main/radar/{release}/{id}.md",
"logoFile": "logo.svg",
"jsFile": "strategie-script.js"
}
- basePath : Chemin de base pour l'application (vide
""pour servir à la racine/) - baseUrl : URL de base du site
- editUrl : Template d'URL pour éditer les fichiers (utilise {release} et {id})
- logoFile : Nom du fichier logo dans
public/ - jsFile : Fichier JavaScript personnalisé à charger (optionnel, utilisé pour le radar business)
Options d'affichage (toggles)
{
"toggles": {
"showChart": true,
"showTagFilter": true,
"showQuadrantList": true,
"showEmptyRings": false
}
}
- showChart : Affiche le graphique radar interactif
- showTagFilter : Active le filtre par tags
- showQuadrantList : Affiche la liste des quadrants
- showEmptyRings : Affiche les anneaux vides
Sections
{
"sections": ["radar", "tags", "list"]
}
Définit l'ordre des sections dans l'interface.
Couleurs
{
"colors": {
"foreground": "#fff",
"background": "#173d7a",
"highlight": "#029df7",
"content": "#fff",
"text": "#575757",
"link": "#029df7",
"border": "rgba(255, 255, 255, 0.1)",
"tag": "rgba(255, 255, 255, 0.1)"
}
}
Personnalisation des couleurs de l'interface.
Quadrants
Les quadrants définissent les quatre catégories principales :
- Languages & Frameworks : Langages et frameworks de développement
- Methods & Patterns : Méthodes et patterns de développement
- Platforms & Operations : Plateformes et opérations
- Tools : Outils de développement
Chaque quadrant a :
- id : Identifiant unique
- title : Titre affiché
- description : Description du quadrant
- color : Couleur associée
Anneaux (Rings)
Les anneaux classifient les technologies selon leur niveau d'adoption :
- Adopt : Recommandé, utilisé avec succès
- Trial : À essayer, prometteur
- Assess : À évaluer, à surveiller
- Hold : À éviter, à remplacer
Chaque anneau a :
- id : Identifiant unique
- title : Titre affiché
- description : Description de l'anneau
- color : Couleur associée
- radius : Rayon dans le graphique (0-1)
- strokeWidth : Épaisseur du trait
Flags (Drapeaux)
Les flags marquent les changements entre versions :
- new : Nouveau dans cette version
- changed : Modifié récemment
- default : Inchangé
Graphique
{
"chart": {
"size": 800,
"blipSize": 12
}
}
- size : Taille du graphique en pixels
- blipSize : Taille des points (blips) sur le graphique
Labels (Textes)
Les labels permettent de personnaliser tous les textes de l'interface, notamment :
- Titre du site
- Textes des pages
- Messages d'erreur
- Placeholders
- Footer
Personnalisation
Modifier les couleurs
Éditez la section colors dans config.json avec les codes hexadécimaux souhaités.
Ajouter un quadrant
Ajoutez un nouvel objet dans le tableau quadrants avec les propriétés requises.
Modifier les descriptions
Les descriptions des quadrants et anneaux peuvent être modifiées directement dans config.json.
Styles personnalisés
Le fichier custom.css permet d'ajouter des styles CSS personnalisés qui seront appliqués à l'application.
Configuration du Radar Technologique Laplank
Le Radar Technologique Laplank utilise une configuration spécifique dans radar-business/config-business.json :
Différences principales
- basePath :
""(vide) pour servir à la racine - jsFile :
"strategie-script.js"pour charger le script de stratégie - Quadrants business : Technologies Différenciantes, Commodité, Risque, Émergentes
- Anneaux classiques : Hold, Assess, Trial, Adopt
- Couleurs : Thème vert (
#1a4d3apour le background,#2ecc71pour les accents)
Script de stratégie
Le fichier public/strategie-script.js est chargé automatiquement et fournit :
- Protection par mot de passe (authentification client-side)
- Pages de stratégie dynamiques (Markdown converti en HTML)
- Navigation dans le header
Variables d'environnement
En Docker, la variable BASE_PATH peut être utilisée pour modifier dynamiquement le basePath dans config.json. Le script docker-entrypoint.sh effectue cette modification au démarrage.
Pour le Radar Technologique Laplank, le basePath est fixé à "" (vide) dans config-business.json pour servir l'application à la racine.
Tags disponibles
Les tags suivants sont établis pour classifier les technologies :
- architecture
- security
- devops
- frontend
- agile
- coding
- quality assurance
- ci/cd
- ux/ui
- documentation
Les tags sont utilisés dans les fichiers Markdown des blips et permettent le filtrage dans l'interface.