Vérifiez que le bug n'a pas déjà été signalé dans les Issues
Créez une nouvelle issue avec le template "Bug Report"
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é

Vérifiez que la fonctionnalité n'a pas déjà été proposée
Créez une issue avec le template "Feature Request"
Expliquez :
- Le problème que cela résout
- La solution proposée
- Des alternatives considérées
- Des mockups si applicable

Contribuer au code

Fork le projet
Créez une branche pour votre fonctionnalité (git checkout -b feature/AmazingFeature)
Committez vos changements (git commit -m 'Add some AmazingFeature')
Push vers la branche (git push origin feature/AmazingFeature)
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

// ✅ 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

// ✅ Bon
interface ButtonProps {
  title: string;
  onPress: () => void;
  variant?: 'primary' | 'secondary';
}

export const Button: React.FC<ButtonProps> = ({ title, onPress, variant = 'primary' }) => {
  return (
    <TouchableOpacity onPress={onPress}>
      <Text>{title}</Text>
    </TouchableOpacity>
  );
};

Styles

Utilisez StyleSheet.create()
Groupez les styles par composant
Utilisez les constantes pour les couleurs et espacements

import { COLORS, SPACING } from '../utils/constants';

const styles = StyleSheet.create({
  container: {
    padding: SPACING.lg,
    backgroundColor: COLORS.white
  }
});

Imports

Organisez les imports dans cet ordre :

React et React Native
Bibliothèques tierces
Composants locaux
Services et utils
Types
Styles

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

/**
 * 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

git clone https://github.com/yourusername/wallettracker.git
cd wallettracker
npm install

2. Créer une branche

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

# 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 :

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

## 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

Un mainteneur reviewera votre PR
Des changements peuvent être demandés
Une fois approuvée, la PR sera mergée
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)

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

// 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
Posez vos questions dans les Discussions
Rejoignez notre Discord (si applicable)

🙏 Remerciements

Merci à tous les contributeurs qui rendent ce projet possible !

Happy coding! 🚀