YOAT Academy
Cabinet Pedetti — Formation
Module 1 · Section 4
Développement Web · 13 leçons · 1 h 27
Section 4 — Développement Web

Fonctions du Dashboard

Capsule 5 min Type pratique Modalité e-learning Niveau intermédiaire
Objectif opérationnel

À l'issue de cette leçon, le stagiaire ajoute les fonctions opérationnelles à son dashboard : filtres, export, rafraîchissement, recherche.

§ 01

Au-delà de la mise en page

Un dashboard sans fonction est un poster. Pour qu'il devienne un outil de pilotage, il faut quatre fonctions de base, à mettre en place dès la première version livrable.

§ 02

Filtres

Trois filtres standard couvrent la plupart des besoins : période (semaine, mois, trimestre, plage personnalisée), segmentation (par client, par catégorie, par équipe), statut (en cours, terminé, annulé).

Les filtres doivent être persistants dans l'URL ou dans l'état applicatif. Si un utilisateur applique un filtre, recharge la page, et que le filtre disparaît, l'expérience est cassée.

§ 03

Export

L'export CSV ou Excel est attendu par défaut. Pour un dashboard B2B, c'est presque obligatoire : les utilisateurs veulent récupérer la donnée pour la retraiter ailleurs (présentation, calcul, archivage).

Demandez à Claude de générer la fonction d'export à partir des données affichées, en respectant les filtres en cours. Une fonction exportToCSV() qui produit un fichier téléchargeable côté navigateur tient en quelques dizaines de lignes.

§ 04

Rafraîchissement et recherche

Rafraîchissement. Un bouton manuel (Refresh) rassure plus qu'un rafraîchissement automatique invisible. Pour les données critiques en temps réel, ajouter en plus un rafraîchissement automatique toutes les 30 secondes ou via les abonnements temps réel de Supabase.

Recherche. Un champ de recherche en haut du tableau, qui filtre les lignes au fur et à mesure de la frappe. Insensible à la casse, sur plusieurs colonnes simultanément. Une fonctionnalité simple à mettre en place qui change radicalement l'utilisabilité.

§ 05

Ajouter les quatre fonctions

Sur le dashboard généré en leçon 33. Comptez trente minutes.

  1. Demander à Claude un sélecteur de période avec les options standard et un mode plage personnalisée. Vérifier que les KPI et graphiques se mettent à jour.

  2. Demander un sélecteur de segmentation pertinent pour vos données. Tester avec deux ou trois valeurs.

  3. Demander une fonction d'export CSV qui inclut les données filtrées en cours. Vérifier que le fichier téléchargé est correct.

  4. Demander un bouton de rafraîchissement manuel et un champ de recherche au-dessus du tableau.

  5. Tester le tout en bout en bout : appliquer un filtre période, segmenter, rechercher dans le tableau, exporter. Le CSV exporté doit refléter exactement ce que vous voyez.

Exercice — production

Une fonction métier additionnelle

Identifiez une cinquième fonction propre à votre métier (assignation à un collaborateur, marquage d'une ligne, génération de PDF, envoi d'e-mail récapitulatif) et faites-la implémenter par Claude. Documentez le résultat.

Sources officielles consultées

Votre dashboard est opérationnel pour un usage quotidien ?