---
title: "Domaine l'Angélus"
description: "Site web pour le domaine l'Angélus, situé à Figeac dans le Lot, proposant des gîtes et un élevage de chiens de troupeaux."
canonical_url: "https://tcastanie.dev/portfolio/domaine-langelus-website"
---

> Index of every page on this site: [llms.txt](https://tcastanie.dev/llms.txt)

# Domaine l'Angélus

Site web pour le domaine l'Angélus, situé à Figeac dans le Lot, proposant des gîtes et un élevage de chiens de troupeaux.

![Aperçu récapitulatif du projet](https://tcastanie.dev/portfolio/doma_social.webp)

<card-group>
<card icon="i-mingcute-link-line" title="Site web" target="_blank" to="https://www.domaine-langelus.fr">

[www.domaine-langelus.fr](http://www.domaine-langelus.fr)

</card>

<card icon="i-mingcute-calendar-2-line" title="Déploiement">

Juillet 2024

</card>

<card icon="i-mingcute-lighthouse-line" title="Scores lighthouse">

- Performances : 85
- Accessibilité : 98
- Bonnes pratiques : 100
- SEO : 100

*(Moyenne des 26 pages via Unlighthouse)*

</card>

<card icon="i-mingcute-tool-line" title="Stack technique">
<field-group>
<field name="Front-end" type="">
<badge color="neutral" variant="outline">
<icon name="i-simple-icons-nuxt">



</icon>

 Nuxt (SSG)

</badge>

<badge color="neutral" variant="outline">
<icon name="i-simple-icons-vuedotjs">



</icon>

 Vue.js

</badge>

<badge color="neutral" variant="outline">
<icon name="i-simple-icons-unocss">



</icon>

 UnoCSS

</badge>
</field>

<field name="Back-end & Paiements" type="">
<badge color="neutral" variant="outline">
<icon name="i-simple-icons-directus">



</icon>

 Directus

</badge>

<badge color="neutral" variant="outline" className="mr-2">
<icon name="i-simple-icons-sqlite">



</icon>

 SQLite

</badge>

<badge color="neutral" variant="outline">
<icon name="i-simple-icons-hono">



</icon>

 Hono

</badge>

<badge color="neutral" variant="outline">
<icon name="i-simple-icons-stripe">



</icon>

 Stripe API

</badge>
</field>
</field-group>
</card>
</card-group>

Le Domaine l'Angélus, situé à Sainte-Colombe (Figeac) dans le Lot, est un lieu qui propose de la location de gîtes et du dressage de chiens de troupeaux. L'objectif étant de créer un site web permettant la présentation des différentes prestations proposées par le domaine, ainsi que la réservation de nuitées et de cours de dressage de chiens de troupeau.

## Aperçu

![Page d'accueil](https://tcastanie.dev/doma/homepage.png)

Le site est divisé en deux parties distinctes :

- Côté gîtes pour la présentation du domaine et la réservation des nuitées.
- Côté chiens pour la présentation de l'élevage, ses prestations et sa lignée, et de la réservation de cours.

Chaque section possède un design qui lui est propre : un clair pour les gîtes, un sombre pour l'élevage. Leur point commun est la couleur bronze qui a ensuite été reprise sur la charte graphique des différentes communications du domaine (réseaux et flyers).

## Fonctionnalités

### Réservation en ligne

Les visiteurs peuvent facilement choisir une plage de dates en fonction des disponibilités et payer rapidement leur réservation. La réservation des gîtes est séparée de la réservation des cours de dressage.

![Barre de réservation](https://tcastanie.dev/doma/booking-bar.png)

### Présentation des gîtes et du domaine

Des pages simples permettant d'afficher les photos du domaine et des gîtes, ainsi que l'ensemble des  aménagements. Dans chaque fiche de gîte, un calendrier de disponibilités est également présent.

![Aperçu fiche gîte](https://tcastanie.dev/doma/fiche-gite.png)

### Présentation de l'élevage

Plusieurs pages avec des détails sur les prestations de l'élevage du domaine, sur les chiens à vendre ou disponibles à la saillie, mais aussi l'affichage de l'arbre généalogique de la lignée.

![Aperçu page lignée](https://tcastanie.dev/doma/page-lignee.png)

## Aspects techniques

L'architecture du projet est simple : une base de données pour stocker toutes les données métier (réservations, grille de prix, disponibilités, haute saison, pages...) et un serveur pour héberger le site statique, le CMS et pour gérer les paiements.

### Stack technique

Le *CMS* est **Directus** <icon name="i-simple-icons-directus" className="size-5">



</icon>

, directement branché sur la base de données **SQLite** <icon name="i-simple-icons-sqlite" className="size-5">



</icon>

. Les paiements sont effectués avec **Stripe** <icon name="i-simple-icons-stripe" className="size-5">



</icon>

 et gérés avec le *framework* **Hono** <icon name="i-simple-icons-hono" className="size-5">



</icon>

. Le *front-end* est créé avec **Nuxt** <icon name="i-simple-icons-nuxt" className="size-5">



</icon>

 et **Vue.js** <icon name="i-simple-icons-vuedotjs" className="size-5">



</icon>

 en mode statique (*SSG*), avec l'aide de **UnoCSS** <icon name="i-simple-icons-unocss" className="size-5">



</icon>

 (syntaxe **Tailwind**).

Le site étant principalement de type vitrine, le choix de générer un site statique s'est imposé de lui-même, en raison du gain important de performances.

Pour assurer la sécurité des données, une sauvegarde automatique de la base de données est mise en place avec **Duplicati** <icon name="i-simple-icons-duplicati" className="size-5">



</icon>

.

### SEO

La majorité du SEO a été mise en place grâce au plugin **Nuxt SEO**. Il simplifie énormément la gestion des graphes Schema.org, et permet de générer rapidement les multiples balises SEO, les images OpenGraph, ainsi que les fichiers *robots.txt* et *sitemap.xml*.

J'ai également utilisé le [Google Indexing Script](https://github.com/goenning/google-indexing-script) pour rapidement référencer l'ensemble des pages du site sur Google et remonter en tête des résultats de recherche basés sur le nom du domaine, en moins d'un mois.

## Processus

Création d'un site web caché (restriction IP) mis à jour automatiquement à chaque ajout de code afin de pouvoir mettre en place une méthode Agile adaptée. Les hôtes du domaine ont pu tester le site à leur aise et faire des retours pour ajuster les fonctionnalités. Le jour du déploiement, le site a simplement été ouvert au public.

La formation des gérants du domaine à l'utilisation du CMS a également été nécessaire afin de pouvoir laisser le champ libre à de futurs ajouts ou modifications du contenu, ainsi que pour gérer les imprévus avec les réservations.

## Résultats et impact

Les clients du domaine sont heureux de pouvoir réserver directement via internet, sans passer par un intermédiaire, ce qui est rare dans ce domaine de la réservation de gîtes. L'affichage simple et sans fioritures des fiches de gîtes et leurs disponibilités plaisent également beaucoup. Les gérants du domaine peuvent directement interagir avec les réservations et notamment en créer manuellement.

L'affichage détaillé des chiens de lignée de l'élevage et des chiens proposés par le domaine est un élément novateur dans le secteur de l'élevage de troupeaux, qui tarde encore à utiliser le web moderne.

![Feedback Facebook](https://tcastanie.dev/doma/fb-feedback.png)

Le site web déployé reflète bien la combinaison des gîtes et de l'élevage de chiens de troupeaux et reste simple et efficace dans ses objectifs : présenter le domaine et permettre la réservation.

## Version 2 en août 2025

Pour mieux répondre aux besoins du métier et pour suivre l'évolution de la demande des clients du Domaine, plusieurs fonctionnalités ont été revues et d'autres ont été ajoutées.

### Back-office sur-mesure

Développement d'un back-office répondant exactement aux besoins de gestion des réservations des gîtes, mais aussi des cours de dressage de chiens. Les opérations effectuées par les hôtes sont maintenant bien plus rapides et plus faciles à comprendre.

![Aperçu back-office](https://tcastanie.dev/doma/back-office.webp)

Un planning simplifié permettant de voir en un coup d'œil l'ensemble des visites attendues sur le Domaine ainsi que les informations importantes associées.

![Aperçu planning](https://tcastanie.dev/doma/planning.webp)

### Refonte du site et améliorations des pages d'accueil

- Un seul gîte est maintenant proposé à la location. Le code a été réécrit pour une meilleure maintenance.
- Réécriture des tunnels de réservation de location et de cours de dressage pour simplifier leur utilisation, suite aux retours des utilisateurs.
- Simplification du squelette du site et du menu d'en-tête.
- Ajout d'un formulaire de demande de pension, d'une page d'avis clients et d'une FAQ.
- Amélioration des *landing pages* avec plus de photos, de vidéos et d'animations agréables.
- Améliorations des fonctionnalités SEO (schémas, metadonnées, images OG...).
- Correction des erreurs liées au fuseau horaire de l'utilisateur.

### Mise à jour de la stack technique du site :

- Migration de **Nuxt** `v3` -> `v4`
- Utilisation de **Nuxt UI** et suppression de **UnoCSS**
- Paiements **Stripe** gérés directement par Nuxt (**Nitro**)
- Utilisation de **Motion** pour les animations

## Sitemap

See the full [sitemap](https://tcastanie.dev/sitemap.md) for all pages.