# 🌌 ObsiViewer — Explorateur de voĂ»te Obsidian ObsiViewer est une application **Angular 20** qui permet de parcourir une voĂ»te Obsidian en lecture seule : navigation dans l’arborescence des notes, rendu Markdown enrichi, visualisation du graphe et filtrage avancĂ© par tags ou dates. > 📝 **Mode dĂ©mo par dĂ©faut** : l’interface repose sur des donnĂ©es gĂ©nĂ©rĂ©es par `VaultService`. Vous pouvez connecter ObsiViewer Ă  vos fichiers Markdown via le serveur Express fourni. --- ## 🚀 Aperçu rapide - **Framework** : Angular + TailwindCSS - **Rendu Markdown** : `MarkdownService` (supporte Mermaid, KaTeX, surlignage de code) - **Visualisations** : - Explorateur de fichiers (`app/components/file-explorer/`) - Graphe de liens (`app/components/graph-view/`) - Vue tags (`app/components/tags-view/`) - Recherche + calendrier (intĂ©grĂ© Ă  `app.component.simple.html`) - **Backend optionnel** : serveur Express (`server/index.mjs`) qui lit la voĂ»te physique (`vault/`) et expose une API REST. --- ## 🧰 PrĂ©requis - Node.js **20+** et npm (`node --version`) - Angular CLI (facultatif mais pratique) : `npm install -g @angular/cli` - Docker (facultatif) pour utiliser les scripts situĂ©s dans `docker/` et `docker-compose/` --- ## ⚙ Installation & scripts utiles ```bash npm install # Installe toutes les dĂ©pendances npm run dev # Lance l'app en mode dĂ©veloppement (http://localhost:3000) npm run build # Compile la version production dans dist/ npm run preview # Sert la build de prod avec ng serve ``` 👉 Le port de dev et la configuration de build sont dĂ©finis dans `angular.json`. --- ## đŸ—‚ïž Structure du dĂ©pĂŽt - `src/` : composant principal `app.component.ts`, vue simplifiĂ©e, composants UI, services, types - `server/` : serveur Express pour charger vos notes locales et fournir l’API `/api` - `vault/` : emplacement attendu des fichiers Markdown (créé au dĂ©marrage du serveur) - `docker/` & `docker-compose/` : scripts et configurations pour l’exĂ©cution en conteneurs - `index.tsx` : point d’entrĂ©e Angular (bootstrap sans zone) - `metadata.json` : mĂ©tadonnĂ©es pour l’intĂ©gration AI Studio --- ## 🔌 Configurer l’API locale (optionnel) ```bash npm run build # gĂ©nĂšre dist/ node server/index.mjs # lance l'API + serveur statique sur http://localhost:4000 ``` Assurez-vous que vos notes Markdown se trouvent dans `vault/`. L’API expose : - `GET /api/health` - `GET /api/vault` - `GET /api/files/metadata` - `GET /api/files/by-date?date=2025-01-01` - `GET /api/files/by-date-range?start=...&end=...` --- ## 🐳 ExĂ©cution avec Docker (facultatif) - `docker/build-img.ps1` / `docker/deploy-img.ps1` pour construire et pousser une image locale - `docker/Dockerfile.origi` pour une build manuelle (`docker build ...`) - `docker-compose/docker-compose.yml` pour orchestrer un conteneur prĂ©configurĂ© 💡 Pensez Ă  personnaliser les fichiers `.env` (`.env.local`, `docker-compose/.env`) avant toute utilisation rĂ©elle. --- ## đŸ§Ș Tests & qualitĂ© - Aucun test automatisĂ© n’est fourni pour l’instant. - Ajoutez vos propres suites (`ng test`, `ng e2e`) selon vos besoins. --- ## ⚠ Points d’attention - Les scripts Docker hĂ©ritĂ©s supposent la prĂ©sence d’un dossier `server/` et d’un schĂ©ma `db/schema.sql` (non inclus ici). - Les secrets fournis en exemple dans les fichiers `.env` doivent ĂȘtre remplacĂ©s avant toute utilisation en production. - Le rendu Markdown peut nĂ©cessiter des adaptations pour des voĂ»tes Obsidian complexes. --- ## 📚 Ressources - Angular : - CLI Angular (`ng serve`) : - Guide Docker Compose : voir `docker-compose/README.md` --- ✹ Bonne exploration dans ObsiViewer !