Projet personnel

Herbier

Un herbier numérique en forme de livre. Je photographie une fleur, l'application l'identifie via Pl@ntNet, et le spécimen rejoint une planche de ma collection. Comme un herbier classique, mais sans presser la moindre plante.

Consulter l'herbier

L'idée

Garder une trace des fleurs croisées au fil des balades. On prend une photo, l'application propose une identification, on la valide, et la fleur prend sa place dans un livre qu'on feuillette. Chaque planche regroupe une même espèce (trois spécimens au maximum), datée et située à la région près.

Stack technique

  • React Router 7 (SSR)

    Rendu côté serveur en framework mode, loader et action typés par route.

  • SQLite (libSQL)

    Un spécimen = une ligne ; la photo est compressée côté client et stockée en base64.

  • Pl@ntNet API

    Identification botanique à partir de la photo, par région florale (projets Kew/TDWG).

  • Leaflet + Nominatim

    Carte des trouvailles et géocodage dans les deux sens (coordonnées ↔ lieu).

  • SCSS

    Atomic design (atoms/molecules/organisms) et méthodologie BEM, tokens dédiés au projet.

Points techniques

  • Lecture publique, écriture privée

    N'importe quel visiteur feuillette le livre ; seul le propriétaire, authentifié en session, peut ajouter ou retirer un spécimen. Toute écriture est gardée côté serveur.

  • Confidentialité côté serveur

    Un visiteur ne doit pas pouvoir me localiser : date, lieu et coordonnées GPS sont caviardés dans le loader, pas seulement masqués dans l'affichage. Le public ne voit que l'année et la région.

  • Métadonnées lues avant compression

    La date et le GPS sont extraits des données EXIF du fichier original avant sa compression (le canvas les détruirait). En secours : géoloc du navigateur, clic sur la carte, ou saisie du lieu.

  • Identification par région

    Chaque pays est associé à sa flore régionale pour affiner l'identification Pl@ntNet, avec un repli sur la flore mondiale pour les grands pays à cheval sur plusieurs zones.

  • Carte et rendu serveur

    Leaflet touche à l'objet window : il est chargé uniquement côté client, derrière un garde de montage, pour ne jamais casser le rendu serveur de la page.

Déploiement

Hébergé sur mon VPS, en HTTPS derrière un reverse proxy Caddy, avec déploiement continu à chaque mise en production. La base de données est sauvegardée automatiquement avant chaque migration.

Identification des fleurs par Pl@ntNet.