README.md

````markdown
# 🧮 Calculatrice Autonome en JavaScript (Vanilla JS & Tailwind CSS)

Un composant de calculatrice moderne, modulaire et entièrement autonome développé en **JavaScript pur** (ES6 Classes) et stylisé avec **Tailwind CSS**. Conçu pour être facilement intégré dans n'importe quelle page web via une simple balise `<script>`.

---

## 🚀 Fonctionnalités

- **Architecture Composant (POO)** : Encapsulé dans une classe JavaScript réutilisable (`SimpleCalculator`).
- **Interface Fluide & Stable** : Double affichage dynamique (historique de l'opération en haut et saisie en cours en bas) pour éviter les sauts visuels lors du choix des opérateurs.
- **Opérations de base** : Addition, soustraction, multiplication, division (avec gestion des erreurs de division par zéro).
- **Fonctions d'édition** : Touche de réinitialisation complète (`AC`) et suppression chiffre par chiffre (`⌫`).
- **Design Moderne** : Style épuré inspiré des interfaces sombres modernes, entièrement responsive grâce à Tailwind CSS.

---

## 📂 Structure du Projet

```text
calculatriceJS/
├── calculatrice.js    # Code source de la classe de la calculatrice
├── index.html         # Page de test et d'intégration
└── README.md          # Documentation du projet
```
````

---

## 🛠️ Installation et Utilisation

1. **Créer ou placer les fichiers** dans votre répertoire de projet.
2. **Inclure Tailwind CSS** et votre script dans votre fichier HTML :

```html
<!doctype html>
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Calculatrice</title>
    <!-- Chargement de Tailwind CSS -->
    <script src="[https://cdn.tailwindcss.com](https://cdn.tailwindcss.com)"></script>
  </head>
  <body
    class="bg-slate-900 text-slate-100 flex items-center justify-center min-h-screen"
  >
    <!-- 1. Créer un conteneur avec un ID unique -->
    <div id="maCalculatrice"></div>

    <!-- 2. Charger le script du composant -->
    <script src="./calculatrice.js"></script>

    <!-- 3. Initialiser l'instance -->
    <script>
      document.addEventListener("DOMContentLoaded", function () {
        new SimpleCalculator("maCalculatrice");
      });
    </script>
  </body>
</html>
```

---

## 📌 Commandes Git Utiles

Pour sauvegarder vos modifications et les envoyer sur votre dépôt distant (sur la branche `main`) :

```bash
# Vérifier l'état des fichiers
git status

# Ajouter les modifications
git add .

# Valider avec un message
git commit -m "Mise à jour de la calculatrice autonome"

# Envoyer sur la branche principale
git push origin main

```

---

## 📄 Licence

Ce projet est libre d'utilisation et de modification pour vos projets personnels ou professionnels.

```

```
calculatrice js V2.0 2026-08-21 15:49:37 +02:00			````markdown
			`# 🧮 Calculatrice Autonome en JavaScript (Vanilla JS & Tailwind CSS)`

			Un composant de calculatrice moderne, modulaire et entièrement autonome développé en JavaScript pur (ES6 Classes) et stylisé avec Tailwind CSS. Conçu pour être facilement intégré dans n'importe quelle page web via une simple balise `<script>`.

			`---`

			`## 🚀 Fonctionnalités`

			- Architecture Composant (POO) : Encapsulé dans une classe JavaScript réutilisable (`SimpleCalculator`).
			`- Interface Fluide & Stable : Double affichage dynamique (historique de l'opération en haut et saisie en cours en bas) pour éviter les sauts visuels lors du choix des opérateurs.`
			`- Opérations de base : Addition, soustraction, multiplication, division (avec gestion des erreurs de division par zéro).`
			- Fonctions d'édition : Touche de réinitialisation complète (`AC`) et suppression chiffre par chiffre (`⌫`).
			`- Design Moderne : Style épuré inspiré des interfaces sombres modernes, entièrement responsive grâce à Tailwind CSS.`

			`---`

			`## 📂 Structure du Projet`

			```text
			`calculatriceJS/`
			`├── calculatrice.js # Code source de la classe de la calculatrice`
			`├── index.html # Page de test et d'intégration`
			`└── README.md # Documentation du projet`
			```
			````

			`---`

			`## 🛠️ Installation et Utilisation`

			`1. Créer ou placer les fichiers dans votre répertoire de projet.`
			`2. Inclure Tailwind CSS et votre script dans votre fichier HTML :`

			```html
			`<!doctype html>`
			`<html lang="fr">`
			`<head>`
			`<meta charset="UTF-8" />`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0" />`
			`<title>Calculatrice</title>`
			`<!-- Chargement de Tailwind CSS -->`
			`<script src="[https://cdn.tailwindcss.com](https://cdn.tailwindcss.com)"></script>`
			`</head>`
			`<body`
			`class="bg-slate-900 text-slate-100 flex items-center justify-center min-h-screen"`
			`>`
			`<!-- 1. Créer un conteneur avec un ID unique -->`
			`<div id="maCalculatrice"></div>`

			`<!-- 2. Charger le script du composant -->`
			`<script src="./calculatrice.js"></script>`

			`<!-- 3. Initialiser l'instance -->`
			`<script>`
			`document.addEventListener("DOMContentLoaded", function () {`
			`new SimpleCalculator("maCalculatrice");`
			`});`
			`</script>`
			`</body>`
			`</html>`
			```

			`---`

			`## 📌 Commandes Git Utiles`

			Pour sauvegarder vos modifications et les envoyer sur votre dépôt distant (sur la branche `main`) :

			```bash
			`# Vérifier l'état des fichiers`
			`git status`

			`# Ajouter les modifications`
			`git add .`

			`# Valider avec un message`
			`git commit -m "Mise à jour de la calculatrice autonome"`

			`# Envoyer sur la branche principale`
			`git push origin main`

			```

			`---`

			`## 📄 Licence`

			`Ce projet est libre d'utilisation et de modification pour vos projets personnels ou professionnels.`

			```

			```