Arthur Lempereur
8bde3d4f21
- Setup Expo project with TypeScript - Implement authentication (Login/Signup/Logout) - Create Dashboard, Transactions, Subscriptions, and Analysis screens - Add Firebase services (Auth, Firestore, Storage) - Implement real-time synchronization - Add charts and analytics - Create reusable components (Button, InputText, TransactionCard, SubscriptionCard) - Configure React Navigation with bottom tabs - Add Firestore security rules - Create comprehensive documentation (README, FIREBASE_SETUP, TESTING)
192 lines
5.2 KiB
Markdown
192 lines
5.2 KiB
Markdown
# 💰 WalletTracker
|
|
|
|
Application mobile de gestion de budget développée avec React Native et Firebase.
|
|
|
|
## 📱 Fonctionnalités
|
|
|
|
- **Authentification** : Inscription et connexion sécurisées avec Firebase Auth
|
|
- **Gestion des transactions** : Ajout et suivi des dépenses et revenus par catégorie
|
|
- **Abonnements récurrents** : Gestion des abonnements avec rappels automatiques
|
|
- **Tableau de bord** : Vue d'ensemble mensuelle du budget avec statistiques
|
|
- **Analyses visuelles** : Graphiques et statistiques détaillées par catégorie
|
|
- **Synchronisation temps réel** : Partage des données entre plusieurs utilisateurs
|
|
- **Multi-plateforme** : Fonctionne sur iOS et Android
|
|
|
|
## 🛠️ Stack Technique
|
|
|
|
- **Frontend** : React Native avec Expo
|
|
- **Langage** : TypeScript
|
|
- **Backend** : Firebase (Authentication, Firestore, Storage)
|
|
- **Navigation** : React Navigation (Stack & Bottom Tabs)
|
|
- **Stockage local** : AsyncStorage
|
|
- **Graphiques** : react-native-chart-kit
|
|
- **Gestion d'état** : React Hooks
|
|
|
|
## 📦 Installation
|
|
|
|
### Prérequis
|
|
|
|
- Node.js (v16 ou supérieur)
|
|
- npm ou yarn
|
|
- Expo CLI
|
|
- Compte Firebase
|
|
|
|
### Étapes d'installation
|
|
|
|
1. **Cloner le projet**
|
|
```bash
|
|
git clone <votre-repo>
|
|
cd WalletTracker
|
|
```
|
|
|
|
2. **Installer les dépendances**
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
3. **Configurer Firebase**
|
|
|
|
a. Créez un projet sur [Firebase Console](https://console.firebase.google.com/)
|
|
|
|
b. Activez les services suivants :
|
|
- Authentication (Email/Password)
|
|
- Firestore Database
|
|
- Storage
|
|
|
|
c. Copiez vos identifiants Firebase dans `src/config/firebase.ts` :
|
|
```typescript
|
|
const firebaseConfig = {
|
|
apiKey: "VOTRE_API_KEY",
|
|
authDomain: "VOTRE_AUTH_DOMAIN",
|
|
projectId: "VOTRE_PROJECT_ID",
|
|
storageBucket: "VOTRE_STORAGE_BUCKET",
|
|
messagingSenderId: "VOTRE_MESSAGING_SENDER_ID",
|
|
appId: "VOTRE_APP_ID"
|
|
};
|
|
```
|
|
|
|
4. **Configurer les règles Firestore**
|
|
|
|
Copiez les règles du fichier `firestore.rules` dans la console Firebase
|
|
|
|
5. **Lancer l'application**
|
|
```bash
|
|
npm start
|
|
```
|
|
|
|
Puis scannez le QR code avec l'application Expo Go sur votre téléphone
|
|
|
|
## 📱 Utilisation
|
|
|
|
### Démarrage rapide
|
|
|
|
1. **Créer un compte** : Utilisez l'écran d'inscription avec votre email et mot de passe
|
|
2. **Ajouter une transaction** : Cliquez sur le bouton "+" pour ajouter une dépense ou un revenu
|
|
3. **Gérer les abonnements** : Accédez à l'onglet "Abonnements" pour suivre vos dépenses récurrentes
|
|
4. **Consulter les analyses** : Visualisez vos dépenses par catégorie dans l'onglet "Analyses"
|
|
|
|
### Catégories par défaut
|
|
|
|
**Dépenses** :
|
|
- Courses 🛒
|
|
- Logement 🏠
|
|
- Transport 🚗
|
|
- Loisirs 🎮
|
|
- Restaurant 🍽️
|
|
- Santé 💊
|
|
- Vêtements 👕
|
|
- Éducation 📚
|
|
- Abonnements 📱
|
|
- Autre 📦
|
|
|
|
**Revenus** :
|
|
- Salaire 💰
|
|
- Freelance 💼
|
|
- Investissement 📈
|
|
- Cadeau 🎁
|
|
- Autre 💵
|
|
|
|
## 🗂️ Structure du projet
|
|
|
|
```
|
|
WalletTracker/
|
|
├── src/
|
|
│ ├── components/ # Composants réutilisables
|
|
│ │ ├── Button.tsx
|
|
│ │ ├── InputText.tsx
|
|
│ │ ├── TransactionCard.tsx
|
|
│ │ └── SubscriptionCard.tsx
|
|
│ ├── config/ # Configuration Firebase
|
|
│ │ └── firebase.ts
|
|
│ ├── hooks/ # Hooks personnalisés
|
|
│ │ └── useAuth.ts
|
|
│ ├── navigation/ # Configuration de la navigation
|
|
│ │ └── AppNavigator.tsx
|
|
│ ├── screens/ # Écrans de l'application
|
|
│ │ ├── LoginScreen.tsx
|
|
│ │ ├── SignupScreen.tsx
|
|
│ │ ├── DashboardScreen.tsx
|
|
│ │ ├── TransactionScreen.tsx
|
|
│ │ ├── SubscriptionScreen.tsx
|
|
│ │ └── AnalysisScreen.tsx
|
|
│ ├── services/ # Services Firebase
|
|
│ │ ├── authService.ts
|
|
│ │ ├── transactionService.ts
|
|
│ │ ├── subscriptionService.ts
|
|
│ │ └── categoryService.ts
|
|
│ ├── types/ # Définitions TypeScript
|
|
│ │ └── index.ts
|
|
│ └── utils/ # Utilitaires
|
|
├── App.tsx # Point d'entrée
|
|
├── package.json
|
|
└── README.md
|
|
```
|
|
|
|
## 🔐 Sécurité
|
|
|
|
- Les mots de passe sont gérés par Firebase Authentication
|
|
- Les règles Firestore protègent les données de chaque utilisateur
|
|
- Les données sont synchronisées uniquement pour les utilisateurs autorisés
|
|
- Stockage sécurisé des tokens avec AsyncStorage
|
|
|
|
## 🚀 Déploiement
|
|
|
|
### Build pour production
|
|
|
|
**iOS** :
|
|
```bash
|
|
eas build --platform ios
|
|
```
|
|
|
|
**Android** :
|
|
```bash
|
|
eas build --platform android
|
|
```
|
|
|
|
## 📝 Fonctionnalités futures
|
|
|
|
- [ ] Notifications push pour les rappels d'abonnements
|
|
- [ ] Partage multi-utilisateurs avancé
|
|
- [ ] Export des données en CSV/PDF
|
|
- [ ] Objectifs budgétaires mensuels
|
|
- [ ] Mode sombre
|
|
- [ ] Support multilingue
|
|
- [ ] Reconnaissance de tickets avec OCR
|
|
- [ ] Widgets pour l'écran d'accueil
|
|
|
|
## 🤝 Contribution
|
|
|
|
Les contributions sont les bienvenues ! N'hésitez pas à ouvrir une issue ou une pull request.
|
|
|
|
## 📄 Licence
|
|
|
|
Ce projet est sous licence MIT.
|
|
|
|
## 👨💻 Auteur
|
|
|
|
Développé avec ❤️ pour une meilleure gestion de budget.
|
|
|
|
## 📞 Support
|
|
|
|
Pour toute question ou problème, veuillez ouvrir une issue sur GitHub.
|