456 lines
12 KiB
Markdown
456 lines
12 KiB
Markdown
# Gestion des Formations Manager Itinova
|
|
|
|
Application web complète de gestion des formations pour Manager Itinova, permettant la planification, l'organisation et le suivi des formations avec gestion automatisée des inscriptions, rappels et communications.
|
|
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
## 📋 Table des matières
|
|
|
|
- [Aperçu](#aperçu)
|
|
- [Fonctionnalités](#fonctionnalités)
|
|
- [Technologies](#technologies)
|
|
- [Installation rapide](#installation-rapide)
|
|
- [Documentation](#documentation)
|
|
- [Architecture](#architecture)
|
|
- [Utilisation](#utilisation)
|
|
- [Déploiement](#déploiement)
|
|
- [Maintenance](#maintenance)
|
|
- [Support](#support)
|
|
|
|
---
|
|
|
|
## 🎯 Aperçu
|
|
|
|
L'application **Gestion des Formations Manager Itinova** est une solution complète pour gérer l'ensemble du cycle de vie des formations :
|
|
|
|
- Création et planification des formations et séquences
|
|
- Gestion des apprenants et inscriptions avec validation automatique
|
|
- Génération automatique de documents (listes, feuilles de présence)
|
|
- Envoi automatique d'emails (confirmations, rappels)
|
|
- Calendrier interactif et système de rappels
|
|
- Rapports et statistiques détaillés
|
|
|
|
L'application offre **deux modes d'authentification** :
|
|
- **Connexion Manus OAuth** : pour les utilisateurs avec compte Manus (Google, Microsoft, Apple)
|
|
- **Connexion locale** : pour les administrateurs avec identifiant et mot de passe
|
|
|
|
---
|
|
|
|
## ✨ Fonctionnalités
|
|
|
|
### 🔐 Authentification dual
|
|
|
|
- Page de choix de connexion
|
|
- Authentification Manus OAuth (Google, Microsoft, Apple)
|
|
- Authentification locale par identifiant/mot de passe
|
|
- Gestion des rôles (admin, user)
|
|
- Utilisateur administrateur permanent non supprimable
|
|
|
|
### 📚 Gestion des formations
|
|
|
|
- CRUD complet des formations
|
|
- Support de multiples séquences par formation
|
|
- Jusqu'à 4 dates par séquence
|
|
- Champs personnalisés :
|
|
- Public cible (Directeurs, Chefs de service, Autre, Tous)
|
|
- Formateur avec autocomplétion
|
|
- Capacité maximale par séquence
|
|
- Lieu de formation
|
|
- Barre de progression colorée (vert/orange/rouge) selon le taux de remplissage
|
|
- Filtres et recherche avancée
|
|
|
|
### 👥 Gestion des apprenants
|
|
|
|
- CRUD complet des apprenants
|
|
- Fonction (Directeur, Chef de service, Autre)
|
|
- Page de détail par apprenant avec historique complet
|
|
- Système d'inscription avec :
|
|
- Validation de capacité automatique
|
|
- Détection anti-doublons
|
|
- Blocage automatique à J-15
|
|
- Alerte si public cible incompatible
|
|
|
|
### 📅 Calendrier et rappels
|
|
|
|
- Calendrier mensuel interactif
|
|
- Navigation par mois
|
|
- Visualisation des séquences par date
|
|
- Système de rappels automatiques configurables :
|
|
- Rappel J-7
|
|
- Rappel J-3
|
|
- Rappel J-1
|
|
- Rappel personnalisé
|
|
|
|
### 📄 Exports et documents
|
|
|
|
- **Export Excel** : listes d'inscrits avec toutes les informations
|
|
- **Export PDF** : listes d'inscrits formatées
|
|
- **Feuilles de présence PDF** :
|
|
- Logo Itinova
|
|
- Double signature (matin/après-midi)
|
|
- Signature formateur
|
|
- Informations complètes de la séquence
|
|
|
|
### ✉️ Communications automatiques
|
|
|
|
- **Génération d'invitations Outlook** (.ics)
|
|
- **Emails automatiques** :
|
|
- Email de confirmation d'inscription
|
|
- Email teaser (présentation de la formation)
|
|
- Email de rappel J-7
|
|
- **Templates personnalisables** avec variables dynamiques
|
|
- **Configuration SMTP** avec Resend
|
|
- Mode test et production
|
|
|
|
### 📊 Rapports et statistiques
|
|
|
|
- Tableau de bord avec indicateurs clés
|
|
- Répartition des apprenants par fonction
|
|
- Analyse public cible vs fonction réelle
|
|
- Statistiques de remplissage des séquences
|
|
- Historique des inscriptions
|
|
|
|
### 👤 Administration
|
|
|
|
- Gestion des utilisateurs
|
|
- Création, modification, activation/désactivation
|
|
- Attribution des rôles
|
|
- Utilisateur admin permanent (adminServFormation)
|
|
- Templates d'emails personnalisables
|
|
- Configuration SMTP centralisée
|
|
|
|
---
|
|
|
|
## 🛠 Technologies
|
|
|
|
### Frontend
|
|
|
|
- **React 19** : bibliothèque UI moderne
|
|
- **Tailwind CSS 4** : framework CSS utility-first
|
|
- **shadcn/ui** : composants UI accessibles
|
|
- **Wouter** : routage léger
|
|
- **TanStack Query** : gestion des données asynchrones
|
|
- **Recharts** : visualisation de données
|
|
- **date-fns** : manipulation de dates
|
|
|
|
### Backend
|
|
|
|
- **Node.js 22** : runtime JavaScript
|
|
- **Express 4** : framework web
|
|
- **tRPC 11** : API type-safe end-to-end
|
|
- **Drizzle ORM** : ORM TypeScript-first
|
|
- **MySQL/TiDB** : base de données relationnelle
|
|
|
|
### Outils
|
|
|
|
- **TypeScript** : typage statique
|
|
- **Vite** : build tool rapide
|
|
- **pnpm** : gestionnaire de paquets performant
|
|
- **Vitest** : framework de tests
|
|
|
|
### Services externes
|
|
|
|
- **Resend** : envoi d'emails transactionnels
|
|
- **Manus OAuth** : authentification sociale
|
|
|
|
---
|
|
|
|
## 🚀 Installation rapide
|
|
|
|
### Prérequis
|
|
|
|
- Node.js 22+
|
|
- MySQL 8.0+ ou MariaDB 10.6+
|
|
- pnpm (installé automatiquement avec Node.js)
|
|
|
|
### Installation en 4 étapes
|
|
|
|
```bash
|
|
# 1. Installer les dépendances
|
|
pnpm install
|
|
|
|
# 2. Configurer les variables d'environnement
|
|
cp .env.example .env
|
|
# Éditer .env avec vos paramètres
|
|
|
|
# 3. Créer et initialiser la base de données
|
|
mysql -u root -p -e "CREATE DATABASE formation_manager CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;"
|
|
pnpm db:push
|
|
|
|
# 4. Démarrer l'application
|
|
pnpm dev
|
|
```
|
|
|
|
L'application sera accessible à **http://localhost:3000**
|
|
|
|
### Connexion initiale
|
|
|
|
- **Identifiant** : `adminServFormation`
|
|
- **Mot de passe** : `Itinova69!`
|
|
|
|
📖 **Guide complet** : voir [INSTALL.md](INSTALL.md)
|
|
|
|
---
|
|
|
|
## 📚 Documentation
|
|
|
|
- **[INSTALL.md](INSTALL.md)** : Guide d'installation rapide (5 minutes)
|
|
- **[DEPLOYMENT.md](DEPLOYMENT.md)** : Guide de déploiement complet
|
|
- **[deploy.sh](deploy.sh)** : Script de déploiement automatique
|
|
|
|
---
|
|
|
|
## 🏗 Architecture
|
|
|
|
### Structure du projet
|
|
|
|
```
|
|
formation-manager-itinova/
|
|
├── client/ # Application frontend
|
|
│ ├── public/ # Fichiers statiques
|
|
│ │ └── logo.svg # Logo de l'application
|
|
│ └── src/
|
|
│ ├── pages/ # Pages de l'application
|
|
│ │ ├── LoginChoice.tsx
|
|
│ │ ├── Login.tsx
|
|
│ │ ├── Dashboard.tsx
|
|
│ │ ├── Formations.tsx
|
|
│ │ ├── Sequences.tsx
|
|
│ │ ├── Apprenants.tsx
|
|
│ │ └── ...
|
|
│ ├── components/ # Composants réutilisables
|
|
│ │ ├── DashboardLayout.tsx
|
|
│ │ └── ui/ # Composants shadcn/ui
|
|
│ └── lib/ # Bibliothèques et utilitaires
|
|
│ └── trpc.ts # Client tRPC
|
|
├── server/ # Application backend
|
|
│ ├── routers.ts # Routes API tRPC
|
|
│ ├── db.ts # Fonctions d'accès BDD
|
|
│ └── _core/ # Configuration serveur
|
|
│ ├── index.ts # Point d'entrée
|
|
│ ├── trpc.ts # Configuration tRPC
|
|
│ ├── localAuth.ts # Authentification locale
|
|
│ └── ...
|
|
├── drizzle/ # Base de données
|
|
│ └── schema.ts # Schéma des tables
|
|
├── shared/ # Code partagé
|
|
│ └── const.ts # Constantes
|
|
├── .env # Variables d'environnement
|
|
├── package.json # Dépendances
|
|
├── deploy.sh # Script de déploiement
|
|
├── DEPLOYMENT.md # Guide de déploiement
|
|
├── INSTALL.md # Guide d'installation
|
|
└── README.md # Ce fichier
|
|
```
|
|
|
|
### Base de données
|
|
|
|
**Tables principales** :
|
|
|
|
- `users` : utilisateurs de l'application
|
|
- `formations` : formations disponibles
|
|
- `sequences` : séquences de formation (dates)
|
|
- `apprenants` : apprenants inscrits
|
|
- `inscriptions` : inscriptions aux séquences
|
|
- `rappels` : rappels configurés
|
|
- `email_templates` : templates d'emails
|
|
- `email_config` : configuration SMTP
|
|
|
|
### API (tRPC)
|
|
|
|
L'API utilise tRPC pour une communication type-safe entre le client et le serveur.
|
|
|
|
**Routers principaux** :
|
|
|
|
- `auth` : authentification (me, logout)
|
|
- `formations` : CRUD formations
|
|
- `sequences` : CRUD séquences
|
|
- `apprenants` : CRUD apprenants
|
|
- `inscriptions` : gestion des inscriptions
|
|
- `rappels` : gestion des rappels
|
|
- `emails` : envoi d'emails et gestion des templates
|
|
- `users` : gestion des utilisateurs
|
|
- `stats` : statistiques et rapports
|
|
|
|
---
|
|
|
|
## 💻 Utilisation
|
|
|
|
### Commandes disponibles
|
|
|
|
```bash
|
|
# Développement
|
|
pnpm dev # Démarrer le serveur de développement
|
|
pnpm build # Builder pour la production
|
|
pnpm start # Démarrer en mode production
|
|
|
|
# Base de données
|
|
pnpm db:push # Appliquer les migrations
|
|
pnpm db:generate # Générer les migrations
|
|
pnpm db:studio # Ouvrir Drizzle Studio
|
|
|
|
# Tests
|
|
pnpm test # Lancer les tests
|
|
pnpm test:ui # Interface de tests Vitest
|
|
|
|
# Linting
|
|
pnpm lint # Vérifier le code
|
|
pnpm format # Formater le code
|
|
```
|
|
|
|
### Workflow typique
|
|
|
|
1. **Créer une formation**
|
|
- Menu "Formations" → "Nouvelle formation"
|
|
- Remplir les informations
|
|
- Sauvegarder
|
|
|
|
2. **Créer des séquences**
|
|
- Cliquer sur la formation
|
|
- "Ajouter une séquence"
|
|
- Définir les dates (jusqu'à 4)
|
|
- Définir la capacité maximale
|
|
|
|
3. **Ajouter des apprenants**
|
|
- Menu "Apprenants" → "Ajouter un apprenant"
|
|
- Remplir nom, prénom, email, fonction
|
|
|
|
4. **Gérer les inscriptions**
|
|
- Depuis la page de la séquence
|
|
- Ou depuis la page de l'apprenant
|
|
- Validation automatique de la capacité
|
|
|
|
5. **Configurer les rappels**
|
|
- Menu "Rappels"
|
|
- Activer les rappels souhaités (J-7, J-3, J-1)
|
|
- Les emails seront envoyés automatiquement
|
|
|
|
6. **Exporter les documents**
|
|
- Liste des inscrits (Excel ou PDF)
|
|
- Feuille de présence (PDF)
|
|
- Invitation Outlook (.ics)
|
|
|
|
---
|
|
|
|
## 🌐 Déploiement
|
|
|
|
### Option 1 : Plateforme Manus (recommandé)
|
|
|
|
L'application est optimisée pour la plateforme Manus :
|
|
|
|
1. Créer un checkpoint
|
|
2. Cliquer sur "Publish"
|
|
3. Configurer le domaine
|
|
4. Publier
|
|
|
|
**Avantages** : déploiement automatique, SSL, scaling, base de données incluse.
|
|
|
|
### Option 2 : Serveur VPS
|
|
|
|
Utiliser le script de déploiement automatique :
|
|
|
|
```bash
|
|
# Rendre le script exécutable
|
|
chmod +x deploy.sh
|
|
|
|
# Lancer le déploiement
|
|
./deploy.sh
|
|
```
|
|
|
|
Le script effectue automatiquement :
|
|
- Vérification des prérequis
|
|
- Installation des dépendances
|
|
- Sauvegarde de la base de données
|
|
- Application des migrations
|
|
- Build de l'application
|
|
- Redémarrage du service
|
|
|
|
📖 **Guide complet** : voir [DEPLOYMENT.md](DEPLOYMENT.md)
|
|
|
|
---
|
|
|
|
## 🔧 Maintenance
|
|
|
|
### Sauvegardes automatiques
|
|
|
|
Le script de déploiement crée automatiquement des sauvegardes de la base de données.
|
|
|
|
Pour configurer des sauvegardes régulières :
|
|
|
|
```bash
|
|
# Ajouter une tâche cron
|
|
crontab -e
|
|
|
|
# Sauvegarde quotidienne à 2h du matin
|
|
0 2 * * * /chemin/vers/backup.sh
|
|
```
|
|
|
|
### Mise à jour
|
|
|
|
```bash
|
|
# Récupérer les dernières modifications
|
|
git pull origin main
|
|
|
|
# Lancer le déploiement
|
|
./deploy.sh
|
|
```
|
|
|
|
### Logs
|
|
|
|
```bash
|
|
# Logs de l'application (systemd)
|
|
sudo journalctl -u formation-manager -f
|
|
|
|
# Logs Nginx
|
|
sudo tail -f /var/log/nginx/access.log
|
|
sudo tail -f /var/log/nginx/error.log
|
|
```
|
|
|
|
---
|
|
|
|
## 📞 Support
|
|
|
|
### Documentation
|
|
|
|
- [Guide d'installation](INSTALL.md)
|
|
- [Guide de déploiement](DEPLOYMENT.md)
|
|
- Code source commenté
|
|
|
|
### Dépannage
|
|
|
|
Consultez la section "Dépannage" dans [DEPLOYMENT.md](DEPLOYMENT.md) pour les problèmes courants.
|
|
|
|
### Contact
|
|
|
|
Pour toute question ou problème :
|
|
- Consulter la documentation
|
|
- Vérifier les logs de l'application
|
|
- Contacter l'équipe de développement
|
|
|
|
---
|
|
|
|
## 📝 Licence
|
|
|
|
Ce projet est la propriété de Manager Itinova. Tous droits réservés.
|
|
|
|
---
|
|
|
|
## 🙏 Crédits
|
|
|
|
Développé avec ❤️ pour Manager Itinova
|
|
|
|
**Technologies utilisées** :
|
|
- React, Tailwind CSS, shadcn/ui
|
|
- Node.js, Express, tRPC
|
|
- Drizzle ORM, MySQL
|
|
- Resend, Manus OAuth
|
|
|
|
---
|
|
|
|
**Version** : 1.0.0
|
|
**Dernière mise à jour** : 23 novembre 2025
|