DORA est une plateforme web complète dédiée à la simplification des démarches de visa et à l'accompagnement des voyageurs dans leurs aventures internationales. L'application combine un frontend moderne en Next.js avec des services intelligents pour offrir une expérience utilisateur exceptionnelle et personnalisée.
- Framework: Next.js avec App Router
- Styling: Tailwind CSS + shadcn/ui (design professionnel)
- TypeScript: Typage strict pour la robustesse
- Responsive: Design adaptatif mobile-first
- APIs Externes: Intégration avec Google Places, Indeed, Unsplash
- Fallback System: Données mockées en cas d'indisponibilité
- Personnalisation: Contenu adapté selon le profil utilisateur
- Cache Local: Optimisation des performances
- Design professionnel: Interface épurée et moderne
- Animations subtiles: Transitions fluides sans surcharge
- Accessibilité: Respect des standards WCAG
- Thèmes: Mode clair/sombre avec persistance
- Palette restreinte: Couleurs cohérentes et professionnelles
- Contraste optimal: Lisibilité garantie sur tous les fonds
- Typographie: Hiérarchie claire avec 3 poids maximum
- Espacement: Système 8px pour la cohérence
- Accueil: Hero section avec simulateur de visa
- Pays: Filtrage personnalisé selon la nationalité
- Communauté: Partage d'expériences validées
- Mes démarches: Suivi personnalisé des demandes
- Intégration: Aide à l'installation dans le nouveau pays
- Dashboard Admin: Gestion complète (admin uniquement)
- Touriste: Sites touristiques, restaurants, hébergements
- Travailleur: Offres d'emploi, networking professionnel
- Étudiant: Universités, bourses, admissions
- Résident permanent: Logements, services essentiels
- Google Places API: Lieux d'intérêt en temps réel
- Indeed API: Offres d'emploi actualisées
- Unsplash API: Galeries d'images dynamiques
- Données de fallback: Fonctionnement hors ligne
- Profil utilisateur: Préférences et historique
- Recommandations: Contenu adapté au profil
- Compatibilité pays: Score basé sur les critères
- Progression: Suivi des étapes d'intégration
- Modération: Validation des posts communautaires
- Utilisateurs: Gestion des comptes et permissions
- Pays: CRUD complet des destinations
- Analytics: Métriques d'utilisation
dora-travel-app/
├── app/ # Pages Next.js App Router
│ ├── page.tsx # Accueil avec simulateur
│ ├── countries/ # Catalogue des pays
│ │ ├── page.tsx # Liste des pays
│ │ └── [code]/page.tsx # Détail d'un pays
│ ├── community/page.tsx # Communauté
│ ├── visa-steps/page.tsx # Processus de visa
│ ├── integration/page.tsx # Services d'intégration
│ ├── admin/page.tsx # Panel d'administration
│ ├── layout.tsx # Layout principal
│ └── globals.css # Styles globaux
├── components/ # Composants réutilisables
│ ├── ui/ # Composants UI de base
│ ├── layout/ # Header, Footer
│ ├── auth/ # Authentification
│ ├── chatbot/ # Assistant IA
│ └── visa/ # Composants visa
├── lib/ # Utilitaires et services
│ ├── services/ # Services métier
│ │ ├── externalApiService.ts # APIs externes
│ │ ├── userProfileService.ts # Profils utilisateurs
│ │ ├── communityService.ts # Communauté
│ │ └── countryService.ts # Pays
│ ├── auth.ts # Authentification
│ ├── currency.ts # Conversion de devises
│ ├── theme.ts # Gestion des thèmes
│ └── utils.ts # Utilitaires généraux
├── hooks/ # Hooks React personnalisés
├── data/ # Données statiques JSON
└── README.md # Cette documentation
# Google Places API (pour les lieux)
NEXT_PUBLIC_GOOGLE_PLACES_API_KEY=your_key_here
# Indeed API (pour les emplois)
NEXT_PUBLIC_INDEED_API_KEY=your_key_here
# Unsplash API (pour les images)
NEXT_PUBLIC_UNSPLASH_ACCESS_KEY=your_key_here
# OpenWeatherMap API (pour la météo)
NEXT_PUBLIC_WEATHER_API_KEY=your_key_here- Aller sur Google Cloud Console
- Créer un projet ou sélectionner un existant
- Activer l'API "Places API"
- Créer une clé API et la restreindre aux domaines autorisés
- Ajouter la clé dans
.env.local
- S'inscrire sur Indeed Publisher
- Obtenir une clé API
- Configurer les paramètres de recherche
- Ajouter la clé dans
.env.local
- Créer un compte sur Unsplash Developers
- Créer une nouvelle application
- Obtenir la clé d'accès
- Respecter les limites de taux (50 requêtes/heure en gratuit)
- Node.js 18+
- npm ou yarn
# Cloner le projet
git clone [url-du-repo]
cd dora-travel-app
# Installer les dépendances
npm install
# Configurer les variables d'environnement
cp .env.example .env.local
# Éditer .env.local avec vos clés API
# Démarrer en développement
npm run dev# Build de production
npm run build
# Démarrer le serveur de production
npm start- Clés publiques uniquement: Jamais de clés secrètes côté client
- Limitation de domaine: Restreindre les clés aux domaines autorisés
- Monitoring: Surveiller l'utilisation des quotas
- Fallback: Données mockées en cas d'indisponibilité
- Stockage local: Données sensibles chiffrées
- Validation: Sanitisation de toutes les entrées
- RGPD: Respect de la confidentialité
- Backup: Sauvegarde locale en fallback
- Code Splitting: Chargement à la demande
- Image Optimization: Next.js Image component
- Caching: Stratégies de cache intelligentes
- Bundle Size: Optimisation des imports
- Cache Redis/localStorage: Réduction des appels
- Debouncing: Limitation des requêtes
- Pagination: Chargement progressif
- Compression: Optimisation des réponses
- TypeScript: Typage strict
- ESLint: Règles de qualité de code
- Validation: Schémas de données
- Error Handling: Gestion complète des erreurs
- Performance: Métriques de chargement
- Erreurs: Tracking des exceptions
- Usage: Analytics d'utilisation
- APIs: Monitoring des quotas
- Français (par défaut)
- Anglais
- Espagnol
- EUR (Euro)
- USD (Dollar américain)
- XAF (Franc CFA)
- CAD (Dollar canadien)
- GBP (Livre sterling)
- JPY (Yen japonais)
- AUD (Dollar australien)
- Profil utilisateur: Préférences et historique
- Statut adaptatif: Contenu selon le profil
- Recommandations: IA pour suggestions
- Progression: Suivi des étapes
- Services locaux: Aide à l'installation
- Géolocalisation: Services à proximité
- Conseils pratiques: Guide d'intégration
- Communauté: Réseau d'entraide
- Utilisateurs: Total, nouveaux, actifs
- Posts: Total, approuvés, en attente
- Pays: Popularité, demandes de visa
- APIs: Usage et performance
- Admin: Vue d'ensemble complète
- Utilisateur: Progression personnelle
- Performance: Métriques techniques
- Notifications push: Alertes en temps réel
- Chat en direct: Communication entre utilisateurs
- Géolocalisation: Détection automatique
- Offline-first: Mode hors ligne complet
- Mobile app: Application native
- GraphQL: Migration vers GraphQL
- Microservices: Architecture distribuée
- CDN: Distribution de contenu global
- AI/ML: Recommandations avancées
- Email: contact@dora.travel
- Support: support@dora.travel
- Documentation: docs@dora.travel
- Mises à jour: Déploiement continu
- Monitoring: 24/7 avec alertes
- Backup: Quotidien avec rétention
- Sécurité: Audits réguliers
DORA - Votre compagnon digital pour explorer le monde en toute sérénité 🌍
Version 2.0 - Design professionnel et APIs dynamiques