2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00
2025-09-27 18:13:02 -04:00

🌌 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 larborescence des notes, rendu Markdown enrichi, visualisation du graphe et filtrage avancé par tags ou dates.

📝 Mode démo par défaut : linterface 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

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 lAPI /api
  • vault/ : emplacement attendu des fichiers Markdown (créé au démarrage du serveur)
  • docker/ & docker-compose/ : scripts et configurations pour lexécution en conteneurs
  • index.tsx : point dentrée Angular (bootstrap sans zone)
  • metadata.json : métadonnées pour lintégration AI Studio

🔌 Configurer lAPI locale (optionnel)

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/. LAPI 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é nest fourni pour linstant.
  • Ajoutez vos propres suites (ng test, ng e2e) selon vos besoins.

⚠️ Points dattention

  • Les scripts Docker hérités supposent la présence dun dossier server/ et dun 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


Bonne exploration dans ObsiViewer !

Description
ObsiViewer
Readme 36 MiB
Languages
TypeScript 72.9%
HTML 16%
CSS 4.3%
JavaScript 3.2%
SCSS 1.8%
Other 1.8%