293 lines
		
	
	
		
			6.0 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
			
		
		
	
	
			293 lines
		
	
	
		
			6.0 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
# 🚀 Guide de Démarrage Rapide - ObsiViewer
 | 
						||
 | 
						||
## ⚡ Démarrage en 5 Minutes
 | 
						||
 | 
						||
### 1️⃣ Installation
 | 
						||
 | 
						||
```bash
 | 
						||
# Cloner le projet (si pas déjà fait)
 | 
						||
git clone <repo-url>
 | 
						||
cd ObsiViewer
 | 
						||
 | 
						||
# Installer les dépendances
 | 
						||
npm install
 | 
						||
```
 | 
						||
 | 
						||
### 2️⃣ Configuration
 | 
						||
 | 
						||
```bash
 | 
						||
# Copier le fichier d'environnement
 | 
						||
cp .env.example .env
 | 
						||
 | 
						||
# Éditer .env et définir le chemin vers votre vault Obsidian
 | 
						||
# VAULT_PATH=C:\Obsidian_doc\Obsidian_IT
 | 
						||
```
 | 
						||
 | 
						||
### 3️⃣ Démarrer Meilisearch (Recherche Backend)
 | 
						||
 | 
						||
```bash
 | 
						||
# Démarrer le conteneur Meilisearch
 | 
						||
npm run meili:up
 | 
						||
 | 
						||
# Indexer votre vault
 | 
						||
npm run meili:reindex
 | 
						||
```
 | 
						||
 | 
						||
### 4️⃣ Démarrer l'Application
 | 
						||
 | 
						||
**Terminal 1 - Backend :**
 | 
						||
```bash
 | 
						||
node server/index.mjs
 | 
						||
```
 | 
						||
 | 
						||
**Terminal 2 - Frontend :**
 | 
						||
```bash
 | 
						||
npm run dev
 | 
						||
```
 | 
						||
 | 
						||
### 5️⃣ Accéder à l'Application
 | 
						||
 | 
						||
Ouvrez votre navigateur : **http://localhost:3000**
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 🎯 Fonctionnalités Principales
 | 
						||
 | 
						||
### 🔍 Recherche Ultra-Rapide
 | 
						||
 | 
						||
La recherche est optimisée avec **Meilisearch backend** :
 | 
						||
- ⚡ **15-50ms** par recherche (vs 800-1200ms avant)
 | 
						||
- 🚫 **Aucun gel** de l'interface
 | 
						||
- 🔴 **Recherche en temps réel** pendant la saisie
 | 
						||
- 📊 **Support complet** des opérateurs Obsidian
 | 
						||
 | 
						||
**Exemples de recherche :**
 | 
						||
```
 | 
						||
test                    # Recherche simple
 | 
						||
tag:projet             # Recherche par tag
 | 
						||
path:docs/             # Recherche dans un chemin
 | 
						||
file:readme            # Recherche par nom de fichier
 | 
						||
angular AND typescript # Recherche avec opérateurs
 | 
						||
```
 | 
						||
 | 
						||
### 📊 Graphe de Connaissances
 | 
						||
 | 
						||
Visualisez les liens entre vos notes :
 | 
						||
- Cliquez sur **"Graph View"** dans la sidebar
 | 
						||
- Utilisez les filtres pour affiner la vue
 | 
						||
- Drag & drop pour organiser les nœuds
 | 
						||
- Double-clic pour ouvrir une note
 | 
						||
 | 
						||
### 📑 Navigation
 | 
						||
 | 
						||
- **Explorateur de fichiers** : Sidebar gauche
 | 
						||
- **Breadcrumbs** : Navigation contextuelle
 | 
						||
- **Favoris (Bookmarks)** : Accès rapide aux notes importantes
 | 
						||
- **Calendrier** : Navigation par dates
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 🛠️ Commandes Utiles
 | 
						||
 | 
						||
### Développement
 | 
						||
 | 
						||
```bash
 | 
						||
# Frontend seul (mode démo)
 | 
						||
npm run dev
 | 
						||
 | 
						||
# Backend + API
 | 
						||
node server/index.mjs
 | 
						||
 | 
						||
# Build production
 | 
						||
npm run build
 | 
						||
npm run preview
 | 
						||
```
 | 
						||
 | 
						||
### Meilisearch
 | 
						||
 | 
						||
```bash
 | 
						||
# Démarrer Meilisearch
 | 
						||
npm run meili:up
 | 
						||
 | 
						||
# Arrêter Meilisearch
 | 
						||
npm run meili:down
 | 
						||
 | 
						||
# Réindexer le vault
 | 
						||
npm run meili:reindex
 | 
						||
 | 
						||
# Rebuild complet (up + reindex)
 | 
						||
npm run meili:rebuild
 | 
						||
```
 | 
						||
 | 
						||
### Tests
 | 
						||
 | 
						||
```bash
 | 
						||
# Tests unitaires
 | 
						||
npm run test
 | 
						||
 | 
						||
# Tests E2E
 | 
						||
npm run test:e2e
 | 
						||
```
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 🐛 Dépannage Rapide
 | 
						||
 | 
						||
### Problème : Recherche ne fonctionne pas
 | 
						||
 | 
						||
**Solution :**
 | 
						||
```bash
 | 
						||
# 1. Vérifier que Meilisearch est actif
 | 
						||
docker ps | grep meilisearch
 | 
						||
 | 
						||
# 2. Vérifier que le backend tourne
 | 
						||
# Windows:
 | 
						||
netstat -ano | findstr :4000
 | 
						||
# Linux/Mac:
 | 
						||
lsof -i :4000
 | 
						||
 | 
						||
# 3. Réindexer si nécessaire
 | 
						||
npm run meili:reindex
 | 
						||
```
 | 
						||
 | 
						||
### Problème : "Cannot connect to Meilisearch"
 | 
						||
 | 
						||
**Solution :**
 | 
						||
```bash
 | 
						||
# Redémarrer Meilisearch
 | 
						||
npm run meili:down
 | 
						||
npm run meili:up
 | 
						||
npm run meili:reindex
 | 
						||
```
 | 
						||
 | 
						||
### Problème : Notes ne s'affichent pas
 | 
						||
 | 
						||
**Solution :**
 | 
						||
```bash
 | 
						||
# Vérifier le chemin du vault dans .env
 | 
						||
cat .env | grep VAULT_PATH
 | 
						||
 | 
						||
# Vérifier que le backend charge les notes
 | 
						||
curl http://localhost:4000/api/vault
 | 
						||
```
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 📚 Documentation Complète
 | 
						||
 | 
						||
- **[README.md](./README.md)** - Vue d'ensemble complète
 | 
						||
- **[SEARCH_OPTIMIZATION.md](./docs/SEARCH_OPTIMIZATION.md)** - Guide d'optimisation de la recherche
 | 
						||
- **[SEARCH_MEILISEARCH_MIGRATION.md](./docs/CHANGELOG/SEARCH_MEILISEARCH_MIGRATION.md)** - Détails de la migration
 | 
						||
- **[ARCHITECTURE/](./docs/ARCHITECTURE/)** - Documentation d'architecture
 | 
						||
- **[GRAPH/](./docs/GRAPH/)** - Documentation du graphe
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 🎨 Personnalisation
 | 
						||
 | 
						||
### Thème
 | 
						||
 | 
						||
Basculer entre mode clair/sombre :
 | 
						||
- Cliquez sur l'icône **lune/soleil** dans la barre supérieure
 | 
						||
- Ou utilisez le raccourci **Alt+T**
 | 
						||
 | 
						||
### Recherche
 | 
						||
 | 
						||
Ajuster le debounce de la recherche live :
 | 
						||
```typescript
 | 
						||
// src/components/search-panel/search-panel.component.ts
 | 
						||
this.searchSubject.pipe(
 | 
						||
  debounceTime(300), // ← Modifier ici (en ms)
 | 
						||
  distinctUntilChanged()
 | 
						||
)
 | 
						||
```
 | 
						||
 | 
						||
### Graphe
 | 
						||
 | 
						||
Personnaliser les paramètres du graphe :
 | 
						||
- Ouvrir le panneau de paramètres dans Graph View
 | 
						||
- Ajuster les forces, couleurs, filtres
 | 
						||
- Les paramètres sont sauvegardés dans `.obsidian/graph.json`
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 🚀 Déploiement Production
 | 
						||
 | 
						||
### Docker
 | 
						||
 | 
						||
```bash
 | 
						||
# Build l'image
 | 
						||
cd docker
 | 
						||
./build-img.ps1  # Windows
 | 
						||
./build-img.sh   # Linux/Mac
 | 
						||
 | 
						||
# Démarrer avec Docker Compose
 | 
						||
cd docker-compose
 | 
						||
docker-compose up -d
 | 
						||
```
 | 
						||
 | 
						||
### Variables d'Environnement Production
 | 
						||
 | 
						||
```env
 | 
						||
NODE_ENV=production
 | 
						||
VAULT_PATH=/path/to/vault
 | 
						||
MEILI_MASTER_KEY=<strong-secure-key>
 | 
						||
MEILI_HOST=http://meilisearch:7700
 | 
						||
PORT=4000
 | 
						||
```
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 💡 Astuces
 | 
						||
 | 
						||
### Raccourcis Clavier
 | 
						||
 | 
						||
- **Alt+R** : Ouvrir la recherche
 | 
						||
- **Alt+D** : Basculer le mode sombre
 | 
						||
- **Ctrl+K** : Ouvrir la palette de commandes (si implémenté)
 | 
						||
- **Échap** : Fermer les modales
 | 
						||
 | 
						||
### Performance
 | 
						||
 | 
						||
Pour de meilleures performances avec de gros vaults :
 | 
						||
1. ✅ Utilisez Meilisearch (déjà activé)
 | 
						||
2. ✅ Activez la compression dans nginx (production)
 | 
						||
3. ✅ Utilisez un SSD pour le vault
 | 
						||
4. ✅ Limitez les résultats de recherche (déjà à 20)
 | 
						||
 | 
						||
### Recherche Avancée
 | 
						||
 | 
						||
Combinez les opérateurs pour des recherches puissantes :
 | 
						||
```
 | 
						||
tag:projet path:2024/ -tag:archive
 | 
						||
```
 | 
						||
→ Notes avec tag "projet", dans le dossier 2024, sans tag "archive"
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 🆘 Support
 | 
						||
 | 
						||
- **Issues GitHub** : [Lien vers issues]
 | 
						||
- **Documentation** : `./docs/`
 | 
						||
- **Logs** : Vérifier la console du navigateur et les logs serveur
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## ✅ Checklist de Démarrage
 | 
						||
 | 
						||
- [ ] Node.js 20+ installé
 | 
						||
- [ ] Dépendances npm installées
 | 
						||
- [ ] Fichier `.env` configuré avec `VAULT_PATH`
 | 
						||
- [ ] Meilisearch démarré (`npm run meili:up`)
 | 
						||
- [ ] Vault indexé (`npm run meili:reindex`)
 | 
						||
- [ ] Backend démarré (`node server/index.mjs`)
 | 
						||
- [ ] Frontend démarré (`npm run dev`)
 | 
						||
- [ ] Application accessible sur http://localhost:3000
 | 
						||
- [ ] Recherche fonctionne (tester avec un mot simple)
 | 
						||
 | 
						||
---
 | 
						||
 | 
						||
## 🎉 Prêt à Explorer !
 | 
						||
 | 
						||
Votre ObsiViewer est maintenant configuré et optimisé. Profitez d'une expérience de recherche ultra-rapide et d'une navigation fluide dans votre vault Obsidian ! 🚀
 |