🌸 Dr Sentis - Site Web

Un site web moderne et interactif pour le Dr Sentis, spécialisé en médecine intégrative et thérapies complémentaires.

📋 Aperçu du Projet

Ce site présente un cabinet médical avec une approche holistique de la santé, combinant médecine traditionnelle et thérapies alternatives. Le site offre une expérience utilisateur fluide avec des animations élégantes et des informations détaillées sur chaque thérapie.

🎯 Objectifs

• Présenter l'équipe médicale et la philosophie du cabinet
• Informer sur les différentes thérapies proposées
• Faciliter la prise de contact avec le cabinet
• Offrir une expérience utilisateur moderne et accessible

✨ Fonctionnalités

🎨 Design & Interface

• Design responsive : Adapté à tous les écrans (mobile, tablette, desktop)
• Animations fluides : Utilisation de Framer Motion pour des transitions élégantes
• Thème cohérent : Palette de couleurs apaisante (tons teal/turquoise)
• Navigation intuitive : Menu fixe avec ancres vers les sections
• Identité visuelle : Logo Fleur de Vie stylisée symbolisant l'harmonie et la géométrie sacrée
• Sections plein écran : Chaque section occupe la hauteur complète de l'écran pour une expérience immersive

📱 Sections du Site

🏠 Accueil

• Présentation générale du Dr Sentis
• Message d'accueil chaleureux : "Le Dr Sentis vous accueille"
• Design hero avec gradient attractif
• Section plein écran avec contenu centré

👥 Équipe

• Présentation des membres de l'équipe
• Rôles et spécialités de chacun
• Section plein écran avec mise en page centrée

🎯 Philosophie

• Approche médicale intégrative
• Principes de la médecine holistique
• Vision préventive vs curative
• Section plein écran avec arrière-plan teal-50

💊 Thérapies (Fonctionnalité Interactive ⭐)

• 6 thérapies détaillées :

  • Homéopathie
  • Micronutrition
  • Phytothérapie
  • Physiothérapie
  • Magnétothérapie & TeslaThérapie
  • Auriculothérapie

• Pop-ups informatifs : Clic sur chaque carte pour afficher :

  • Description détaillée de la thérapie
  • Indications principales (liste avec puces colorées)
  • Méthodes utilisées
  • Bénéfices attendus
  • Modal responsive avec animations Framer Motion
  • Fermeture par bouton X ou clic extérieur

• Section plein écran avec grille de cartes centrée

📍 Contact

• Adresse complète : 40 Rue du 8 Mai 1945, 38540 Grenay
• Coordonnées téléphoniques : 04 76 00 00 00
• Email : contact@cabinet-sentis.fr
• Carte interactive Google Maps intégrée avec localisation précise
• Coordonnées GPS : 45.66479435849921, 5.079586301884105
• Section plein écran avec arrière-plan teal-50

🆕 Améliorations Récentes

• 🌸 Logo Fleur de Vie : Icône personnalisée SVG représentant la géométrie sacrée
• 📱 Titre d'onglet : "Docteur Sentis" avec favicon esculape médical
• 🎨 Design uniforme : Toutes les sections en plein écran avec centrage cohérent
• ⚡ Performance : Suppression du thème sombre pour une expérience simplifiée
• 🎯 Navigation : Titre simplifié "Dr Sentis" dans le header
• 📍 Géolocalisation : Coordonnées GPS précises pour Grenay, Isère

🛠️ Technologies Utilisées

Frontend

• React 19 - Framework JavaScript moderne
• TypeScript - Typage statique pour un code plus robuste
• Vite - Outil de build ultra-rapide
• Tailwind CSS - Framework CSS utilitaire
• Framer Motion - Bibliothèque d'animations

Fonctionnalités Avancées

• React Scroll - Navigation fluide entre sections
• Lucide React - Icônes modernes et élégantes
• Google Maps - Intégration de carte interactive

Outils de Développement

• ESLint - Linting et qualité du code
• PostCSS - Traitement CSS avancé
• TypeScript - Configuration stricte

🚀 Installation et Configuration

Prérequis

• Node.js (version 18 ou supérieure)
• npm ou yarn

1️⃣ Cloner le Projet

git clone [URL_DU_REPO]
cd mon-cabinet

2️⃣ Installer les Dépendances

npm install

3️⃣ Lancer le Serveur de Développement

npm run dev

➡️ Le site sera accessible sur http://localhost:5173/

4️⃣ Build de Production

npm run build

➡️ Les fichiers optimisés seront dans le dossier dist/

🖥️ Scripts Disponibles

📁 Structure du Projet

mon-cabinet/
├── public/ # Fichiers statiques
├── src/
│ ├── App.tsx # Composant principal
│ ├── main.tsx # Point d'entrée
│ └── index.css # Styles globaux
├── dist/ # Build de production
├── server.js # Serveur Express simple
├── package.json # Dépendances et scripts
├── tailwind.config.js # Configuration Tailwind
├── tsconfig.json # Configuration TypeScript
├── vite.config.ts # Configuration Vite
└── README.md # Ce fichier

README rédigé avec claude