School Climate Monitor

School Climat Monitor est une plateforme web qui litte contre la baisse des éléves en milieu scolaire.

Comment

Inspiration

En faisant des recherches pour le hackathon BluePrint 2026, j’ai découvert que des millions d’élèves en Inde étudient dans des classes sans climatisation, avec des températures dépassant 35°C, un air pollué (AQI > 150) et un bruit constant. Les études montrent une baisse de concentration jusqu’à 30%. Aucun outil simple et gratuit n’existe pour aider les écoles à mesurer ces paramètres. J’ai donc décidé de créer School Climate Monitor.

What I learned

J’ai appris à utiliser :

  • Firebase Auth pour l’inscription et la connexion sécurisées.
  • Firebase Firestore pour stocker les données en temps réel.
  • Chart.js pour afficher des graphiques d’évolution.
  • Tailwind CSS pour une interface responsive et moderne.
  • L’importance des index composites dans Firestore pour les requêtes avec where + orderBy.

J’ai aussi compris comment interviewer des utilisateurs (même à distance) et transformer leurs besoins en fonctionnalités.

How I built it

  • Frontend : HTML5, Tailwind CSS, JavaScript (ES6).
  • Backend (BaaS) : Firebase Authentication + Firestore.
  • Graphiques : Chart.js.
  • Icônes : Font Awesome.
  • Outils : VS Code, Git, GitHub.

L’application permet :

  • Création de compte avec prénom, nom, email et mot de passe.
  • Ajout quotidien de mesures (température, AQI, bruit).
  • Tableau de bord avec moyennes et graphique des 7 derniers jours.
  • Alerte visuelle si la température dépasse 35°C.

Challenges faced

  1. Index Firestore : Firebase ne créé pas automatiquement l’index composite nécessaire pour filtrer par userId et trier par timestamp. J’ai suivi le lien d’erreur généré par la console pour le créer manuellement.
  2. Authentification : L’erreur auth/configuration-not-found est apparue car je n’avais pas activé la méthode "Email/Password" ni ajouté un email de support dans les paramètres Firebase. J’ai corrigé cela en 2 minutes.
  3. Organisation du code : J’ai dû structurer mon JavaScript en modules pour le rendre lisible et maintenable.

Built With

Share this project:

Updates