Socium Pass | API | Storyblok·

Maison BSR - Intégration API immobilière

Mission Pickbeam : investigation et résolution de pannes API entre Immo-Facile et Storyblok, et intégration conditionnelle des statuts d'annonces immobilières pour Maison BSR.

Maison BSR - Agence immobilière Storyblok

Maison BSR : L'agence immobilière qui fait du bien

Maison BSR est une agence immobilière basée à Nantes et en Loire-Atlantique. L'agence se distingue par sa promesse forte : "L'agence immobilière qui fait du bien", avec une approche basée sur l'écoute, la proximité, et les échanges.

Maison BSR propose une expertise complète pour tous les projets immobiliers : vente et achat de biens (appartements, maisons, bureaux), gestion locative professionnelle, syndic de copropriété avec transparence, et accompagnement dans les investissements locatifs (ancien, neuf, défiscalisation Pinel, Malraux).

L'agence est membre de la FNAIM et partenaire du Stade Nantais, témoignant de son ancrage local et de son professionnalisme reconnu dans le secteur immobilier nantais.

Le contexte : Mission pour Pickbeam

Collaboration avec Pickbeam

Cette mission a été réalisée dans le cadre d'une mission Socium Pass avec Pickbeam, agence spécialisée dans les architectures JAMstack et les CMS Headless. Pickbeam développait le site web de Maison BSR avec Nuxt et Storyblok, hébergé sur Netlify.

Stack technique

Le site de Maison BSR utilise une architecture moderne : Nuxt pour le framework frontend performant, Storyblok comme CMS Headless pour gérer les contenus, Immo-Facile comme logiciel de gestion immobilière avec API pour synchroniser les annonces, et Netlify pour l'hébergement et le déploiement automatisé.

Besoin d'expertise technique

Pickbeam a fait appel à moi pour résoudre des problèmes techniques spécifiques nécessitant une investigation approfondie et une expertise en intégration API.

Les problèmes techniques

Panne de l'API Immo-Facile

Le site de Maison BSR ne récupérait plus les annonces immobilières depuis l'API Immo-Facile. Les nouvelles propriétés à vendre ou à louer n'apparaissaient plus sur le site, et les mises à jour des annonces existantes ne se synchronisaient plus. Cette panne critique empêchait l'agence de présenter son offre à jour aux visiteurs du site.

Absence d'affichage des statuts d'annonces

Les annonces immobilières n'affichaient pas leur statut (disponible, sous compromis, vendu, loué) de manière conditionnelle. Il fallait développer un système permettant d'afficher automatiquement le bon statut en fonction d'un champ Storyblok, avec un affichage visuel adapté (badge, couleur, texte).

Urgence client : Pour une agence immobilière, ne pas afficher les annonces à jour ou les statuts corrects nuit directement à la crédibilité et peut faire perdre des opportunités commerciales.

Les solutions apportées

Investigation de la panne API

J'ai commencé par investiguer la source de la panne entre l'API Immo-Facile et Storyblok. J'ai analysé les logs d'erreur et les requêtes API, vérifié les credentials et permissions d'accès, testé la connectivité avec l'API Immo-Facile, et identifié les changements récents dans le code ou la configuration qui auraient pu causer la panne.

Résolution de la panne

Après avoir identifié la source du problème, j'ai résolu la panne et rétabli la synchronisation automatique entre Immo-Facile et le site. Les annonces immobilières se sont à nouveau synchronisées correctement, avec les nouvelles propriétés apparaissant automatiquement sur le site et les mises à jour (prix, disponibilité, descriptions) appliquées en temps réel.

Intégration conditionnelle des statuts

J'ai développé un système d'affichage conditionnel basé sur un champ Storyblok. Selon la valeur du champ statut dans Storyblok (disponible, sous compromis, vendu, loué), le bon badge s'affiche automatiquement sur l'annonce avec le style approprié (couleur, icône, texte). Cette intégration utilise les composants Vue.js et la logique conditionnelle de Nuxt.

Tests et validation

J'ai testé l'ensemble des scénarios possibles (différents statuts d'annonces, synchronisation des données, affichage sur différents types de biens) pour m'assurer de la fiabilité du système.

Les résultats : Site fonctionnel et dynamique

Synchronisation rétablie

La synchronisation API entre Immo-Facile et le site fonctionne à nouveau parfaitement. Les annonces immobilières sont automatiquement mises à jour sur le site dès leur modification dans le logiciel de gestion, et les nouvelles propriétés apparaissent immédiatement sans intervention manuelle.

Affichage dynamique des statuts

Les statuts d'annonces s'affichent correctement et dynamiquement sur le site. Les visiteurs peuvent facilement identifier les biens disponibles, ceux sous compromis, ou déjà vendus/loués, améliorant ainsi l'expérience utilisateur et la transparence de l'agence.

Collaboration réussie avec Pickbeam

Cette mission Socium Pass a démontré l'efficacité de la collaboration entre agences web. Pickbeam a pu compter sur mon expertise technique pour résoudre des problèmes spécifiques tout en gardant la maîtrise globale du projet.

Technologies et outils

Le site de Maison BSR repose sur une stack moderne et performante : Nuxt pour le framework frontend, Storyblok comme CMS Headless visuel, API Immo-Facile pour la gestion des annonces immobilières, JavaScript et Vue.js pour la logique frontend, et Netlify pour l'hébergement avec déploiement continu.

Conclusion

Cette intervention Socium Pass pour Maison BSR via Pickbeam illustre l'importance d'une expertise technique pointue pour résoudre rapidement des pannes critiques et développer des fonctionnalités métier spécifiques. Grâce à l'investigation méthodique et à l'intégration conditionnelle des statuts, le site de Maison BSR peut désormais présenter ses annonces immobilières de manière fiable, dynamique, et transparente pour ses clients nantais.


Articles connexes : Storyblok : CMS Headless visuelCMS Headless : la flexibilitéAPI : intégrationsNuxt : framework VueVue.js : framework progressifJavaScript : le langage

Découvrir mes servicesVoir mes projetsMe contacter