Site de démonstration d’une agence immobilière inventée sur le lac de Côme : l’accueil est un film qui défile du lac jusqu’à la recherche, puis 24 annonces dans 14 secteurs avec la carte du lac, des fiches avec galerie et un espace prêts immobiliers aux données réelles de la BCE. Le panneau du propriétaire s’essaie sans compte.
**Ardesia Immobiliare n’existe pas** : c’est une agence inventée sur le lac de Côme, construite comme les sites que je réalise pour de vraies entreprises. Les annonces, les personnes et les photos sont inventées, et les photos ont été générées sur le GPU de mon ordinateur avec un modèle ouvert ; les données de prêt immobilier sont réelles, téléchargées auprès de la BCE et d’Eurostat. Le site le dit sur chaque page.
**Ce qu’il fait**
- **L’accueil est un film** : en défilant, on descend sur le lac, on entre dans le salon d’une villa et on s’arrête sur une terrasse au coucher du soleil, où commence la recherche. - **La recherche** : 24 annonces dans 14 secteurs, avec des filtres par contrat, type, secteur, prix, surface, pièces et équipements, et une vue carte du lac qui filtre la liste. - **Les fiches** : une galerie plein écran, les données techniques avec la classe énergétique, le secteur et une demande de visite. - **Prêts et partenaires** : les taux des nouveaux prêts immobiliers en Italie depuis 2015 avec l’Euribor et le taux BCE, les prix des logements, un calculateur de mensualité et les professionnels en qui l’agence a confiance. - **Les statistiques de visite**, sans cookies et sans enregistrer l’adresse des visiteurs.
**Le panneau, à essayer sans compte**
Le propriétaire met tout à jour depuis un panneau pensé pour le téléphone : les annonces et leurs photos, les demandes reçues, les partenaires, les personnes, les textes, la couleur et les sections du site, avec « Ripristina » (annuler) après chaque enregistrement et une corbeille. Depuis le site, « Prova il pannello » (essayer le panneau) l’ouvre sans compte : les modifications restent dans le navigateur de la personne qui essaie, car la logique du serveur y tourne, sur une copie des données.
**La partie difficile**
Faire tourner la même logique à deux endroits, sur le serveur avec MongoDB et dans le navigateur pour l’essai, sans que les deux versions divergent. Les services vivent dans un paquet partagé, au-dessus d’un contrat de données, et un test automatique envoie les mêmes requêtes au serveur et à la copie du navigateur et exige des réponses identiques. Et le film de l’accueil pèse 0,90 Mo au premier chargement sur ordinateur : les scènes suivantes se téléchargent pendant le défilement.
Vue 3 et TypeScript, Fastify et MongoDB, GSAP pour le film, ECharts pour les graphiques ; chaque modification passe par 381 tests automatiques, et le site est publié sur mon serveur, avec une copie nocturne de la base de données.
Conception, développement full-stack et mise en ligne · 2026
Vue.js, Fastify, MongoDB, GSAP, Z-Image-Turbo