Architecture Mobile - Flutter

Vue d'ensemble

Tranoo dispose de deux applications mobiles Flutter :

• Tranoo - Application pour acheteurs
• Tranoo Pro - Espace professionnel (vendeurs, transitaires, chauffeurs)

Stack technique

Composant	Technologie	Version
Framework	Flutter	SDK >= 3.0.0
Langage	Dart	-
Authentification	Firebase Auth	^6.1.2
Notifications	Firebase Messaging	^16.0.4
Stockage	Firebase Storage	^13.0.4
HTTP Client	Dio	^5.8.0+1
WebSocket	Socket.io Client	^3.1.2
Cartes	flutter_map (OpenStreetMap)	^8.3.0
Géolocalisation	geolocator	^14.0.2
Paiements	feexpay_flutter_v2	^1.1.2
State Management	Provider	^6.1.5
Local Storage	shared_preferences	^2.5.3
Internationalisation	flutter_localizations	SDK
Animations	Lottie	^3.3.3
Confetti	confetti	^0.8.0

Tranoo - Application Acheteurs

Version

• Version actuelle : 2.0.0+18
• Cible : Acheteurs de véhicules, motos et pièces détachées

Structure du projet

tranoo/
├── lib/
│   ├── config/                    # Configuration app
│   ├── data/                      # Données et modèles
│   ├── firebase_options.dart      # Configuration Firebase
│   ├── l10n/                      # Internationalisation
│   │   ├── app_fr.arb            # Français
│   │   ├── app_en.arb            # Anglais
│   │   └── app_ar.arb            # Arabe
│   ├── languesentreprise.dart     # Config langues
│   ├── main.dart                  # Point d'entrée
│   ├── middleware/                # Middlewares
│   ├── providers/                 # State management
│   ├── screens/                   # Écrans
│   │   ├── payment_screen.dart
│   │   └── transactions_screen.dart
│   ├── services/                  # Services API
│   ├── utils/                     # Utilitaires
│   └── widgets/                   # Widgets réutilisables
├── assets/                        # Assets statiques
│   ├── images/
│   ├── logo/
│   ├── lottie/
│   └── sounds/
├── android/                       # Configuration Android
├── ios/                           # Configuration iOS
├── web/                           # Configuration Web
├── windows/                       # Configuration Windows
├── .env                           # Variables environnement
├── pubspec.yaml                   # Dépendances
└── firebase.json                  # Configuration Firebase

Fonctionnalités principales

• Recherche et achat de véhicules, motos et pièces
• Suivi de commandes en temps réel
• Livraison via Livro (tiers, en cours d'intégration — voir Livro)
• Paiements intégrés (Feexpay)
• Géolocalisation et cartes (OpenStreetMap)
• Notifications push
• Chat en temps réel
• Favoris et historique

Configuration spécifique

Splash screen

• Couleur : #F8BF13 (Jaune Tranoo)
• Image : assets/images/logo_jaune.png

Icône app

• Image : assets/images/logo_jaune.jpeg
• Android min SDK : 21

Tranoo Pro - Espace Professionnel

Version

• Version actuelle : 1.0.2+25
• Cible : Vendeurs, Transitaires, Chauffeurs, Agents

Structure du projet

tranoo_pro/
├── lib/
│   ├── config/                    # Configuration app
│   ├── data/                      # Données et modèles
│   ├── firebase_options.dart      # Configuration Firebase
│   ├── l10n/                      # Internationalisation
│   │   ├── app_fr.arb            # Français
│   │   ├── app_en.arb            # Anglais
│   │   └── app_ar.arb            # Arabe
│   ├── languesentreprise.dart     # Config langues
│   ├── main.dart                  # Point d'entrée
│   ├── middleware/                # Middlewares
│   ├── providers/                 # State management
│   ├── screens/                   # Écrans
│   │   ├── payment_screen.dart
│   │   └── transactions_screen.dart
│   ├── services/                  # Services API
│   ├── utils/                     # Utilitaires
│   └── widgets/                   # Widgets réutilisables
├── assets/                        # Assets statiques
│   ├── images/
│   ├── logo/
│   ├── lottie/
│   ├── sounds/
│   └── videos/
├── android/                       # Configuration Android
├── ios/                           # Configuration iOS
├── web/                           # Configuration Web
├── windows/                       # Configuration Windows
├── .env                           # Variables environnement
├── pubspec.yaml                   # Dépendances
└── firebase.json                  # Configuration Firebase

Fonctionnalités par rôle

Vendeurs

• Gestion de catalogue (articles, véhicules, motos)
• Suivi des ventes et stocks
• Gestion des commandes
• Paiements et facturation

Transitaires

• Gestion des expéditions internationales
• Suivi des missions de transit (Transit international)
• Gestion des abonnements
• Vérification des documents

Chauffeurs

• Demandes chauffeur / tricycle (DemandeChauffeur)
• Contacts tricycles

Agents commerciaux

• Prospection et journal quotidien
• KPIs démos, abonnements, campagnes (Agents commerciaux)
• Parrainage vendeurs (Parrainage)

:::info Livraison locale La livraison locale (rôle livreur, tracking GPS livreur) est legacy — remplacée par Livro. :::

Configuration spécifique

Splash screen

• Couleur : #FFFFFF (Blanc)
• Image : assets/images/logo fond blanc.png

Icône app

• Image : assets/images/logo fond blancI.png
• Android min SDK : 21

Architecture commune

State Management

• Provider pour la gestion d'état
• Séparation des concerns (UI, logique, données)

Services API

• Dio pour les requêtes HTTP
• Intégration avec backend Node.js
• Gestion des erreurs et tokens

Authentification

• Firebase Auth pour l'authentification
• Email synthétique basé sur téléphone
• Token Firebase pour les requêtes API

Notifications

• Firebase Messaging pour les push notifications
• Gestion des tokens FCM
• Notifications locales et distantes

Géolocalisation

• geolocator pour la position GPS
• flutter_map avec OpenStreetMap (gratuit)
• Tracking GPS : transit et présence agent (livraison locale = legacy Livro)

Paiements

• Feexpay pour les paiements mobiles
• Intégration webhooks
• Gestion des wallets

Internationalisation

• Support : français (défaut), anglais, arabe
• Fichiers ARB pour les traductions
• Sélecteur de langue dans l'app

Communication avec le backend

API REST

• Base URL configurée dans .env
• Headers :
  • Authorization: Bearer <token>
  • Content-Type: application/json

WebSocket (Socket.io)

• Chat en temps réel
• Mises à jour missions transit (transit-mission-update)

Firebase

• Authentification
• Notifications push
• Stockage fichiers

Sécurité

Firebase App Check

• Sécurisation des apps mobiles
• Protection contre requêtes non autorisées

Token Management

• Refresh automatique des tokens
• Gestion des sessions

Validation

• Validation des formulaires
• Gestion des erreurs API

Build et déploiement

Développement

flutter run                    # Lancer en développement
flutter run --release         # Mode release

Build Android

flutter build apk --release
flutter build appbundle --release

Build iOS

flutter build ios --release

Tests

flutter test                   # Tests unitaires
flutter drive                  # Tests integration

Environnement

Variables .env

API_BASE_URL=                 # URL backend API
FIREBASE_API_KEY=            # Clé API Firebase
FEEXPAY_API_KEY=             # Clé API Feexpay

Voir aussi

• Architecture Backend — documentation backend Node.js
• Architecture Web — documentation dashboard Next.js
• Authentification — système d'authentification Firebase
• Internationalisation — configuration i18n
• Transit international — missions transitaires
• Agents commerciaux — KPIs agents Pro
• Livro — livraison tiers