Add deployment guide, contributing guidelines and changelog
- Add DEPLOYMENT.md with complete deployment instructions - Add CONTRIBUTING.md for contributors - Add CHANGELOG.md to track versions - Add .env.example for environment variables
This commit is contained in:
381
CONTRIBUTING.md
Normal file
381
CONTRIBUTING.md
Normal file
@@ -0,0 +1,381 @@
|
||||
# 🤝 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<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
|
||||
|
||||
```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! 🚀**
|
||||
Reference in New Issue
Block a user