Documentation du projet
• Architecture & Stack

À propos de cette application

Site pédagogique du BTS SIO (option SLAM) du lycée Lesage : carnet de bord, référentiel de formation et ressources. Ci-dessous, tout sur sa fabrication.

Philosophie & Principes de Conception

Ce site est un site statique : au lieu d'être calculé à chaque visite par un serveur et une base de données, il est généré une fois pour toutes au moment de la publication, sous forme de simples fichiers HTML / CSS /JavaScript. Résultat : des pages ultra-rapides, robustes et peu coûteuses à héberger.

Tout le contenu est écrit en fichiers texte versionnés avec Git : les tutoriels et synthèses en Markdown (un format d'écriture simple), les quiz en MDX(Markdown enrichi de composants interactifs), et le référentiel en JSON structuré. Modifier le site, c'est donc modifier du texte — chaque changement est relu, daté et réversible.

Le générateur du site : il assemble les fichiers texte en pages web définitives. Par défaut aucun JavaScript n'est envoyé au visiteur (pages légères) ; l'interactivité (menu latéral, onglets, recherche, quiz) n'est activée que là où elle sert.
Le langage de programmation du projet : du JavaScript auquel on ajoute des types (nombre, texte, liste…). Les erreurs sont détectées pendant l'écriture plutôt que chez le visiteur — idéal pour apprendre à coder proprement.
La bibliothèque des zones interactives : quiz à correction automatique, tri et recherche des ressources, navigation par onglets. Le reste de la page demeure du simple texte affiché instantanément.
La mise en forme : Tailwind permet de styliser avec des classes utilitaires, et shadcn/ui fournit des composants accessibles prêts à l'emploi (boutons, cartes, menus). Les couleurs du site sont centralisées dans globals.css.
L'outil du développeur : il installe les bibliothèques du projet et exécute les commandes (bun run build pour fabriquer le site, bun x astro dev pour le prévisualiser). Rapide et simple, il remplace ici Node.js et npm.
La mise en ligne automatique : à chaque envoi (git push) sur la branche principale, Dokploy reconstruit le site dans un conteneur Docker et le publie aussitôt. Aucune manipulation manuelle : écrire, envoyer, c'est en ligne.
Bibliothèques complémentaires
Elles aussi open source et documentées — cliquez pour explorer.
  • Sätteri — moteur de rendu Markdown rapide (écrit en Rust) qui transforme les articles en pages.
  • Expressive Code — coloration syntaxique, bouton copier et fenêtres terminal des blocs de code.
  • Fuse.js — recherche floue (tolérante aux fautes) dans les listes de ressources, sans serveur.
  • Zod — validation des contenus à la compilation : un article mal structuré bloque la publication au lieu de casser le site.
  • Lucide — jeu d'icônes vectorielles utilisé dans toute l'interface.