# 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. ![Version](https://img.shields.io/badge/version-1.0.0-blue.svg) ![Node](https://img.shields.io/badge/node-22.13.0-green.svg) ![License](https://img.shields.io/badge/license-Proprietary-red.svg) --- ## 📋 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