rpa_vision_v3/visual_workflow_builder/DEMARRAGE_SIMPLE.md

🚀 Démarrage Simple - Visual Workflow Builder

Option 1 : Script Automatique (Recommandé)

cd visual_workflow_builder
./start_full.sh

Si ça ne marche pas, essayez l'option 2.

Option 2 : Démarrage Manuel (Plus Fiable)

Terminal 1 - Backend

cd visual_workflow_builder/backend
./start.sh

OU directement avec Python :

cd visual_workflow_builder/backend
python3 app.py

Vous devriez voir :

 * Running on http://0.0.0.0:5000

Terminal 2 - Frontend

cd visual_workflow_builder/frontend
npm start

Le navigateur devrait s'ouvrir automatiquement sur http://localhost:3000

✅ Vérification

Backend

curl http://localhost:5000/health

Résultat attendu :

{"status":"healthy","version":"1.0.0"}

Frontend

Ouvrir http://localhost:3000 dans le navigateur

🐛 Problèmes Courants

"python: command not found"

Solution : Utiliser python3 au lieu de python

cd visual_workflow_builder/backend
python3 app.py

"Port 5000 already in use"

Solution : Tuer le processus existant

lsof -ti:5000 | xargs kill -9

"Module not found"

Solution : Installer les dépendances

cd visual_workflow_builder/backend
pip3 install -r requirements.txt

Frontend ne démarre pas

Solution : Réinstaller les dépendances

cd visual_workflow_builder/frontend
rm -rf node_modules package-lock.json
npm install
npm start

📝 Commandes Utiles

Arrêter les services

Backend : Ctrl+C dans le terminal du backend

Frontend : Ctrl+C dans le terminal du frontend

Voir les logs

Backend : Les logs s'affichent directement dans le terminal

Frontend : Les logs s'affichent dans le terminal + console du navigateur (F12)

Tester l'API

# Health check
curl http://localhost:5000/health

# Créer un workflow
curl -X POST http://localhost:5000/api/workflows \
  -H "Content-Type: application/json" \
  -d '{"name":"Test","nodes":[],"edges":[]}'

# Capture d'écran
curl -X POST http://localhost:5000/api/screen-capture/capture \
  -H "Content-Type: application/json" \
  -d '{}'

🎯 Premier Test

1. Ouvrir http://localhost:3000
2. Glisser "Click" depuis la palette
3. Cliquer sur l'étape
4. Cliquer sur "Sélection visuelle" 📷
5. Observer la capture d'écran
6. Sélectionner un élément
7. Confirmer
8. Cliquer sur "Sauvegarder"
9. Observer la notification de succès ✅

✨ C'est Parti !

Une fois les deux services démarrés, l'application est prête à être utilisée !

Besoin d'aide ? Consultez GUIDE_TEST_COMPLET.md