# Guide de Déploiement - Formation Manager Itinova **Version:** 7a737c05 **Date:** 24 novembre 2025 **Auteur:** Manus AI --- ## Vue d'ensemble Ce document fournit les instructions complètes pour déployer l'application **Formation Manager Itinova** sur un serveur de production. L'application est construite avec React 19, Express 4, tRPC 11 et utilise une base de données MySQL/TiDB. --- ## Prérequis système Avant de commencer le déploiement, assurez-vous que votre serveur dispose des éléments suivants : ### Configuration matérielle minimale | Composant | Spécification minimale | Recommandé | |-----------|------------------------|------------| | CPU | 2 cœurs | 4 cœurs | | RAM | 2 GB | 4 GB | | Stockage | 20 GB | 50 GB SSD | | Bande passante | 100 Mbps | 1 Gbps | ### Logiciels requis L'application nécessite les logiciels suivants installés sur le serveur : **Node.js version 22.13.0 ou supérieure** : Le runtime JavaScript est essentiel pour exécuter l'application côté serveur. La version 22.13.0 garantit la compatibilité avec toutes les dépendances du projet. **pnpm** : Le gestionnaire de paquets pnpm est utilisé pour installer les dépendances de manière efficace. Il offre de meilleures performances et une gestion optimisée de l'espace disque par rapport à npm. **MySQL 8.0 ou TiDB** : La base de données relationnelle stocke toutes les données de l'application (formations, séquences, apprenants, inscriptions). TiDB est compatible MySQL et offre une scalabilité horizontale pour les déploiements à grande échelle. **Nginx ou Apache** : Un serveur web reverse proxy est recommandé pour gérer le SSL/TLS, la compression et le cache statique. Nginx est préféré pour ses performances supérieures. **Systemd** : Le gestionnaire de services Linux permet de gérer l'application comme un service système, assurant le démarrage automatique et la supervision. **Git** : Le système de contrôle de version est nécessaire pour cloner le dépôt et effectuer les mises à jour. --- ## Architecture de déploiement L'application suit une architecture client-serveur moderne avec les composants suivants : ### Composants principaux **Frontend React** : L'interface utilisateur est construite avec React 19 et Tailwind CSS 4. Le build de production génère des fichiers statiques optimisés (HTML, CSS, JavaScript) qui sont servis par le serveur Express. **Backend Express + tRPC** : Le serveur Node.js gère les requêtes API via tRPC, offrant une communication type-safe entre le client et le serveur. Toutes les routes API sont préfixées par `/api/`. **Base de données MySQL/TiDB** : La couche de persistance utilise Drizzle ORM pour interagir avec la base de données. Le schéma est défini dans `drizzle/schema.ts` et les migrations sont gérées automatiquement. **Authentification OAuth** : Le système d'authentification utilise Manus OAuth pour la gestion des utilisateurs. Les sessions sont stockées dans des cookies HTTP-only sécurisés. ### Flux de requêtes Les requêtes utilisateur suivent ce chemin : **Navigateur → Nginx (SSL/TLS) → Express (port 3000) → tRPC → Base de données**. Les fichiers statiques sont servis directement par Express depuis le répertoire `dist/public/`. --- ## Étape 1 : Préparation du serveur ### Installation de Node.js La première étape consiste à installer Node.js version 22.13.0 sur votre serveur Ubuntu. Utilisez les commandes suivantes pour installer Node.js via le gestionnaire de versions nvm : ```bash # Installer nvm (Node Version Manager) curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash # Recharger le profil shell source ~/.bashrc # Installer Node.js 22.13.0 nvm install 22.13.0 # Définir comme version par défaut nvm use 22.13.0 nvm alias default 22.13.0 # Vérifier l'installation node --version # Doit afficher v22.13.0 ``` ### Installation de pnpm Une fois Node.js installé, installez pnpm globalement : ```bash npm install -g pnpm # Vérifier l'installation pnpm --version ``` ### Configuration de la base de données Créez une base de données MySQL dédiée pour l'application. Connectez-vous à MySQL et exécutez les commandes suivantes : ```sql CREATE DATABASE formation_manager CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci; CREATE USER 'formation_user'@'localhost' IDENTIFIED BY 'MOT_DE_PASSE_SECURISE'; GRANT ALL PRIVILEGES ON formation_manager.* TO 'formation_user'@'localhost'; FLUSH PRIVILEGES; ``` Remplacez `MOT_DE_PASSE_SECURISE` par un mot de passe fort généré aléatoirement. Notez les informations de connexion pour la configuration ultérieure. ### Création de l'utilisateur système Pour des raisons de sécurité, créez un utilisateur système dédié pour exécuter l'application : ```bash sudo useradd -r -s /bin/bash -d /opt/formation-manager formation-manager sudo mkdir -p /opt/formation-manager sudo chown formation-manager:formation-manager /opt/formation-manager ``` --- ## Étape 2 : Clonage et configuration ### Clonage du dépôt Connectez-vous en tant qu'utilisateur `formation-manager` et clonez le dépôt Git : ```bash sudo su - formation-manager cd /opt/formation-manager git clone app cd app git checkout 7a737c05 ``` Remplacez `` par l'URL réelle de votre dépôt Git. ### Configuration des variables d'environnement Créez un fichier `.env` à la racine du projet avec les variables suivantes : ```bash # Base de données DATABASE_URL=mysql://formation_user:MOT_DE_PASSE_SECURISE@localhost:3306/formation_manager # Authentification JWT_SECRET= OAUTH_SERVER_URL=https://api.manus.im VITE_OAUTH_PORTAL_URL=https://auth.manus.im # Identifiants propriétaire OWNER_OPEN_ID= OWNER_NAME= # Configuration application VITE_APP_ID= VITE_APP_TITLE="Gestion des Formations Manager Itinova" VITE_APP_LOGO=/logo.png # APIs Manus (fournis automatiquement par la plateforme) BUILT_IN_FORGE_API_URL= BUILT_IN_FORGE_API_KEY= VITE_FRONTEND_FORGE_API_KEY= VITE_FRONTEND_FORGE_API_URL= # Analytics (optionnel) VITE_ANALYTICS_ENDPOINT= VITE_ANALYTICS_WEBSITE_ID= # Production NODE_ENV=production PORT=3000 ``` **Important** : Générez une clé JWT sécurisée avec la commande suivante : ```bash openssl rand -hex 32 ``` ### Installation des dépendances Installez toutes les dépendances du projet : ```bash pnpm install ``` Cette commande télécharge et installe toutes les bibliothèques nécessaires définies dans `package.json`. Le processus peut prendre plusieurs minutes selon votre connexion internet. --- ## Étape 3 : Migration de la base de données ### Application du schéma Appliquez le schéma de base de données en exécutant : ```bash pnpm db:push ``` Cette commande utilise Drizzle Kit pour créer automatiquement toutes les tables nécessaires dans la base de données. Les tables suivantes seront créées : | Table | Description | |-------|-------------| | `users` | Utilisateurs et administrateurs | | `formations` | Formations disponibles | | `sequences` | Séquences de formation | | `apprenants` | Apprenants inscrits | | `inscriptions` | Inscriptions aux séquences | | `emailTemplates` | Templates d'emails personnalisés | | `alertes` | Alertes et notifications | ### Vérification du schéma Connectez-vous à MySQL et vérifiez que toutes les tables ont été créées correctement : ```bash mysql -u formation_user -p formation_manager ``` ```sql SHOW TABLES; DESCRIBE users; DESCRIBE formations; ``` --- ## Étape 4 : Build de production ### Compilation de l'application Compilez l'application pour la production : ```bash pnpm run build ``` Cette commande effectue les opérations suivantes : 1. **Compilation TypeScript** : Transpile le code TypeScript du serveur en JavaScript 2. **Build Vite** : Compile et optimise le frontend React (minification, tree-shaking, code splitting) 3. **Génération des assets** : Crée les fichiers statiques dans `dist/public/` Le build de production génère un répertoire `dist/` contenant : - `dist/index.js` : Le serveur Express compilé - `dist/public/` : Les fichiers statiques du frontend (HTML, CSS, JS, images) ### Vérification du build Vérifiez que le build s'est terminé sans erreur et que les fichiers ont été générés : ```bash ls -lh dist/ ls -lh dist/public/ ``` --- ## Étape 5 : Configuration du service systemd ### Création du fichier service Créez un fichier de service systemd pour gérer l'application : ```bash sudo nano /etc/systemd/system/formation-manager.service ``` Ajoutez le contenu suivant : ```ini [Unit] Description=Formation Manager Itinova After=network.target mysql.service Wants=mysql.service [Service] Type=simple User=formation-manager Group=formation-manager WorkingDirectory=/opt/formation-manager/app Environment="NODE_ENV=production" Environment="PORT=3000" EnvironmentFile=/opt/formation-manager/app/.env ExecStart=/home/formation-manager/.nvm/versions/node/v22.13.0/bin/node dist/index.js Restart=always RestartSec=10 StandardOutput=journal StandardError=journal SyslogIdentifier=formation-manager # Limites de sécurité LimitNOFILE=65536 PrivateTmp=true NoNewPrivileges=true [Install] WantedBy=multi-user.target ``` ### Activation du service Rechargez systemd, activez et démarrez le service : ```bash sudo systemctl daemon-reload sudo systemctl enable formation-manager sudo systemctl start formation-manager ``` ### Vérification du statut Vérifiez que le service fonctionne correctement : ```bash sudo systemctl status formation-manager ``` Vous devriez voir `active (running)` en vert. Consultez les logs en cas d'erreur : ```bash sudo journalctl -u formation-manager -f ``` --- ## Étape 6 : Configuration Nginx (reverse proxy) ### Installation de Nginx Si Nginx n'est pas déjà installé : ```bash sudo apt update sudo apt install nginx ``` ### Configuration du site Créez un fichier de configuration pour votre site : ```bash sudo nano /etc/nginx/sites-available/formation-manager ``` Ajoutez la configuration suivante : ```nginx upstream formation_backend { server 127.0.0.1:3000; keepalive 64; } server { listen 80; server_name votre-domaine.com www.votre-domaine.com; # Redirection HTTP vers HTTPS return 301 https://$server_name$request_uri; } server { listen 443 ssl http2; server_name votre-domaine.com www.votre-domaine.com; # Certificats SSL (à configurer avec Let's Encrypt) ssl_certificate /etc/letsencrypt/live/votre-domaine.com/fullchain.pem; ssl_certificate_key /etc/letsencrypt/live/votre-domaine.com/privkey.pem; ssl_protocols TLSv1.2 TLSv1.3; ssl_ciphers HIGH:!aNULL:!MD5; ssl_prefer_server_ciphers on; # Logs access_log /var/log/nginx/formation-manager-access.log; error_log /var/log/nginx/formation-manager-error.log; # Taille maximale des uploads client_max_body_size 10M; # Compression gzip on; gzip_vary on; gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript; # Proxy vers Node.js location / { proxy_pass http://formation_backend; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection 'upgrade'; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; proxy_cache_bypass $http_upgrade; proxy_read_timeout 300s; proxy_connect_timeout 75s; } # Cache des assets statiques location ~* \.(jpg|jpeg|png|gif|ico|css|js|svg|woff|woff2|ttf|eot)$ { proxy_pass http://formation_backend; expires 1y; add_header Cache-Control "public, immutable"; } } ``` Remplacez `votre-domaine.com` par votre nom de domaine réel. ### Activation du site Activez la configuration et redémarrez Nginx : ```bash sudo ln -s /etc/nginx/sites-available/formation-manager /etc/nginx/sites-enabled/ sudo nginx -t # Tester la configuration sudo systemctl restart nginx ``` ### Configuration SSL avec Let's Encrypt Installez Certbot et obtenez un certificat SSL gratuit : ```bash sudo apt install certbot python3-certbot-nginx sudo certbot --nginx -d votre-domaine.com -d www.votre-domaine.com ``` Suivez les instructions à l'écran. Certbot configurera automatiquement Nginx pour utiliser HTTPS. --- ## Étape 7 : Configuration du pare-feu ### Configuration UFW Si vous utilisez UFW (Uncomplicated Firewall), autorisez les ports nécessaires : ```bash sudo ufw allow 22/tcp # SSH sudo ufw allow 80/tcp # HTTP sudo ufw allow 443/tcp # HTTPS sudo ufw enable sudo ufw status ``` ### Sécurisation SSH (recommandé) Désactivez l'authentification par mot de passe SSH et utilisez uniquement les clés : ```bash sudo nano /etc/ssh/sshd_config ``` Modifiez les lignes suivantes : ``` PasswordAuthentication no PermitRootLogin no ``` Redémarrez SSH : ```bash sudo systemctl restart sshd ``` --- ## Étape 8 : Vérification du déploiement ### Tests fonctionnels Accédez à votre application via le navigateur à l'adresse `https://votre-domaine.com` et vérifiez les éléments suivants : | Test | Description | Résultat attendu | |------|-------------|------------------| | Page d'accueil | Chargement de la page d'accueil | Affichage correct sans erreur | | Connexion | Authentification via Manus OAuth | Redirection vers le tableau de bord | | Tableau de bord | Affichage des statistiques | Graphiques et cartes visibles | | Formations | Liste des formations | Tableau avec données | | Séquences | Liste des séquences | Tableau avec code couleur | | Apprenants | Liste des apprenants | Tableau avec badges de statut | | Templates d'emails | Modification d'un template | Éditeur TipTap fonctionnel | ### Vérification des logs Surveillez les logs pour détecter d'éventuelles erreurs : ```bash # Logs de l'application sudo journalctl -u formation-manager -f # Logs Nginx sudo tail -f /var/log/nginx/formation-manager-error.log # Logs système sudo tail -f /var/log/syslog ``` ### Tests de performance Utilisez des outils pour tester les performances de votre application : ```bash # Test de charge avec Apache Bench ab -n 1000 -c 10 https://votre-domaine.com/ # Analyse des temps de réponse curl -w "@curl-format.txt" -o /dev/null -s https://votre-domaine.com/ ``` --- ## Maintenance et mises à jour ### Sauvegarde de la base de données Créez un script de sauvegarde automatique : ```bash sudo nano /opt/formation-manager/backup-db.sh ``` Contenu du script : ```bash #!/bin/bash DATE=$(date +%Y%m%d_%H%M%S) BACKUP_DIR="/opt/formation-manager/backups" mkdir -p $BACKUP_DIR mysqldump -u formation_user -p'MOT_DE_PASSE' formation_manager | gzip > $BACKUP_DIR/formation_manager_$DATE.sql.gz # Garder seulement les 30 dernières sauvegardes find $BACKUP_DIR -name "formation_manager_*.sql.gz" -mtime +30 -delete ``` Rendez le script exécutable et ajoutez-le au cron : ```bash chmod +x /opt/formation-manager/backup-db.sh sudo crontab -e ``` Ajoutez la ligne suivante pour une sauvegarde quotidienne à 2h du matin : ``` 0 2 * * * /opt/formation-manager/backup-db.sh ``` ### Mise à jour de l'application Pour mettre à jour l'application vers une nouvelle version : ```bash cd /opt/formation-manager/app sudo systemctl stop formation-manager git pull origin main pnpm install pnpm db:push # Appliquer les migrations pnpm run build sudo systemctl start formation-manager ``` ### Surveillance et monitoring Installez des outils de monitoring pour surveiller les performances : **PM2** : Alternative à systemd avec monitoring intégré **Prometheus + Grafana** : Monitoring avancé et dashboards **Uptime Kuma** : Surveillance de disponibilité **New Relic / DataDog** : Solutions SaaS complètes --- ## Dépannage ### L'application ne démarre pas Vérifiez les logs pour identifier l'erreur : ```bash sudo journalctl -u formation-manager -n 100 ``` Causes courantes : - **Erreur de connexion à la base de données** : Vérifiez `DATABASE_URL` dans `.env` - **Port déjà utilisé** : Changez le port dans `.env` ou arrêtez le processus conflictuel - **Permissions insuffisantes** : Vérifiez les droits sur `/opt/formation-manager/app` ### Erreur 502 Bad Gateway Cette erreur indique que Nginx ne peut pas se connecter au backend Node.js. Vérifications : ```bash # Vérifier que le service tourne sudo systemctl status formation-manager # Vérifier que le port 3000 écoute sudo netstat -tulpn | grep 3000 # Tester la connexion locale curl http://localhost:3000 ``` ### Problèmes de performance Si l'application est lente : 1. **Optimiser les requêtes SQL** : Ajoutez des index sur les colonnes fréquemment interrogées 2. **Activer le cache Redis** : Mettez en cache les résultats des requêtes coûteuses 3. **Augmenter les ressources** : Ajoutez plus de RAM ou de CPU 4. **Activer la compression Nginx** : Déjà configurée dans l'exemple ci-dessus ### Base de données corrompue En cas de corruption de la base de données, restaurez depuis une sauvegarde : ```bash gunzip < /opt/formation-manager/backups/formation_manager_YYYYMMDD_HHMMSS.sql.gz | mysql -u formation_user -p formation_manager ``` --- ## Sécurité ### Bonnes pratiques Suivez ces recommandations pour sécuriser votre déploiement : **Mettez à jour régulièrement** : Appliquez les mises à jour de sécurité du système d'exploitation et des dépendances Node.js. **Utilisez HTTPS uniquement** : Forcez la redirection HTTP vers HTTPS et activez HSTS (HTTP Strict Transport Security). **Limitez les accès SSH** : Utilisez des clés SSH au lieu de mots de passe et limitez l'accès par IP si possible. **Configurez un WAF** : Utilisez un Web Application Firewall comme ModSecurity ou Cloudflare pour bloquer les attaques courantes. **Surveillez les logs** : Configurez des alertes pour détecter les tentatives d'intrusion ou les comportements anormaux. **Sauvegardez régulièrement** : Automatisez les sauvegardes de la base de données et testez régulièrement la restauration. ### Checklist de sécurité Avant de mettre en production, vérifiez les points suivants : - [ ] Certificat SSL valide configuré - [ ] Pare-feu activé et configuré - [ ] Authentification SSH par clé uniquement - [ ] Variables d'environnement sécurisées (pas de valeurs par défaut) - [ ] Sauvegardes automatiques configurées - [ ] Monitoring et alertes en place - [ ] Logs rotatifs configurés - [ ] Permissions fichiers correctes (pas de 777) - [ ] Base de données accessible uniquement en local - [ ] Rate limiting configuré sur Nginx --- ## Support et contact Pour toute question ou problème concernant le déploiement : - **Documentation technique** : Consultez le README.md du projet - **Support Manus** : https://help.manus.im - **Contact développeur** : o.pareige@itinova.org --- **Fin du guide de déploiement**