rpa_vision_v3/visual_workflow_builder/SCRIPTS_FULLSTACK_COMPLETE.md

Scripts Full-Stack Complétés

Date

2 décembre 2024

Résumé

Création de scripts shell pour gérer l'ensemble de l'application Visual Workflow Builder (backend + frontend) de manière unifiée.

Scripts Créés

Scripts Racine (Full-Stack)

1. start.sh (Racine)

Fonction: Démarre tous les services (backend + frontend)

Comportement:

• ✅ Démarre le backend Flask (port 5001)
• ✅ Démarre le frontend React (port 3000) si configuré
• ✅ Gère gracieusement l'absence du frontend (Phase 1)
• ✅ Affiche les URLs d'accès
• ✅ Vérifie que les services démarrent correctement

Utilisation:

cd visual_workflow_builder
./start.sh

2. stop.sh (Racine)

Fonction: Arrête tous les services

Comportement:

• ✅ Arrête le frontend (port 3000)
• ✅ Arrête le backend (port 5001)
• ✅ Nettoie tous les processus sur ces ports
• ✅ Fonctionne même sans fichiers PID

Utilisation:

cd visual_workflow_builder
./stop.sh

3. status.sh (Racine)

Fonction: Affiche l'état de tous les services

Comportement:

• ✅ Vérifie l'état du backend
• ✅ Vérifie l'état du frontend
• ✅ Affiche les informations des processus
• ✅ Effectue des health checks HTTP
• ✅ Affiche les derniers logs
• ✅ Affiche les URLs d'accès rapide

Utilisation:

cd visual_workflow_builder
./status.sh

4. restart.sh (Racine)

Fonction: Redémarre tous les services

Comportement:

• ✅ Arrête tous les services
• ✅ Attend 2 secondes
• ✅ Redémarre tous les services

Utilisation:

cd visual_workflow_builder
./restart.sh

Scripts Backend

1. backend/start.sh

• Démarre le serveur Flask sur port 5001
• Crée .server.pid et server.log
• Vérifie le démarrage

2. backend/stop.sh

• Arrête le serveur Flask gracieusement
• Nettoie le port 5001
• Supprime le fichier PID

3. backend/status.sh

• Affiche l'état du backend
• Informations processus
• Health check HTTP
• Derniers logs

4. backend/restart.sh

• Redémarre le backend

Scripts Frontend

1. frontend/start.sh

• Démarre le serveur React sur port 3000
• Crée .frontend.pid et frontend.log
• Vérifie node_modules

2. frontend/stop.sh

• Arrête le serveur React gracieusement
• Nettoie le port 3000
• Supprime le fichier PID

3. frontend/status.sh

• Affiche l'état du frontend
• Informations processus
• Health check HTTP
• Derniers logs

Architecture des Scripts

visual_workflow_builder/
├── start.sh              ✅ Démarre tout
├── stop.sh               ✅ Arrête tout
├── status.sh             ✅ État de tout
├── restart.sh            ✅ Redémarre tout
├── backend/
│   ├── start.sh          ✅ Démarre backend
│   ├── stop.sh           ✅ Arrête backend
│   ├── status.sh         ✅ État backend
│   ├── restart.sh        ✅ Redémarre backend
│   ├── .server.pid       (généré)
│   └── server.log        (généré)
└── frontend/
    ├── start.sh          ✅ Démarre frontend
    ├── stop.sh           ✅ Arrête frontend
    ├── status.sh         ✅ État frontend
    ├── .frontend.pid     (généré)
    └── frontend.log      (généré)

Tests Effectués

Test 1: Démarrage Full-Stack

./start.sh

Résultat: ✅ Backend démarré, Frontend géré gracieusement (Phase 1)

Test 2: Vérification du Statut

./status.sh

Résultat: ✅ Affichage correct des deux services

• Backend: RUNNING ✓
• Frontend: État affiché correctement

Test 3: Arrêt Full-Stack

./stop.sh

Résultat: ✅ Tous les services arrêtés proprement

• Frontend arrêté
• Backend arrêté
• Ports libérés

Test 4: Redémarrage

./restart.sh

Résultat: ✅ Tous les services redémarrés

Ports Utilisés

Service	Port	URL
Backend	5001	http://localhost:5001
Frontend	3000	http://localhost:3000

Fichiers Générés

Backend

• .server.pid - PID du processus backend
• server.log - Logs du backend

Frontend

• .frontend.pid - PID du processus frontend
• frontend.log - Logs du frontend

Utilisation Quotidienne

Démarrage Complet

cd visual_workflow_builder
./start.sh

Vérifier l'État

./status.sh

Arrêter Tout

./stop.sh

Redémarrer Après Modifications

./restart.sh

Démarrer Seulement le Backend

cd backend
./start.sh

Démarrer Seulement le Frontend

cd frontend
./start.sh

Workflow de Développement

Développement Backend

# Démarrer seulement le backend
cd visual_workflow_builder/backend
./start.sh

# Voir les logs
tail -f server.log

# Après modifications
./restart.sh

# Arrêter
./stop.sh

Développement Frontend (Phase 2+)

# Démarrer seulement le frontend
cd visual_workflow_builder/frontend
./start.sh

# Voir les logs
tail -f frontend.log

# Après modifications
./restart.sh

# Arrêter
./stop.sh

Développement Full-Stack

# Démarrer tout
cd visual_workflow_builder
./start.sh

# Vérifier l'état
./status.sh

# Voir les logs backend
tail -f backend/server.log

# Voir les logs frontend
tail -f frontend/frontend.log

# Redémarrer tout
./restart.sh

# Arrêter tout
./stop.sh

Tests Automatisés

Script de Test Complet

#!/bin/bash
cd visual_workflow_builder

# Démarrer tous les services
./start.sh
sleep 3

# Vérifier l'état
./status.sh

# Lancer les tests backend
cd backend
python test_api_manual.py
TEST_RESULT=$?

# Arrêter tous les services
cd ..
./stop.sh

exit $TEST_RESULT

Avantages

Pour le Développement

1. Démarrage Rapide: Un seul script pour tout démarrer
2. Gestion Unifiée: Contrôle centralisé de tous les services
3. Logs Séparés: Logs backend et frontend dans des fichiers distincts
4. Flexibilité: Possibilité de démarrer services individuellement

Pour les Tests

1. Environnement Propre: Arrêt/démarrage complet pour tests isolés
2. Automatisation: Facile d'intégrer dans des scripts de test
3. Vérification: Script status pour diagnostiquer rapidement

Pour la Production

1. Gestion de Processus: Fichiers PID pour monitoring
2. Logs Persistants: Historique complet des événements
3. Arrêt Gracieux: Pas de perte de données
4. Health Checks: Vérification automatique de l'état

Compatibilité

Phase 1 (Actuelle)

• ✅ Backend complètement fonctionnel
• ✅ Frontend géré gracieusement (pas encore implémenté)
• ✅ Scripts prêts pour Phase 2

Phase 2+ (Future)

• ✅ Frontend React sera automatiquement géré
• ✅ Aucune modification des scripts nécessaire
• ✅ Démarrage/arrêt automatique des deux services

Dépannage

Le backend ne démarre pas

# Vérifier si le port est occupé
lsof -i:5001

# Tuer le processus
kill $(lsof -ti:5001)

# Réessayer
./start.sh

Le frontend ne démarre pas

# Vérifier si le port est occupé
lsof -i:3000

# Tuer le processus
kill $(lsof -ti:3000)

# Vérifier node_modules
cd frontend
npm install

# Réessayer
cd ..
./start.sh

Les services ne s'arrêtent pas

# Forcer l'arrêt
./stop.sh

# Si ça ne fonctionne pas
kill -9 $(lsof -ti:5001)
kill -9 $(lsof -ti:3000)

Fichiers PID obsolètes

# Supprimer les fichiers PID
rm backend/.server.pid
rm frontend/.frontend.pid

# Vérifier l'état
./status.sh

Commandes Rapides

# Racine du projet
cd visual_workflow_builder

# Démarrer tout
./start.sh

# État
./status.sh

# Arrêter tout
./stop.sh

# Redémarrer tout
./restart.sh

# Logs backend
tail -f backend/server.log

# Logs frontend
tail -f frontend/frontend.log

# Health check backend
curl http://localhost:5001/health

# Health check frontend
curl http://localhost:3000

Conclusion

Les scripts full-stack sont maintenant opérationnels et testés. Ils fournissent une interface unifiée pour gérer l'ensemble de l'application Visual Workflow Builder, facilitant grandement le développement et les tests.

Avantages clés:

• 🚀 Démarrage/arrêt en une commande
• 📊 Monitoring centralisé
• 🔄 Redémarrage automatique
• 📝 Logs séparés et accessibles
• ✅ Prêt pour Phase 2 (frontend React)

Prochaine étape: Continuer avec la Phase 2 du projet (Interface Canvas de Base).