From 1a36b24301558971fd82aae56931980a6fef1d9e Mon Sep 17 00:00:00 2001 From: Arthur Lempereur Date: Thu, 23 Oct 2025 18:03:57 +0200 Subject: [PATCH] chore: Clean up remaining MD files --- App.test.tsx | 32 ---- CHANGELOG.md | 132 ---------------- CONTRIBUTING.md | 381 --------------------------------------------- DEPLOYMENT.md | 341 ---------------------------------------- FIREBASE_SETUP.md | 158 ------------------- NEXT_STEPS.md | 278 --------------------------------- PROJECT_SUMMARY.md | 314 ------------------------------------- QUICKSTART.md | 149 ------------------ QUICK_FIX.md | 135 ---------------- TESTING.md | 243 ----------------------------- TROUBLESHOOTING.md | 124 --------------- 11 files changed, 2287 deletions(-) delete mode 100644 App.test.tsx delete mode 100644 CHANGELOG.md delete mode 100644 CONTRIBUTING.md delete mode 100644 DEPLOYMENT.md delete mode 100644 FIREBASE_SETUP.md delete mode 100644 NEXT_STEPS.md delete mode 100644 PROJECT_SUMMARY.md delete mode 100644 QUICKSTART.md delete mode 100644 QUICK_FIX.md delete mode 100644 TESTING.md delete mode 100644 TROUBLESHOOTING.md diff --git a/App.test.tsx b/App.test.tsx deleted file mode 100644 index fc810b6..0000000 --- a/App.test.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import React from 'react'; -import { View, Text, StyleSheet } from 'react-native'; - -export default function App() { - return ( - - ✅ WalletTracker fonctionne ! - Si vous voyez ce message, l'app charge correctement. - - ); -} - -const styles = StyleSheet.create({ - container: { - flex: 1, - justifyContent: 'center', - alignItems: 'center', - backgroundColor: '#F8F9FA' - }, - text: { - fontSize: 24, - fontWeight: 'bold', - color: '#333', - marginBottom: 16 - }, - subtext: { - fontSize: 16, - color: '#666', - textAlign: 'center', - paddingHorizontal: 32 - } -}); diff --git a/CHANGELOG.md b/CHANGELOG.md deleted file mode 100644 index 2dc5f6d..0000000 --- a/CHANGELOG.md +++ /dev/null @@ -1,132 +0,0 @@ -# Changelog - -Toutes les modifications notables de ce projet seront documentées dans ce fichier. - -Le format est basé sur [Keep a Changelog](https://keepachangelog.com/fr/1.0.0/), -et ce projet adhère au [Semantic Versioning](https://semver.org/lang/fr/). - -## [Non publié] - -### À venir -- Notifications push pour les rappels d'abonnements -- Mode sombre -- Export des données en CSV/PDF -- Objectifs budgétaires mensuels -- Support multilingue (EN, ES) -- Widgets pour l'écran d'accueil -- Reconnaissance de tickets avec OCR - -## [1.0.0] - 2025-10-23 - -### Ajouté -- **Authentification** - - Inscription avec email et mot de passe - - Connexion sécurisée via Firebase Auth - - Déconnexion - - Persistance de session avec AsyncStorage - - Gestion des erreurs d'authentification en français - -- **Dashboard** - - Vue d'ensemble mensuelle du budget - - Affichage du solde actuel (revenus - dépenses) - - Statistiques mensuelles (total revenus, total dépenses) - - Liste des 5 dernières transactions - - Boutons d'action rapide pour ajouter dépense/revenu - - Pull-to-refresh pour actualiser les données - -- **Gestion des transactions** - - Ajout de dépenses et revenus - - Sélection de catégorie avec icônes - - Ajout de notes optionnelles - - Affichage de la liste complète des transactions - - Tri par date (plus récentes en premier) - - Synchronisation temps réel avec Firestore - -- **Gestion des abonnements** - - Ajout d'abonnements récurrents - - Fréquences supportées : quotidien, hebdomadaire, mensuel, annuel - - Calcul automatique de la prochaine date de paiement - - Affichage du nombre de jours avant prélèvement - - Mise en évidence des abonnements proches (< 3 jours) - - Calcul du total mensuel des abonnements - -- **Analyses et statistiques** - - Graphique en camembert par catégorie - - Basculement entre dépenses et revenus - - Sélection du mois à analyser - - Statistiques détaillées par catégorie (montant, nombre, pourcentage) - - Affichage du total mensuel - -- **Catégories** - - 10 catégories de dépenses par défaut - - 5 catégories de revenus par défaut - - Icônes et couleurs personnalisées - - Initialisation automatique au premier usage - -- **Navigation** - - Bottom tabs avec 4 onglets principaux - - Navigation fluide entre les écrans - - Indicateurs visuels pour l'onglet actif - -- **Composants réutilisables** - - Button : Bouton personnalisable avec variantes - - InputText : Champ de saisie avec validation - - TransactionCard : Carte d'affichage de transaction - - SubscriptionCard : Carte d'affichage d'abonnement - -- **Services Firebase** - - authService : Gestion de l'authentification - - transactionService : CRUD des transactions - - subscriptionService : CRUD des abonnements - - categoryService : Gestion des catégories - -- **Utilitaires** - - Helpers : Fonctions de formatage et validation - - Constants : Couleurs, espacements, messages - - Sample data : Générateur de données de test - -- **Documentation** - - README.md complet - - QUICKSTART.md pour démarrage rapide - - FIREBASE_SETUP.md pour configuration Firebase - - TESTING.md avec checklist de tests - - DEPLOYMENT.md pour le déploiement - - CONTRIBUTING.md pour les contributions - -- **Sécurité** - - Règles Firestore pour protéger les données - - Validation côté client et serveur - - Stockage sécurisé des tokens - -### Technique -- React Native 0.81.5 -- Expo SDK 54 -- TypeScript 5.9 -- Firebase 12.4 -- React Navigation 7 -- React Native Chart Kit 6.12 - -## [0.1.0] - 2025-10-23 - -### Ajouté -- Configuration initiale du projet Expo -- Structure de base des dossiers -- Configuration TypeScript -- Installation des dépendances - ---- - -## Types de changements - -- `Ajouté` pour les nouvelles fonctionnalités -- `Modifié` pour les changements aux fonctionnalités existantes -- `Déprécié` pour les fonctionnalités bientôt supprimées -- `Supprimé` pour les fonctionnalités supprimées -- `Corrigé` pour les corrections de bugs -- `Sécurité` pour les vulnérabilités corrigées - -## Liens - -- [Non publié]: https://github.com/yourusername/wallettracker/compare/v1.0.0...HEAD -- [1.0.0]: https://github.com/yourusername/wallettracker/releases/tag/v1.0.0 -- [0.1.0]: https://github.com/yourusername/wallettracker/releases/tag/v0.1.0 diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md deleted file mode 100644 index 7898e18..0000000 --- a/CONTRIBUTING.md +++ /dev/null @@ -1,381 +0,0 @@ -# 🤝 Guide de contribution - WalletTracker - -Merci de votre intérêt pour contribuer à WalletTracker ! Ce guide vous aidera à démarrer. - -## 📋 Table des matières - -- [Code de conduite](#code-de-conduite) -- [Comment contribuer](#comment-contribuer) -- [Structure du projet](#structure-du-projet) -- [Standards de code](#standards-de-code) -- [Process de développement](#process-de-développement) -- [Soumettre une Pull Request](#soumettre-une-pull-request) - -## Code de conduite - -En participant à ce projet, vous acceptez de respecter notre code de conduite : - -- Soyez respectueux et inclusif -- Acceptez les critiques constructives -- Concentrez-vous sur ce qui est le mieux pour la communauté -- Faites preuve d'empathie envers les autres membres - -## Comment contribuer - -### Signaler un bug - -1. Vérifiez que le bug n'a pas déjà été signalé dans les [Issues](https://github.com/yourusername/wallettracker/issues) -2. Créez une nouvelle issue avec le template "Bug Report" -3. Incluez : - - Description claire du problème - - Steps to reproduce - - Comportement attendu vs actuel - - Screenshots si applicable - - Version de l'app et de l'OS - -### Proposer une fonctionnalité - -1. Vérifiez que la fonctionnalité n'a pas déjà été proposée -2. Créez une issue avec le template "Feature Request" -3. Expliquez : - - Le problème que cela résout - - La solution proposée - - Des alternatives considérées - - Des mockups si applicable - -### Contribuer au code - -1. Fork le projet -2. Créez une branche pour votre fonctionnalité (`git checkout -b feature/AmazingFeature`) -3. Committez vos changements (`git commit -m 'Add some AmazingFeature'`) -4. Push vers la branche (`git push origin feature/AmazingFeature`) -5. Ouvrez une Pull Request - -## Structure du projet - -``` -WalletTracker/ -├── src/ -│ ├── components/ # Composants réutilisables -│ ├── config/ # Configuration (Firebase, etc.) -│ ├── hooks/ # Custom hooks -│ ├── navigation/ # Configuration de navigation -│ ├── screens/ # Écrans de l'application -│ ├── services/ # Services (API, Firebase) -│ ├── types/ # Types TypeScript -│ └── utils/ # Fonctions utilitaires -├── assets/ # Images, fonts, etc. -└── App.tsx # Point d'entrée -``` - -## Standards de code - -### TypeScript - -- Utilisez TypeScript strict -- Définissez des types explicites -- Évitez `any`, utilisez `unknown` si nécessaire -- Utilisez des interfaces pour les objets - -```typescript -// ✅ Bon -interface User { - id: string; - email: string; - displayName?: string; -} - -// ❌ Mauvais -const user: any = { ... }; -``` - -### Naming Conventions - -- **Composants** : PascalCase (`LoginScreen`, `Button`) -- **Fonctions** : camelCase (`formatCurrency`, `getUserData`) -- **Constantes** : UPPER_SNAKE_CASE (`API_URL`, `MAX_RETRIES`) -- **Fichiers** : Même nom que le composant principal - -### Composants React - -- Utilisez des functional components avec hooks -- Déstructurez les props -- Utilisez TypeScript pour typer les props - -```typescript -// ✅ Bon -interface ButtonProps { - title: string; - onPress: () => void; - variant?: 'primary' | 'secondary'; -} - -export const Button: React.FC = ({ title, onPress, variant = 'primary' }) => { - return ( - - {title} - - ); -}; -``` - -### Styles - -- Utilisez StyleSheet.create() -- Groupez les styles par composant -- Utilisez les constantes pour les couleurs et espacements - -```typescript -import { COLORS, SPACING } from '../utils/constants'; - -const styles = StyleSheet.create({ - container: { - padding: SPACING.lg, - backgroundColor: COLORS.white - } -}); -``` - -### Imports - -Organisez les imports dans cet ordre : - -1. React et React Native -2. Bibliothèques tierces -3. Composants locaux -4. Services et utils -5. Types -6. Styles - -```typescript -import React, { useState, useEffect } from 'react'; -import { View, Text } from 'react-native'; -import { useNavigation } from '@react-navigation/native'; - -import { Button } from '../components/Button'; -import { authService } from '../services/authService'; -import { formatDate } from '../utils/helpers'; -import { User } from '../types'; - -import styles from './styles'; -``` - -### Commentaires - -- Commentez le "pourquoi", pas le "quoi" -- Utilisez JSDoc pour les fonctions publiques -- Évitez les commentaires évidents - -```typescript -/** - * Calcule la prochaine date de paiement basée sur la fréquence - * @param currentDate - Date actuelle du paiement - * @param frequency - Fréquence de l'abonnement - * @returns La prochaine date de paiement - */ -export const calculateNextPaymentDate = ( - currentDate: Date, - frequency: SubscriptionFrequency -): Date => { - // ... -}; -``` - -## Process de développement - -### 1. Setup - -```bash -git clone https://github.com/yourusername/wallettracker.git -cd wallettracker -npm install -``` - -### 2. Créer une branche - -```bash -git checkout -b feature/nom-de-la-fonctionnalite -``` - -Types de branches : -- `feature/` : Nouvelle fonctionnalité -- `fix/` : Correction de bug -- `refactor/` : Refactoring -- `docs/` : Documentation -- `test/` : Tests - -### 3. Développer - -- Écrivez du code propre et testé -- Suivez les standards de code -- Testez sur iOS et Android -- Vérifiez qu'il n'y a pas d'erreurs TypeScript - -### 4. Tester - -```bash -# Lancer l'app -npm start - -# Vérifier TypeScript -npx tsc --noEmit - -# Linter (si configuré) -npm run lint -``` - -### 5. Committer - -Utilisez des messages de commit clairs : - -```bash -git commit -m "feat: add dark mode support" -git commit -m "fix: resolve crash on transaction deletion" -git commit -m "docs: update README with new features" -``` - -Format des commits : -- `feat:` Nouvelle fonctionnalité -- `fix:` Correction de bug -- `docs:` Documentation -- `style:` Formatage, pas de changement de code -- `refactor:` Refactoring -- `test:` Ajout de tests -- `chore:` Maintenance - -## Soumettre une Pull Request - -### Checklist avant soumission - -- [ ] Le code compile sans erreurs -- [ ] Les tests passent -- [ ] Le code suit les standards du projet -- [ ] La documentation est à jour -- [ ] Les commits sont bien formatés -- [ ] La PR a une description claire - -### Template de PR - -```markdown -## Description -Brève description des changements - -## Type de changement -- [ ] Bug fix -- [ ] Nouvelle fonctionnalité -- [ ] Breaking change -- [ ] Documentation - -## Comment tester -1. Étape 1 -2. Étape 2 -3. Résultat attendu - -## Screenshots (si applicable) -[Ajouter des screenshots] - -## Checklist -- [ ] Code testé sur iOS -- [ ] Code testé sur Android -- [ ] Documentation mise à jour -- [ ] Pas de console.log -``` - -### Review process - -1. Un mainteneur reviewera votre PR -2. Des changements peuvent être demandés -3. Une fois approuvée, la PR sera mergée -4. Votre contribution sera ajoutée au CHANGELOG - -## 🎨 Design Guidelines - -### UI/UX - -- Suivez les guidelines Material Design (Android) et Human Interface (iOS) -- Utilisez des animations fluides -- Assurez l'accessibilité (contraste, taille de texte) -- Testez sur différentes tailles d'écran - -### Couleurs - -Utilisez les couleurs définies dans `src/utils/constants.ts` - -### Espacements - -Utilisez les espacements standardisés (8, 12, 16, 24, 32px) - -## 🧪 Tests - -### Tests manuels - -Utilisez le guide dans `TESTING.md` - -### Tests automatisés (à venir) - -```bash -npm test -``` - -## 📝 Documentation - -- Mettez à jour le README si nécessaire -- Documentez les nouvelles fonctionnalités -- Ajoutez des exemples d'utilisation -- Mettez à jour le CHANGELOG - -## 🐛 Debugging - -### Outils utiles - -- React Native Debugger -- Flipper -- Reactotron -- Firebase Console - -### Logs - -```typescript -// Développement -console.log('Debug info'); - -// Production -// Utilisez un service de logging (Sentry, etc.) -``` - -## 💡 Bonnes pratiques - -### Performance - -- Utilisez `React.memo` pour les composants lourds -- Évitez les re-renders inutiles -- Optimisez les images -- Utilisez FlatList pour les longues listes - -### Sécurité - -- Ne hardcodez jamais de secrets -- Validez toutes les entrées utilisateur -- Utilisez HTTPS uniquement -- Suivez les règles de sécurité Firebase - -### Accessibilité - -- Ajoutez des labels accessibles -- Testez avec VoiceOver/TalkBack -- Assurez un contraste suffisant -- Supportez les grandes tailles de texte - -## 🆘 Besoin d'aide ? - -- Consultez la [documentation](./README.md) -- Posez vos questions dans les [Discussions](https://github.com/yourusername/wallettracker/discussions) -- Rejoignez notre [Discord](https://discord.gg/wallettracker) (si applicable) - -## 🙏 Remerciements - -Merci à tous les contributeurs qui rendent ce projet possible ! - ---- - -**Happy coding! 🚀** diff --git a/DEPLOYMENT.md b/DEPLOYMENT.md deleted file mode 100644 index 9b87240..0000000 --- a/DEPLOYMENT.md +++ /dev/null @@ -1,341 +0,0 @@ -# 🚀 Guide de déploiement - WalletTracker - -Ce guide explique comment déployer WalletTracker en production. - -## Prérequis - -- Compte Expo (gratuit) : https://expo.dev/ -- EAS CLI installé : `npm install -g eas-cli` -- Compte développeur Apple (pour iOS) ou Google Play (pour Android) - -## Étape 1 : Configuration EAS - -### Installer EAS CLI - -```bash -npm install -g eas-cli -``` - -### Se connecter à Expo - -```bash -eas login -``` - -### Initialiser EAS Build - -```bash -eas build:configure -``` - -Cela créera un fichier `eas.json` avec la configuration de build. - -## Étape 2 : Configurer les variables d'environnement - -### Pour la production - -Créez un fichier `.env.production` : - -```env -FIREBASE_API_KEY=votre_clé_production -FIREBASE_AUTH_DOMAIN=votre_domaine_production -FIREBASE_PROJECT_ID=votre_projet_production -FIREBASE_STORAGE_BUCKET=votre_bucket_production -FIREBASE_MESSAGING_SENDER_ID=votre_sender_id -FIREBASE_APP_ID=votre_app_id -``` - -### Configurer les secrets EAS - -```bash -eas secret:create --scope project --name FIREBASE_API_KEY --value "votre_clé" -eas secret:create --scope project --name FIREBASE_AUTH_DOMAIN --value "votre_domaine" -# ... répétez pour toutes les variables -``` - -## Étape 3 : Build pour iOS - -### Configuration - -1. Assurez-vous d'avoir un compte Apple Developer -2. Configurez votre Bundle Identifier dans `app.json` - -### Lancer le build - -```bash -# Build de développement -eas build --platform ios --profile development - -# Build de preview (TestFlight) -eas build --platform ios --profile preview - -# Build de production -eas build --platform ios --profile production -``` - -### Soumettre à l'App Store - -```bash -eas submit --platform ios -``` - -## Étape 4 : Build pour Android - -### Configuration - -1. Configurez votre package name dans `app.json` -2. Générez un keystore (EAS le fait automatiquement) - -### Lancer le build - -```bash -# Build de développement -eas build --platform android --profile development - -# Build de preview (Internal Testing) -eas build --platform android --profile preview - -# Build de production -eas build --platform android --profile production -``` - -### Soumettre à Google Play - -```bash -eas submit --platform android -``` - -## Étape 5 : Configuration eas.json - -Exemple de configuration complète : - -```json -{ - "cli": { - "version": ">= 5.0.0" - }, - "build": { - "development": { - "developmentClient": true, - "distribution": "internal", - "ios": { - "simulator": true - } - }, - "preview": { - "distribution": "internal", - "ios": { - "simulator": false - } - }, - "production": { - "env": { - "FIREBASE_API_KEY": "$FIREBASE_API_KEY", - "FIREBASE_AUTH_DOMAIN": "$FIREBASE_AUTH_DOMAIN", - "FIREBASE_PROJECT_ID": "$FIREBASE_PROJECT_ID", - "FIREBASE_STORAGE_BUCKET": "$FIREBASE_STORAGE_BUCKET", - "FIREBASE_MESSAGING_SENDER_ID": "$FIREBASE_MESSAGING_SENDER_ID", - "FIREBASE_APP_ID": "$FIREBASE_APP_ID" - } - } - }, - "submit": { - "production": { - "ios": { - "appleId": "votre@email.com", - "ascAppId": "1234567890", - "appleTeamId": "ABCD123456" - }, - "android": { - "serviceAccountKeyPath": "./google-service-account.json", - "track": "production" - } - } - } -} -``` - -## Étape 6 : Over-The-Air (OTA) Updates - -EAS Update permet de déployer des mises à jour sans passer par les stores. - -### Configurer EAS Update - -```bash -eas update:configure -``` - -### Publier une mise à jour - -```bash -# Pour la branche de production -eas update --branch production --message "Fix bug XYZ" - -# Pour la branche de preview -eas update --branch preview --message "New feature ABC" -``` - -## Étape 7 : Monitoring et Analytics - -### Sentry (erreurs) - -1. Créez un compte sur https://sentry.io/ -2. Installez le SDK : - -```bash -npm install @sentry/react-native -``` - -3. Configurez dans `App.tsx` : - -```typescript -import * as Sentry from '@sentry/react-native'; - -Sentry.init({ - dsn: 'votre_dsn_sentry', - enableInExpoDevelopment: false, - debug: false -}); -``` - -### Firebase Analytics - -Déjà inclus avec Firebase. Activez-le dans la console Firebase. - -## Étape 8 : Checklist avant déploiement - -### Code - -- [ ] Tous les tests passent -- [ ] Pas de console.log en production -- [ ] Variables d'environnement configurées -- [ ] Version incrémentée dans `app.json` -- [ ] Changelog mis à jour - -### Firebase - -- [ ] Règles Firestore en mode production -- [ ] Règles Storage configurées -- [ ] Quotas vérifiés -- [ ] Backup configuré -- [ ] Monitoring activé - -### App Stores - -- [ ] Screenshots préparés -- [ ] Description de l'app rédigée -- [ ] Politique de confidentialité publiée -- [ ] Conditions d'utilisation publiées -- [ ] Icône et splash screen finalisés - -### Sécurité - -- [ ] HTTPS uniquement -- [ ] Pas de secrets hardcodés -- [ ] Validation côté serveur (règles Firestore) -- [ ] Rate limiting configuré -- [ ] Authentification sécurisée - -## Étape 9 : Déploiement progressif - -### Phase 1 : Beta Testing (1-2 semaines) - -```bash -# Build preview -eas build --platform all --profile preview - -# Inviter des beta testeurs -eas build:list -``` - -### Phase 2 : Soft Launch (1 mois) - -- Déployer dans un pays test -- Monitorer les métriques -- Corriger les bugs critiques - -### Phase 3 : Production - -```bash -# Build production -eas build --platform all --profile production - -# Soumettre aux stores -eas submit --platform all -``` - -## Étape 10 : Post-déploiement - -### Monitoring - -- Surveiller les crashs (Sentry) -- Analyser les métriques (Firebase Analytics) -- Vérifier les performances (Firebase Performance) -- Lire les reviews utilisateurs - -### Mises à jour - -```bash -# Mise à jour mineure (bug fixes) -eas update --branch production --message "Bug fixes" - -# Mise à jour majeure (nouvelles fonctionnalités) -# Nécessite un nouveau build -eas build --platform all --profile production -``` - -## 📊 Métriques à surveiller - -- **DAU/MAU** : Utilisateurs actifs quotidiens/mensuels -- **Retention** : Taux de rétention à J1, J7, J30 -- **Crash rate** : Taux de crash < 1% -- **Performance** : Temps de chargement < 3s -- **Engagement** : Nombre de transactions par utilisateur - -## 🔧 Dépannage - -### Build échoue - -```bash -# Nettoyer le cache -eas build:cancel -eas build --clear-cache --platform all -``` - -### Update ne fonctionne pas - -```bash -# Vérifier la configuration -eas update:list --branch production -``` - -### Problèmes de certificats iOS - -```bash -# Régénérer les certificats -eas credentials -``` - -## 💰 Coûts estimés - -### Gratuit -- Expo (plan gratuit) : Builds limités -- Firebase (plan Spark) : Limité mais suffisant pour débuter - -### Payant -- Apple Developer : 99€/an -- Google Play : 25€ (une fois) -- Expo (plan Production) : ~29$/mois (builds illimités) -- Firebase (plan Blaze) : Pay-as-you-go - -## 📚 Ressources - -- [EAS Build Documentation](https://docs.expo.dev/build/introduction/) -- [EAS Submit Documentation](https://docs.expo.dev/submit/introduction/) -- [EAS Update Documentation](https://docs.expo.dev/eas-update/introduction/) -- [App Store Guidelines](https://developer.apple.com/app-store/review/guidelines/) -- [Google Play Guidelines](https://play.google.com/about/developer-content-policy/) - ---- - -**Bon déploiement ! 🎉** diff --git a/FIREBASE_SETUP.md b/FIREBASE_SETUP.md deleted file mode 100644 index 4e100f3..0000000 --- a/FIREBASE_SETUP.md +++ /dev/null @@ -1,158 +0,0 @@ -# 🔥 Guide de configuration Firebase - -Ce guide vous aidera à configurer Firebase pour WalletTracker. - -## Étape 1 : Créer un projet Firebase - -1. Allez sur [Firebase Console](https://console.firebase.google.com/) -2. Cliquez sur "Ajouter un projet" -3. Entrez le nom du projet : **WalletTracker** -4. Désactivez Google Analytics (optionnel) -5. Cliquez sur "Créer le projet" - -## Étape 2 : Ajouter une application Web - -1. Dans la console Firebase, cliquez sur l'icône **Web** () -2. Enregistrez l'application avec le nom : **WalletTracker** -3. Cochez "Configurer Firebase Hosting" (optionnel) -4. Cliquez sur "Enregistrer l'application" -5. **Copiez les identifiants de configuration** qui s'affichent - -## Étape 3 : Configurer l'application - -1. Ouvrez le fichier `src/config/firebase.ts` -2. Remplacez les valeurs par défaut par vos identifiants Firebase : - -```typescript -const firebaseConfig = { - apiKey: "AIzaSy...", // Votre clé API - authDomain: "wallettracker-xxx.firebaseapp.com", - projectId: "wallettracker-xxx", - storageBucket: "wallettracker-xxx.appspot.com", - messagingSenderId: "123456789", - appId: "1:123456789:web:abc123" -}; -``` - -## Étape 4 : Activer Authentication - -1. Dans la console Firebase, allez dans **Authentication** -2. Cliquez sur "Commencer" -3. Dans l'onglet **Sign-in method**, activez : - - **Email/Password** : Activez cette méthode - - Cliquez sur "Enregistrer" - -## Étape 5 : Créer la base de données Firestore - -1. Dans la console Firebase, allez dans **Firestore Database** -2. Cliquez sur "Créer une base de données" -3. Sélectionnez **Mode production** -4. Choisissez un emplacement (par exemple : `europe-west1` pour l'Europe) -5. Cliquez sur "Activer" - -## Étape 6 : Configurer les règles Firestore - -1. Dans Firestore Database, allez dans l'onglet **Règles** -2. Copiez le contenu du fichier `firestore.rules` de ce projet -3. Collez-le dans l'éditeur de règles Firebase -4. Cliquez sur "Publier" - -Les règles configurées permettent : -- ✅ Chaque utilisateur peut lire/écrire uniquement ses propres données -- ✅ Protection contre les accès non autorisés -- ✅ Validation des champs requis lors de la création - -## Étape 7 : Activer Storage (optionnel) - -Pour stocker les photos de tickets : - -1. Dans la console Firebase, allez dans **Storage** -2. Cliquez sur "Commencer" -3. Sélectionnez **Mode production** -4. Cliquez sur "Suivant" puis "Terminé" -5. Dans l'onglet **Règles**, utilisez ces règles : - -``` -rules_version = '2'; -service firebase.storage { - match /b/{bucket}/o { - match /users/{userId}/{allPaths=**} { - allow read, write: if request.auth != null && request.auth.uid == userId; - } - } -} -``` - -## Étape 8 : Créer les index Firestore (si nécessaire) - -Si vous rencontrez des erreurs de requête, Firebase vous fournira un lien pour créer automatiquement les index nécessaires. - -Les index recommandés : - -### Collection `transactions` -- Champs : `userId` (Ascending), `date` (Descending) -- Champs : `userId` (Ascending), `type` (Ascending), `date` (Descending) -- Champs : `userId` (Ascending), `category` (Ascending), `date` (Descending) - -### Collection `subscriptions` -- Champs : `userId` (Ascending), `nextPaymentDate` (Ascending) - -## Étape 9 : Tester la configuration - -1. Lancez l'application : `npm start` -2. Créez un compte de test -3. Vérifiez dans la console Firebase : - - **Authentication** : Votre utilisateur doit apparaître - - **Firestore** : Les collections doivent se créer automatiquement - -## 🔐 Sécurité - -### Bonnes pratiques - -1. **Ne jamais commiter vos identifiants Firebase** dans Git -2. Utilisez des variables d'environnement pour la production -3. Activez l'authentification à deux facteurs sur votre compte Firebase -4. Surveillez l'utilisation dans la console Firebase -5. Configurez des alertes de budget - -### Limites du plan gratuit (Spark) - -- **Firestore** : 1 Go de stockage, 50k lectures/jour, 20k écritures/jour -- **Authentication** : 10k vérifications/mois -- **Storage** : 5 Go de stockage, 1 Go de téléchargement/jour - -Pour une utilisation en production avec plusieurs utilisateurs, envisagez le plan **Blaze** (paiement à l'usage). - -## 🆘 Dépannage - -### Erreur : "Firebase: Error (auth/invalid-api-key)" -- Vérifiez que vous avez bien copié l'`apiKey` correctement -- Assurez-vous qu'il n'y a pas d'espaces avant/après - -### Erreur : "Missing or insufficient permissions" -- Vérifiez que les règles Firestore sont bien publiées -- Assurez-vous que l'utilisateur est bien authentifié - -### Les catégories ne s'affichent pas -- Vérifiez que l'utilisateur est connecté -- Les catégories par défaut se créent automatiquement au premier ajout de transaction - -## 📚 Ressources - -- [Documentation Firebase](https://firebase.google.com/docs) -- [Firestore Security Rules](https://firebase.google.com/docs/firestore/security/get-started) -- [Firebase Authentication](https://firebase.google.com/docs/auth) -- [React Native Firebase](https://rnfirebase.io/) - -## ✅ Checklist de configuration - -- [ ] Projet Firebase créé -- [ ] Application Web ajoutée -- [ ] Identifiants copiés dans `firebase.ts` -- [ ] Authentication activée (Email/Password) -- [ ] Firestore Database créée -- [ ] Règles Firestore configurées -- [ ] Storage activé (optionnel) -- [ ] Application testée avec succès - -Une fois toutes ces étapes complétées, votre application WalletTracker est prête à être utilisée ! 🎉 diff --git a/NEXT_STEPS.md b/NEXT_STEPS.md deleted file mode 100644 index 29c5beb..0000000 --- a/NEXT_STEPS.md +++ /dev/null @@ -1,278 +0,0 @@ -# 🎯 Prochaines étapes - WalletTracker - -Félicitations ! Votre application WalletTracker est prête. Voici les étapes pour la lancer. - -## ✅ Ce qui a été fait - -### Architecture complète -- ✅ Projet Expo avec TypeScript configuré -- ✅ Structure de dossiers organisée (screens, components, services, types, utils) -- ✅ Navigation avec React Navigation (Stack + Bottom Tabs) -- ✅ Intégration Firebase (Auth, Firestore, Storage) - -### Fonctionnalités implémentées -- ✅ Authentification (Signup, Login, Logout) -- ✅ Dashboard avec statistiques mensuelles -- ✅ Gestion des transactions (dépenses et revenus) -- ✅ Gestion des abonnements récurrents -- ✅ Analyses avec graphiques par catégorie -- ✅ Synchronisation temps réel -- ✅ Catégories personnalisables avec icônes - -### Composants réutilisables -- ✅ Button (3 variantes) -- ✅ InputText (avec validation) -- ✅ TransactionCard -- ✅ SubscriptionCard - -### Documentation -- ✅ README.md complet -- ✅ QUICKSTART.md -- ✅ FIREBASE_SETUP.md -- ✅ TESTING.md -- ✅ DEPLOYMENT.md -- ✅ CONTRIBUTING.md -- ✅ CHANGELOG.md - -## 🚀 Pour démarrer MAINTENANT - -### 1. Configurer Firebase (15 minutes) - -**C'est l'étape la plus importante !** - -```bash -# Ouvrez le guide -open FIREBASE_SETUP.md -``` - -**Résumé rapide :** -1. Allez sur https://console.firebase.google.com/ -2. Créez un projet "WalletTracker" -3. Ajoutez une application Web -4. Copiez les identifiants dans `src/config/firebase.ts` -5. Activez Authentication (Email/Password) -6. Créez Firestore Database -7. Copiez les règles depuis `firestore.rules` - -### 2. Lancer l'application (2 minutes) - -```bash -# Dans le terminal -npm start -``` - -Scannez le QR code avec **Expo Go** sur votre téléphone. - -### 3. Tester l'application (10 minutes) - -1. Créez un compte -2. Ajoutez quelques transactions -3. Créez un abonnement -4. Consultez les analyses - -**Astuce :** Utilisez le guide `TESTING.md` pour une checklist complète. - -## 📱 Commandes utiles - -```bash -# Lancer l'app -npm start - -# Lancer sur iOS (Mac uniquement) -npm run ios - -# Lancer sur Android -npm run android - -# Nettoyer le cache -npm start -- --clear -``` - -## 🎨 Personnalisation - -### Changer les couleurs - -Éditez `src/utils/constants.ts` : - -```typescript -export const COLORS = { - primary: '#4A90E2', // Changez cette couleur - // ... -}; -``` - -### Ajouter des catégories - -Éditez `src/services/categoryService.ts` : - -```typescript -export const DEFAULT_CATEGORIES = [ - { name: 'Ma catégorie', icon: '🎯', color: '#FF6B6B', type: 'expense' }, - // ... -]; -``` - -### Modifier le logo - -Remplacez les fichiers dans le dossier `assets/` : -- `icon.png` (1024x1024) -- `splash-icon.png` (1284x2778) -- `adaptive-icon.png` (1024x1024) - -## 🐛 Problèmes courants - -### "Firebase: Error (auth/invalid-api-key)" -➡️ Vérifiez que vous avez bien copié les identifiants Firebase dans `src/config/firebase.ts` - -### L'app ne se lance pas -```bash -rm -rf node_modules -npm install -npm start -- --clear -``` - -### Les transactions ne s'affichent pas -➡️ Vérifiez que les règles Firestore sont bien configurées - -### Erreur TypeScript -➡️ Redémarrez le serveur de développement - -## 📚 Apprendre le code - -### Structure du projet - -``` -src/ -├── screens/ # Les écrans de l'app -│ ├── LoginScreen.tsx -│ ├── DashboardScreen.tsx -│ └── ... -├── components/ # Composants réutilisables -├── services/ # Logique Firebase -├── navigation/ # Configuration navigation -└── utils/ # Fonctions utilitaires -``` - -### Ajouter un nouvel écran - -1. Créez `src/screens/MonNouvelEcran.tsx` -2. Ajoutez-le dans `src/navigation/AppNavigator.tsx` -3. Créez un bouton pour naviguer vers cet écran - -### Ajouter une nouvelle fonctionnalité - -1. Créez le service dans `src/services/` -2. Créez les types dans `src/types/` -3. Créez l'écran dans `src/screens/` -4. Testez ! - -## 🚀 Déployer en production - -Quand vous serez prêt : - -```bash -# Lire le guide complet -open DEPLOYMENT.md - -# Installer EAS CLI -npm install -g eas-cli - -# Se connecter -eas login - -# Configurer -eas build:configure - -# Build iOS -eas build --platform ios - -# Build Android -eas build --platform android -``` - -## 🎯 Fonctionnalités à ajouter (idées) - -### Court terme -- [ ] Modifier/Supprimer une transaction -- [ ] Filtrer les transactions par catégorie -- [ ] Rechercher dans les transactions -- [ ] Ajouter une photo de ticket - -### Moyen terme -- [ ] Partage multi-utilisateurs (avec votre copine) -- [ ] Notifications pour les abonnements -- [ ] Export PDF/CSV -- [ ] Objectifs budgétaires - -### Long terme -- [ ] Mode sombre -- [ ] Support multilingue -- [ ] Widgets -- [ ] OCR pour les tickets -- [ ] Statistiques avancées - -## 💡 Conseils de développement - -### Tester rapidement -```bash -# Générer des données de test -# Ajoutez dans DashboardScreen.tsx : -import { generateAllSampleData } from '../utils/sampleData'; - -// Dans un useEffect : -// generateAllSampleData(user.uid); -``` - -### Déboguer -- Secouez votre téléphone pour ouvrir le menu dev -- Activez "Debug Remote JS" -- Utilisez `console.log()` pour déboguer - -### Performance -- Utilisez React DevTools -- Activez "Show Perf Monitor" dans le menu dev - -## 📞 Ressources - -### Documentation -- [Expo Docs](https://docs.expo.dev/) -- [React Native Docs](https://reactnative.dev/) -- [Firebase Docs](https://firebase.google.com/docs) -- [React Navigation](https://reactnavigation.org/) - -### Communauté -- [Expo Discord](https://chat.expo.dev/) -- [React Native Community](https://www.reactnative.dev/community/overview) -- [Stack Overflow](https://stackoverflow.com/questions/tagged/react-native) - -## ✨ Améliorations suggérées - -### UX/UI -- Ajouter des animations (react-native-reanimated) -- Améliorer les transitions entre écrans -- Ajouter des haptic feedbacks -- Créer un onboarding pour les nouveaux utilisateurs - -### Fonctionnalités -- Ajouter des graphiques de tendance -- Créer des budgets par catégorie -- Ajouter des rappels personnalisés -- Implémenter la recherche vocale - -### Technique -- Ajouter des tests unitaires (Jest) -- Ajouter des tests E2E (Detox) -- Implémenter le caching offline -- Ajouter Sentry pour le monitoring - -## 🎉 Félicitations ! - -Vous avez maintenant une application complète de gestion de budget ! - -**Prochaine étape :** Configurez Firebase et lancez l'app ! 🚀 - ---- - -**Des questions ?** Consultez les fichiers de documentation ou créez une issue sur GitHub. - -**Bon développement ! 💪** diff --git a/PROJECT_SUMMARY.md b/PROJECT_SUMMARY.md deleted file mode 100644 index c8526f7..0000000 --- a/PROJECT_SUMMARY.md +++ /dev/null @@ -1,314 +0,0 @@ -# 📊 Résumé du projet WalletTracker - -## 🎯 Vue d'ensemble - -**WalletTracker** est une application mobile complète de gestion de budget développée avec React Native et Firebase, permettant de suivre ses revenus, dépenses et abonnements avec synchronisation en temps réel. - -## 📱 Fonctionnalités principales - -### ✅ Implémentées (v1.0.0) - -1. **Authentification sécurisée** - - Inscription/Connexion avec email et mot de passe - - Persistance de session - - Messages d'erreur en français - -2. **Dashboard interactif** - - Vue mensuelle du budget - - Solde en temps réel - - Statistiques (revenus, dépenses, balance) - - 5 dernières transactions - - Boutons d'action rapide - -3. **Gestion des transactions** - - Ajout de dépenses et revenus - - 15 catégories par défaut (personnalisables) - - Notes et dates - - Liste complète avec tri - - Synchronisation temps réel - -4. **Gestion des abonnements** - - Abonnements récurrents (quotidien, hebdo, mensuel, annuel) - - Calcul automatique des prochains paiements - - Alertes visuelles (< 3 jours) - - Total mensuel calculé - -5. **Analyses visuelles** - - Graphiques en camembert - - Statistiques par catégorie - - Sélection du mois - - Basculement dépenses/revenus - - Pourcentages et totaux - -## 🏗️ Architecture technique - -### Stack technologique - -``` -Frontend: -├── React Native 0.81.5 -├── Expo SDK 54 -├── TypeScript 5.9 -└── React Navigation 7 - -Backend: -├── Firebase Authentication -├── Cloud Firestore -└── Firebase Storage - -Librairies: -├── react-native-chart-kit (graphiques) -├── AsyncStorage (stockage local) -└── expo-image-picker (photos) -``` - -### Structure du projet - -``` -WalletTracker/ -├── 📱 src/ -│ ├── components/ # 4 composants réutilisables -│ │ ├── Button.tsx -│ │ ├── InputText.tsx -│ │ ├── TransactionCard.tsx -│ │ └── SubscriptionCard.tsx -│ │ -│ ├── config/ # Configuration -│ │ └── firebase.ts -│ │ -│ ├── hooks/ # Custom hooks -│ │ └── useAuth.ts -│ │ -│ ├── navigation/ # Navigation -│ │ └── AppNavigator.tsx -│ │ -│ ├── screens/ # 6 écrans -│ │ ├── LoginScreen.tsx -│ │ ├── SignupScreen.tsx -│ │ ├── DashboardScreen.tsx -│ │ ├── TransactionScreen.tsx -│ │ ├── SubscriptionScreen.tsx -│ │ └── AnalysisScreen.tsx -│ │ -│ ├── services/ # 4 services Firebase -│ │ ├── authService.ts -│ │ ├── transactionService.ts -│ │ ├── subscriptionService.ts -│ │ └── categoryService.ts -│ │ -│ ├── types/ # Types TypeScript -│ │ └── index.ts -│ │ -│ └── utils/ # Utilitaires -│ ├── constants.ts -│ ├── helpers.ts -│ └── sampleData.ts -│ -├── 📚 Documentation/ -│ ├── README.md # Documentation principale -│ ├── QUICKSTART.md # Démarrage rapide (5 min) -│ ├── FIREBASE_SETUP.md # Configuration Firebase -│ ├── TESTING.md # Guide de test complet -│ ├── DEPLOYMENT.md # Guide de déploiement -│ ├── CONTRIBUTING.md # Guide de contribution -│ ├── CHANGELOG.md # Historique des versions -│ └── NEXT_STEPS.md # Prochaines étapes -│ -├── 🔧 Configuration/ -│ ├── app.json # Config Expo -│ ├── package.json # Dépendances -│ ├── tsconfig.json # Config TypeScript -│ ├── firestore.rules # Règles de sécurité -│ └── .env.example # Variables d'environnement -│ -└── App.tsx # Point d'entrée -``` - -## 📊 Statistiques du projet - -### Code - -- **Total de fichiers** : 35+ fichiers -- **Lignes de code** : ~6000+ lignes -- **Composants React** : 10 composants -- **Services** : 4 services Firebase -- **Écrans** : 6 écrans principaux -- **Types TypeScript** : 100% typé - -### Documentation - -- **Fichiers markdown** : 8 guides -- **Pages de documentation** : ~50 pages -- **Exemples de code** : 30+ exemples - -## 🎨 Design System - -### Couleurs principales - -```typescript -Primary: #4A90E2 // Bleu -Success: #52C41A // Vert (revenus) -Danger: #FF6B6B // Rouge (dépenses) -Warning: #FFA07A // Orange (alertes) -Light: #F8F9FA // Fond -Dark: #333 // Texte -``` - -### Composants UI - -- **Button** : 3 variantes (primary, secondary, outline) -- **InputText** : Validation intégrée -- **Cards** : TransactionCard, SubscriptionCard -- **Navigation** : Bottom tabs avec icônes - -## 🔐 Sécurité - -### Implémentée - -✅ Authentification Firebase -✅ Règles Firestore (protection des données) -✅ Validation côté client -✅ Stockage sécurisé des tokens -✅ HTTPS uniquement -✅ Pas de secrets hardcodés - -### Base de données - -``` -Collections Firestore: -├── users/ # Profils utilisateurs -├── transactions/ # Toutes les transactions -├── categories/ # Catégories personnalisées -└── subscriptions/ # Abonnements récurrents -``` - -## 📈 Fonctionnalités futures - -### Priorité haute (v1.1.0) - -- [ ] Modifier/Supprimer une transaction -- [ ] Filtrer les transactions -- [ ] Recherche dans les transactions -- [ ] Upload de photos de tickets - -### Priorité moyenne (v1.2.0) - -- [ ] Notifications push (abonnements) -- [ ] Partage multi-utilisateurs -- [ ] Export PDF/CSV -- [ ] Objectifs budgétaires - -### Priorité basse (v2.0.0) - -- [ ] Mode sombre -- [ ] Support multilingue -- [ ] Widgets -- [ ] OCR pour tickets -- [ ] Statistiques avancées - -## 🚀 Déploiement - -### Environnements - -``` -Development → Expo Go (test local) -Preview → TestFlight / Internal Testing -Production → App Store / Google Play -``` - -### Plateformes supportées - -✅ iOS 13+ -✅ Android 8.0+ -✅ Web (via Expo) - -## 📦 Dépendances principales - -```json -{ - "firebase": "^12.4.0", - "react-navigation": "^7.x", - "react-native-chart-kit": "^6.12.0", - "expo-image-picker": "^17.0.8", - "@react-native-async-storage/async-storage": "^1.24.0" -} -``` - -## 🎯 Métriques de qualité - -### Code Quality - -- ✅ 100% TypeScript -- ✅ Composants modulaires -- ✅ Services séparés -- ✅ Types explicites -- ✅ Code commenté - -### Documentation - -- ✅ README complet -- ✅ Guides de démarrage -- ✅ Guide de contribution -- ✅ Changelog -- ✅ Exemples de code - -### Tests - -- ⏳ Tests unitaires (à venir) -- ⏳ Tests E2E (à venir) -- ✅ Guide de test manuel - -## 💡 Points forts - -1. **Architecture solide** : Structure claire et modulaire -2. **TypeScript** : Code type-safe et maintenable -3. **Firebase** : Backend scalable et temps réel -4. **Documentation** : Guides complets pour tous les cas -5. **UI/UX** : Interface moderne et intuitive -6. **Sécurité** : Règles Firestore et validation -7. **Extensible** : Facile d'ajouter de nouvelles fonctionnalités - -## 🎓 Ce que vous avez appris - -En développant ce projet, vous maîtrisez maintenant : - -- ✅ React Native avec Expo -- ✅ TypeScript avancé -- ✅ Firebase (Auth, Firestore, Storage) -- ✅ React Navigation -- ✅ Gestion d'état avec Hooks -- ✅ Synchronisation temps réel -- ✅ Architecture d'application mobile -- ✅ Sécurité et règles Firestore - -## 📞 Support - -### Documentation - -- Tous les guides sont dans le dossier racine -- Commencez par `NEXT_STEPS.md` -- Consultez `QUICKSTART.md` pour démarrer rapidement - -### Ressources - -- [Expo Docs](https://docs.expo.dev/) -- [Firebase Docs](https://firebase.google.com/docs) -- [React Navigation](https://reactnavigation.org/) - -## 🎉 Conclusion - -**WalletTracker v1.0.0** est une application complète, professionnelle et prête à l'emploi pour la gestion de budget personnel. - -### Prochaines étapes recommandées - -1. **Configurer Firebase** (15 min) → `FIREBASE_SETUP.md` -2. **Lancer l'app** (2 min) → `npm start` -3. **Tester** (10 min) → `TESTING.md` -4. **Personnaliser** → Modifier les couleurs, catégories, etc. -5. **Déployer** → `DEPLOYMENT.md` - ---- - -**Développé avec ❤️ pour une meilleure gestion de budget** - -Version: 1.0.0 | Date: 23 octobre 2025 | Statut: ✅ Production Ready diff --git a/QUICKSTART.md b/QUICKSTART.md deleted file mode 100644 index f7c5b7b..0000000 --- a/QUICKSTART.md +++ /dev/null @@ -1,149 +0,0 @@ -# 🚀 Démarrage rapide - WalletTracker - -Guide pour lancer l'application en 5 minutes. - -## Étape 1 : Vérifier les prérequis - -```bash -# Vérifier Node.js (v16+) -node --version - -# Vérifier npm -npm --version -``` - -## Étape 2 : Installer les dépendances - -```bash -cd WalletTracker -npm install -``` - -## Étape 3 : Configurer Firebase - -### Option A : Configuration rapide (pour tester) - -1. Allez sur https://console.firebase.google.com/ -2. Créez un nouveau projet "WalletTracker" -3. Ajoutez une application Web -4. Copiez les identifiants dans `src/config/firebase.ts` - -### Option B : Configuration complète - -Suivez le guide détaillé dans `FIREBASE_SETUP.md` - -## Étape 4 : Lancer l'application - -```bash -npm start -``` - -Vous verrez un QR code s'afficher dans le terminal. - -## Étape 5 : Tester sur votre téléphone - -### Sur iOS ou Android : - -1. Téléchargez **Expo Go** depuis l'App Store ou Google Play -2. Ouvrez Expo Go -3. Scannez le QR code affiché dans le terminal -4. L'application se chargera automatiquement - -### Sur émulateur : - -**iOS (Mac uniquement)** : -```bash -npm run ios -``` - -**Android** : -```bash -npm run android -``` - -## 🎉 C'est prêt ! - -Vous devriez voir l'écran de connexion de WalletTracker. - -### Première utilisation : - -1. Cliquez sur **"Créer un compte"** -2. Remplissez le formulaire : - - Nom : Votre nom - - Email : votre@email.com - - Mot de passe : minimum 6 caractères -3. Cliquez sur **"Créer mon compte"** -4. Vous êtes redirigé vers le Dashboard ! - -### Ajouter votre première transaction : - -1. Cliquez sur le bouton **"Dépense"** ou **"Revenu"** -2. Entrez le montant -3. Sélectionnez une catégorie -4. Ajoutez une note (optionnel) -5. Cliquez sur **"Ajouter la transaction"** - -## 📱 Commandes utiles - -```bash -# Lancer l'application -npm start - -# Lancer sur iOS -npm run ios - -# Lancer sur Android -npm run android - -# Lancer sur le web -npm run web - -# Nettoyer le cache -npm start -- --clear -``` - -## 🐛 Problèmes courants - -### L'application ne se lance pas - -```bash -# Nettoyer et réinstaller -rm -rf node_modules -npm install -npm start -- --clear -``` - -### Erreur Firebase - -Vérifiez que vous avez bien : -- Copié les identifiants Firebase dans `src/config/firebase.ts` -- Activé Authentication (Email/Password) dans Firebase Console -- Créé la base de données Firestore - -### QR code ne fonctionne pas - -- Assurez-vous que votre téléphone et ordinateur sont sur le même réseau Wi-Fi -- Essayez de scanner avec l'appareil photo puis ouvrir avec Expo Go -- Utilisez le mode tunnel : `npm start -- --tunnel` - -## 📚 Prochaines étapes - -- Lisez le `README.md` pour comprendre l'architecture -- Consultez `FIREBASE_SETUP.md` pour la configuration complète -- Utilisez `TESTING.md` pour tester toutes les fonctionnalités - -## 💡 Conseils - -- **Développement** : Utilisez `npm start` et Expo Go pour un rechargement rapide -- **Production** : Utilisez EAS Build pour créer des binaires iOS/Android -- **Débogage** : Secouez votre téléphone pour ouvrir le menu de développement - -## 🆘 Besoin d'aide ? - -- Documentation Expo : https://docs.expo.dev/ -- Documentation Firebase : https://firebase.google.com/docs -- React Native : https://reactnative.dev/docs/getting-started - ---- - -**Bon développement ! 💪** diff --git a/QUICK_FIX.md b/QUICK_FIX.md deleted file mode 100644 index 3aa988d..0000000 --- a/QUICK_FIX.md +++ /dev/null @@ -1,135 +0,0 @@ -# ⚡ Corrections rapides - WalletTracker - -## 🔴 L'app reste bloquée sur "New update available, downloading..." - -### Solution rapide (30 secondes) - -1. **Sur votre téléphone** : - - Fermez complètement Expo Go (swipe up) - - Rouvrez Expo Go - - Rescannez le QR code - -2. **Si ça ne marche toujours pas** : - - Secouez le téléphone - - Appuyez sur "Go Home" - - Rescannez le QR code - -3. **Dernière option** : - - Dans Expo Go : Profil (en bas à droite) → Settings → Clear cache - - Rescannez le QR code - -### Solution définitive (appliquée) - -J'ai désactivé les mises à jour automatiques dans `app.json`. - -**Redémarrez le serveur** : -```bash -# Arrêtez le serveur (Ctrl+C) -npm start -- --clear -``` - -Puis **rescannez le QR code**. - -## 🔴 Écran blanc / App ne charge pas - -### 1. Vérifier le serveur Metro - -Dans le terminal, vous devez voir : -``` -› Metro waiting on exp://192.168.1.132:8081 -``` - -Si ce n'est pas le cas : -```bash -npm start -- --clear -``` - -### 2. Vérifier la connexion réseau - -- Téléphone et ordinateur sur le **même Wi-Fi** -- Pas de VPN actif -- Pare-feu autorise Expo (port 8081) - -### 3. Mode tunnel (si problème réseau) - -```bash -npm start -- --tunnel -``` -⚠️ Plus lent mais fonctionne même avec des réseaux différents - -## 🔴 Erreur "Unable to resolve module" - -```bash -# Nettoyer complètement -rm -rf node_modules -npm install -npm start -- --clear -``` - -## 🔴 Erreur Firebase - -Vérifiez `src/config/firebase.ts` : -- Les identifiants sont corrects -- Authentication est activée dans Firebase Console -- Firestore Database est créée - -## 🔴 L'app crash au démarrage - -1. **Regardez les logs** dans le terminal -2. **Vérifiez les erreurs** : - - Erreur Firebase → Configurez Firebase - - Erreur de module → Nettoyez le cache - - Erreur de syntaxe → Vérifiez le dernier commit - -## 🔴 Bouton qui charge à l'infini - -C'est corrigé ! Si ça persiste : -```bash -# Rechargez l'app -# Secouez le téléphone > Reload -``` - -## 🔴 Les modifications ne s'appliquent pas - -1. **Rechargement à chaud désactivé** : - - Secouez le téléphone - - Appuyez sur "Enable Fast Refresh" - -2. **Forcer le rechargement** : - - Secouez le téléphone - - Appuyez sur "Reload" - -3. **Nettoyer le cache** : - ```bash - npm start -- --clear - ``` - -## 📱 Commandes utiles - -```bash -# Démarrage normal -npm start - -# Avec cache nettoyé -npm start -- --clear - -# Mode tunnel (problèmes réseau) -npm start -- --tunnel - -# Réinstaller les dépendances -rm -rf node_modules && npm install -``` - -## 🆘 Toujours bloqué ? - -1. **Vérifiez les logs** dans le terminal -2. **Consultez** `TROUBLESHOOTING.md` pour plus de détails -3. **Redémarrez tout** : - - Fermez Expo Go - - Arrêtez le serveur (Ctrl+C) - - Relancez : `npm start -- --clear` - - Rescannez le QR code - ---- - -**Dans 99% des cas, un simple rechargement suffit ! 🚀** diff --git a/TESTING.md b/TESTING.md deleted file mode 100644 index d8edf78..0000000 --- a/TESTING.md +++ /dev/null @@ -1,243 +0,0 @@ -# 🧪 Guide de test - WalletTracker - -Ce guide vous aidera à tester toutes les fonctionnalités de l'application. - -## Prérequis - -- Firebase configuré (voir `FIREBASE_SETUP.md`) -- Application lancée avec `npm start` -- Téléphone avec Expo Go ou émulateur - -## 📋 Checklist de tests - -### 1. Authentification - -#### Test d'inscription -- [ ] Ouvrir l'application -- [ ] Cliquer sur "Créer un compte" -- [ ] Tester les validations : - - [ ] Champ nom vide → Erreur affichée - - [ ] Email invalide → Erreur affichée - - [ ] Mot de passe < 6 caractères → Erreur affichée - - [ ] Mots de passe différents → Erreur affichée -- [ ] Remplir tous les champs correctement -- [ ] Créer le compte -- [ ] Vérifier la redirection vers le Dashboard - -#### Test de connexion -- [ ] Se déconnecter -- [ ] Cliquer sur "J'ai déjà un compte" -- [ ] Tester les validations : - - [ ] Email vide → Erreur affichée - - [ ] Mot de passe vide → Erreur affichée - - [ ] Mauvais identifiants → Message d'erreur -- [ ] Se connecter avec les bons identifiants -- [ ] Vérifier la redirection vers le Dashboard - -#### Test de persistance -- [ ] Se connecter -- [ ] Fermer complètement l'application -- [ ] Rouvrir l'application -- [ ] Vérifier que l'utilisateur est toujours connecté - -### 2. Dashboard - -#### Affichage initial -- [ ] Vérifier l'affichage du message de bienvenue -- [ ] Vérifier l'affichage du mois actuel -- [ ] Vérifier que le solde est à 0€ -- [ ] Vérifier que les revenus sont à 0€ -- [ ] Vérifier que les dépenses sont à 0€ -- [ ] Vérifier l'affichage de l'état vide - -#### Après ajout de transactions -- [ ] Ajouter quelques transactions -- [ ] Revenir au Dashboard -- [ ] Vérifier que les statistiques sont mises à jour -- [ ] Vérifier que les 5 dernières transactions s'affichent -- [ ] Vérifier le calcul du solde (revenus - dépenses) - -#### Pull to refresh -- [ ] Tirer vers le bas pour rafraîchir -- [ ] Vérifier que les données se rechargent - -### 3. Transactions - -#### Ajout d'une dépense -- [ ] Aller dans l'onglet "Transactions" -- [ ] Cliquer sur "+ Ajouter" -- [ ] Sélectionner "Dépense" -- [ ] Tester les validations : - - [ ] Montant vide → Erreur - - [ ] Montant = 0 → Erreur - - [ ] Catégorie non sélectionnée → Erreur -- [ ] Entrer un montant valide (ex: 50.00) -- [ ] Sélectionner une catégorie (ex: Courses) -- [ ] Ajouter une note (optionnel) -- [ ] Cliquer sur "Ajouter la transaction" -- [ ] Vérifier que la transaction apparaît dans la liste -- [ ] Vérifier l'affichage en rouge avec le signe "-" - -#### Ajout d'un revenu -- [ ] Cliquer sur "+ Ajouter" -- [ ] Sélectionner "Revenu" -- [ ] Entrer un montant (ex: 2000.00) -- [ ] Sélectionner une catégorie (ex: Salaire) -- [ ] Ajouter une note -- [ ] Cliquer sur "Ajouter la transaction" -- [ ] Vérifier que la transaction apparaît dans la liste -- [ ] Vérifier l'affichage en vert avec le signe "+" - -#### Liste des transactions -- [ ] Vérifier que les transactions sont triées par date (plus récentes en premier) -- [ ] Vérifier l'affichage des icônes de catégorie -- [ ] Vérifier l'affichage des couleurs par catégorie -- [ ] Vérifier l'affichage de la date formatée -- [ ] Vérifier l'affichage de la note si présente - -### 4. Abonnements - -#### Ajout d'un abonnement -- [ ] Aller dans l'onglet "Abonnements" -- [ ] Cliquer sur "+ Ajouter" -- [ ] Tester les validations : - - [ ] Nom vide → Erreur - - [ ] Montant vide → Erreur - - [ ] Jour invalide → Erreur -- [ ] Entrer un nom (ex: Netflix) -- [ ] Entrer un montant (ex: 15.99) -- [ ] Sélectionner "Mensuel" -- [ ] Entrer un jour du mois (ex: 15) -- [ ] Sélectionner une catégorie (ex: Abonnements) -- [ ] Cliquer sur "Ajouter l'abonnement" -- [ ] Vérifier que l'abonnement apparaît dans la liste - -#### Affichage des abonnements -- [ ] Vérifier l'affichage du nom -- [ ] Vérifier l'affichage du montant -- [ ] Vérifier l'affichage de la fréquence -- [ ] Vérifier l'affichage de la prochaine date de paiement -- [ ] Vérifier l'affichage du nombre de jours restants - -#### Abonnement proche -- [ ] Créer un abonnement avec une date dans 2 jours -- [ ] Vérifier que la carte a une bordure orange -- [ ] Vérifier que le texte est en rouge - -#### Total mensuel -- [ ] Ajouter plusieurs abonnements -- [ ] Vérifier que le total mensuel est correct -- [ ] Tester avec différentes fréquences (hebdo, mensuel, annuel) - -### 5. Analyses - -#### Sélection du mois -- [ ] Aller dans l'onglet "Analyses" -- [ ] Cliquer sur la flèche gauche -- [ ] Vérifier le changement de mois -- [ ] Cliquer sur la flèche droite -- [ ] Vérifier le changement de mois - -#### Basculer entre dépenses et revenus -- [ ] Cliquer sur "Dépenses" -- [ ] Vérifier l'affichage du graphique des dépenses -- [ ] Cliquer sur "Revenus" -- [ ] Vérifier l'affichage du graphique des revenus - -#### Graphique en camembert -- [ ] Ajouter plusieurs transactions dans différentes catégories -- [ ] Vérifier l'affichage du graphique -- [ ] Vérifier les couleurs par catégorie -- [ ] Vérifier les montants affichés - -#### Statistiques par catégorie -- [ ] Vérifier l'affichage de chaque catégorie -- [ ] Vérifier le montant total par catégorie -- [ ] Vérifier le nombre de transactions -- [ ] Vérifier le pourcentage -- [ ] Vérifier le tri par montant décroissant - -#### État vide -- [ ] Sélectionner un mois sans transactions -- [ ] Vérifier l'affichage de l'état vide - -### 6. Navigation - -#### Onglets -- [ ] Tester la navigation entre tous les onglets -- [ ] Vérifier que l'onglet actif est bien mis en évidence -- [ ] Vérifier que les icônes changent de couleur - -#### Boutons d'action rapide (Dashboard) -- [ ] Cliquer sur "Dépense" -- [ ] Vérifier la navigation vers Transactions avec le type pré-sélectionné -- [ ] Cliquer sur "Revenu" -- [ ] Vérifier la navigation vers Transactions avec le type pré-sélectionné - -### 7. Synchronisation temps réel - -#### Test avec deux appareils (si possible) -- [ ] Se connecter avec le même compte sur deux appareils -- [ ] Ajouter une transaction sur l'appareil 1 -- [ ] Vérifier que la transaction apparaît sur l'appareil 2 -- [ ] Ajouter un abonnement sur l'appareil 2 -- [ ] Vérifier que l'abonnement apparaît sur l'appareil 1 - -#### Test de mise à jour en temps réel -- [ ] Ouvrir le Dashboard -- [ ] Dans un autre onglet, ajouter une transaction -- [ ] Revenir au Dashboard -- [ ] Vérifier que les statistiques sont mises à jour - -### 8. Déconnexion - -- [ ] Cliquer sur "Déconnexion" dans le Dashboard -- [ ] Vérifier la redirection vers l'écran de connexion -- [ ] Vérifier que les données ne sont plus accessibles - -### 9. Tests de performance - -#### Chargement initial -- [ ] Mesurer le temps de chargement de l'application -- [ ] Vérifier qu'il n'y a pas de lag - -#### Avec beaucoup de données -- [ ] Ajouter 50+ transactions -- [ ] Vérifier que la liste défile correctement -- [ ] Vérifier que les graphiques se chargent rapidement - -### 10. Tests d'erreur - -#### Pas de connexion Internet -- [ ] Désactiver le Wi-Fi et les données mobiles -- [ ] Essayer de se connecter -- [ ] Vérifier le message d'erreur -- [ ] Essayer d'ajouter une transaction -- [ ] Vérifier le message d'erreur - -#### Firebase non configuré -- [ ] Vérifier le message d'erreur si Firebase n'est pas configuré - -## 🐛 Bugs connus - -Notez ici les bugs découverts pendant les tests : - -1. -2. -3. - -## ✅ Résultat des tests - -- Date du test : ___________ -- Version testée : 1.0.0 -- Testeur : ___________ -- Appareil : ___________ -- Résultat global : ⬜ Réussi / ⬜ Échec - -## 📝 Notes - -Ajoutez vos observations ici : - ---- - -**Bon test ! 🚀** diff --git a/TROUBLESHOOTING.md b/TROUBLESHOOTING.md deleted file mode 100644 index 250b541..0000000 --- a/TROUBLESHOOTING.md +++ /dev/null @@ -1,124 +0,0 @@ -# 🔧 Guide de dépannage - WalletTracker - -## Problème : L'app charge jusqu'au timeout après scan du QR code - -### ✅ Solutions appliquées - -1. **Mise à jour des dépendances incompatibles** - ```bash - npx expo install --fix - ``` - -2. **Configuration Metro améliorée** - - Ajout de `metro.config.js` avec timeout augmenté - - Optimisation du bundler - -3. **Graphiques temporairement désactivés** - - `react-native-chart-kit` peut causer des problèmes de chargement - - Remplacé par un placeholder dans `AnalysisScreen` - - Sera réactivé après configuration complète - -### 🚀 Relancer l'application - -```bash -# Nettoyer le cache -npm start -- --clear - -# Ou redémarrer complètement -rm -rf node_modules -npm install -npm start -- --clear -``` - -### 📱 Vérifications réseau - -1. **Même réseau Wi-Fi** - - Votre ordinateur et téléphone doivent être sur le même réseau - - Désactivez les VPN si actifs - -2. **Pare-feu** - - Autorisez Expo dans votre pare-feu - - Port 8081 doit être ouvert - -3. **Mode tunnel (si problème réseau)** - ```bash - npm start -- --tunnel - ``` - ⚠️ Plus lent mais fonctionne même avec des réseaux différents - -### 🔍 Diagnostic - -Si le problème persiste, vérifiez : - -```bash -# 1. Vérifier la connexion -ping 192.168.1.132 - -# 2. Vérifier que Metro tourne -# Vous devriez voir "Metro waiting on exp://..." - -# 3. Tester sur le web d'abord -npm run web -``` - -### 📊 Réactiver les graphiques (plus tard) - -Une fois l'app fonctionnelle, pour réactiver les graphiques : - -1. Installer les dépendances natives : - ```bash - npx expo install react-native-svg - ``` - -2. Dans `src/screens/AnalysisScreen.tsx` : - - Décommenter `import { PieChart } from 'react-native-chart-kit'` - - Remplacer le placeholder par `` - -3. Rebuild l'app - -### 🆘 Autres problèmes courants - -#### Erreur "Unable to resolve module" -```bash -npm start -- --clear -``` - -#### Erreur "Network request failed" -- Vérifiez votre connexion Internet -- Essayez le mode tunnel : `npm start -- --tunnel` - -#### L'app crash au démarrage -- Vérifiez que Firebase est configuré dans `src/config/firebase.ts` -- Regardez les logs dans le terminal - -#### "Expo Go" ne trouve pas l'app -- Assurez-vous que les deux appareils sont sur le même réseau -- Redémarrez Expo Go -- Rescannez le QR code - -### 💡 Conseils - -1. **Première fois** : Utilisez `npm start -- --clear` pour un démarrage propre -2. **Développement** : Le rechargement à chaud peut parfois causer des bugs, rechargez manuellement (secouer le téléphone > Reload) -3. **Production** : Les graphiques fonctionneront mieux dans un build natif - -### 📞 Besoin d'aide ? - -Si le problème persiste : - -1. Vérifiez les logs dans le terminal -2. Regardez les erreurs dans Expo Go (secouer > Show Dev Menu > Debug) -3. Consultez la documentation Expo : https://docs.expo.dev/ - -## ✅ Checklist de vérification - -- [ ] Dépendances mises à jour (`npx expo install --fix`) -- [ ] Cache nettoyé (`npm start -- --clear`) -- [ ] Même réseau Wi-Fi -- [ ] Pare-feu autorise Expo -- [ ] Firebase configuré (si vous testez l'auth) -- [ ] QR code scanné avec Expo Go (pas l'appareil photo) - ---- - -**L'app devrait maintenant se charger correctement ! 🎉**