Maestro - Application de Gestion de Conservatoire

Application web complète de gestion de conservatoire, développée avec React, TypeScript et Tailwind CSS.

🚀 Démarrage rapide

Prérequis

• Node.js 18+ et npm/yarn/pnpm

Installation

# Installer les dépendances
npm install

# Lancer le serveur de développement
npm run dev

# Build pour la production
npm run build

L'application sera accessible sur http://localhost:5173

📁 Structure du projet

src/
├── app/                    # Configuration app (routing, providers)
├── features/               # Modules métier (architecture features-based)
│   ├── auth/              # Authentification et rôles
│   ├── planning/          # Calendrier et planning
│   ├── students/          # Gestion élèves
│   ├── teachers/          # Gestion professeurs
│   ├── instruments/       # Catalogue instruments
│   ├── documents/         # Gestion documents
│   └── enrollments/       # Inscriptions
├── shared/                # Code partagé
│   ├── components/        # Composants UI réutilisables
│   ├── hooks/             # Hooks personnalisés
│   ├── services/          # Services (API mock, localStorage)
│   ├── utils/             # Utilitaires
│   ├── types/             # Types TypeScript
│   └── constants/         # Constantes (rôles, statuts, etc.)
├── assets/                # Images, fonts, etc.
└── styles/                # Styles globaux Tailwind

🎨 Design System

L'application utilise une palette de couleurs basée sur la charte graphique de la Ville de Gradignan :

• Vert foncé (#2d8659) : Couleur principale
• Jaune/vert clair (#facc15) : Couleur accent
• Gris : Textes secondaires

Voir doc/design-system.md pour plus de détails.

📚 Documentation

Toute la documentation est disponible dans le dossier doc/ :

Guides / architecture

• doc/architecture.md - Architecture de l'application
• doc/design-system.md - Design system et palette de couleurs
• doc/components-library.md - Bibliothèque de composants
• doc/api-structure.md - Organisation de la partie API (si applicable)

Fonctionnalités

• doc/features/documents.md
• doc/features/enrollments.md
• doc/features/instruments.md
• doc/features/planning.md
• doc/features/students.md
• doc/features/teachers.md

Produit

• doc/roadmap.md - Plan de développement
• doc/CHANGELOG.md - Historique des versions

Font Awesome Pro

• doc/fontawesome-pro-7.md - Mise en place Font Awesome Pro
• doc/instruments-icons-reference.md - Référence des icônes

Note sur les tokens

Le fichier /.npmrc peut contenir un authToken (Font Awesome Pro). Il est ignoré par Git. Une configuration locale se fait via /.npmrc (à partir de /.npmrc.example).

🛠️ Technologies

• React 18 avec TypeScript
• Vite : Build tool
• Tailwind CSS : Styling
• Font Awesome : Icônes
• React Router : Navigation
• React Hook Form : Formulaires
• date-fns : Gestion des dates
• Zustand : Gestion d'état
• localStorage : Persistance des données mockées

🔐 Authentification

Pour l'instant, l'authentification est mockée. Les identifiants de démonstration :

• Admin : admin@conservatoire.fr / admin123
• Secrétaire : secretary@conservatoire.fr / secretary123

📝 Fonctionnalités

✅ Modules Implémentés

• Authentification : Connexion, déconnexion, gestion des 6 rôles (Admin, Secrétaire, Directeur, Professeur, Élève, Parent)
• Planning & Calendrier : Vue jour/semaine/mois, navigation, filtres par rôle
• Gestion des Élèves : CRUD complet, recherche, filtres, fiche détaillée
• Gestion des Professeurs : CRUD complet, recherche, filtres, gestion des instruments enseignés
• Catalogue des Instruments : CRUD complet, recherche, filtres, gestion du stock, icônes Font Awesome
• Gestion des Documents : Upload drag & drop, recherche, filtres, gestion des droits, archivage
• Inscriptions & Renouvellements : Wizard multi-étapes, approbation/refus, plan de paiement, échéancier

🎨 Design & UX

• ✅ Design system cohérent (charte Gradignan)
• ✅ Interface 100% responsive (mobile/tablette/desktop)
• ✅ Composants réutilisables (Button, Modal, Badge, Table, Card)
• ✅ Navigation intuitive avec sidebar adaptative
• ✅ Recherche et filtres avancés sur tous les modules

🧪 Tests

# Linter
npm run lint

📦 Build

# Build de production
npm run build

# Prévisualiser le build
npm run preview

🤝 Contribution

Le projet suit une architecture features-based pour faciliter la maintenance et l'extensibilité.

📄 Licence

Propriétaire - Tous droits réservés