fintrack/README.md

FinTrack - Gestion de Compte Bancaire

Application web moderne de gestion personnelle de comptes bancaires avec import de fichiers OFX, catégorisation automatique des transactions et visualisations statistiques.

🚀 Fonctionnalités

• Gestion de comptes : Ajout, modification et organisation de vos comptes bancaires (chèques, épargne, cartes de crédit)
• Import OFX : Import automatique de transactions depuis des fichiers OFX exportés par votre banque
• Catégorisation automatique : Catégorisation intelligente des transactions basée sur des mots-clés
• Organisation par dossiers : Structurez vos comptes avec des dossiers personnalisables
• Gestion de catégories : Créez et gérez vos catégories de dépenses avec couleurs et icônes
• Tableau de bord : Vue d'ensemble avec cartes récapitulatives, transactions récentes et répartition par catégorie
• Statistiques : Visualisations graphiques de vos finances
• Thème sombre/clair : Support du mode sombre et clair
• Stockage local : Toutes vos données sont stockées localement dans le navigateur (localStorage)

🛠️ Technologies

• Framework : Next.js 16 (App Router)
• UI : React 19, TypeScript
• Styling : Tailwind CSS 4, shadcn/ui
• Composants : Radix UI
• Graphiques : Recharts
• Formulaires : React Hook Form + Zod
• Thème : next-themes

📋 Prérequis

• Node.js 18+
• pnpm (recommandé) ou npm/yarn

🔧 Installation

1. Clonez le dépôt :

git clone <url-du-repo>
cd bank-account-management-app

2. Installez les dépendances :

pnpm install

3. Lancez le serveur de développement :

pnpm dev

4. Ouvrez http://localhost:3000 dans votre navigateur

📦 Scripts disponibles

• pnpm dev : Lance le serveur de développement
• pnpm build : Compile l'application pour la production
• pnpm start : Lance le serveur de production
• pnpm lint : Vérifie le code avec ESLint

📁 Structure du projet

├── app/                    # Pages Next.js (App Router)
│   ├── accounts/          # Page de gestion des comptes
│   ├── categories/        # Page de gestion des catégories
│   ├── folders/           # Page d'organisation par dossiers
│   ├── settings/          # Page des paramètres
│   ├── statistics/        # Page des statistiques
│   └── transactions/      # Page de gestion des transactions
├── components/            # Composants React
│   ├── dashboard/        # Composants du tableau de bord
│   ├── import/           # Composants d'import OFX
│   └── ui/               # Composants UI réutilisables (shadcn/ui)
├── lib/                  # Utilitaires et logique métier
│   ├── hooks.ts          # Hooks personnalisés
│   ├── ofx-parser.tsx    # Parser de fichiers OFX
│   ├── store.ts          # Gestion du stockage local
│   ├── types.ts          # Types TypeScript
│   └── utils.ts          # Fonctions utilitaires
└── public/               # Assets statiques

💾 Stockage des données

L'application utilise localStorage pour stocker toutes les données localement dans le navigateur. Les données sont sauvegardées automatiquement à chaque modification.

Note : Les données sont stockées uniquement dans votre navigateur. Si vous supprimez les données du navigateur ou changez d'appareil, vous devrez réimporter vos fichiers OFX.

📥 Import de fichiers OFX

1. Exportez vos transactions depuis votre banque au format OFX
2. Cliquez sur "Importer OFX" dans le tableau de bord
3. Sélectionnez votre fichier OFX
4. Les transactions sont automatiquement importées et catégorisées

L'application détecte automatiquement les doublons basés sur l'ID unique (FITID) de chaque transaction.

🎨 Personnalisation

Catégories par défaut

L'application inclut des catégories pré-configurées avec des mots-clés pour la catégorisation automatique :

• Alimentation
• Transport
• Logement
• Loisirs
• Santé
• Revenus
• Abonnements
• Shopping

Vous pouvez modifier, ajouter ou supprimer des catégories selon vos besoins.

Thème

Le thème sombre/clair peut être changé dans les paramètres. L'application détecte automatiquement les préférences de votre système.

🔒 Sécurité et confidentialité

• 100% local : Toutes vos données restent dans votre navigateur
• Aucune connexion externe : Aucune donnée n'est envoyée à des serveurs externes
• Pas de tracking : Aucun service d'analytics tiers (sauf Vercel Analytics optionnel)

🚧 Développement

Ajouter une nouvelle fonctionnalité

1. Créez vos composants dans components/
2. Ajoutez les types nécessaires dans lib/types.ts
3. Ajoutez la logique métier dans lib/store.ts
4. Créez la page dans app/

Structure des données

Les données sont structurées comme suit :

• Accounts : Comptes bancaires avec solde et métadonnées
• Transactions : Transactions avec montant, date, description, catégorie
• Folders : Dossiers pour organiser les comptes
• Categories : Catégories avec mots-clés pour auto-catégorisation
• CategoryRules : Règles avancées de catégorisation (futur)

📝 Licence

Ce projet est privé et destiné à un usage personnel.

🤝 Contribution

Ce projet est en développement actif. Les suggestions et améliorations sont les bienvenues.

---

Développé avec ❤️ en utilisant Next.js et React