chore(init): initial commit

README.md

@@ -0,0 +1,100 @@
+# MD Editor
+
+Éditeur markdown en temps réel avec prévisualisation instantanée, coloration syntaxique, persistance locale et thème clair/sombre.
+
+## Fonctionnalités
+
+- **Split view** : zone de texte à gauche, prévisualisation à droite
+- **Rendu markdown temps réel** à chaque frappe
+- **Coloration syntaxique** des blocs de code (highlight.js), fond sombre type VSCode
+- **HTML sanitisé** avant injection (DOMPurify)
+- **Sauvegarde automatique** dans le localStorage (restaurée au rechargement)
+- **Bouton copier** le markdown ou le HTML (feedback visuel vert)
+- **Bouton télécharger** le contenu en `download.md`
+- **Bouton effacer** tout le contenu
+- **Thème clair/sombre** persistable, transition douce 350ms
+- **Responsive** jusqu'au mobile (panneaux empilés sous 768px)
+
+## Stack technique
+
+| Couche | Technologie |
+|--------|-------------|
+| Framework | React 19 + Vite 8 |
+| Langage | TypeScript ~6.0 (ESM) |
+| Styling | Tailwind CSS 4 (plugin `@tailwindcss/vite`) |
+| Markdown | marked 18 + marked-highlight 2 |
+| Coloration | highlight.js 11 |
+| Sanitisation | DOMPurify 3 |
+| Linter | oxlint |
+| Package manager | pnpm |
+
+## Prérequis
+
+- Node.js ≥ 20
+- pnpm ≥ 9 (ou utiliser npx si absent)
+
+## Installation
+
+```bash
+# 1. Cloner et entrer dans le projet
+git clone <url-du-repo> md-poc
+cd md-poc
+
+# 2. Installer les dépendances
+pnpm install
+
+# 3. Lancer le serveur de développement
+pnpm dev
+```
+
+Ouvrir http://localhost:5173.
+
+## Scripts
+
+| Commande | Description |
+|----------|-------------|
+| `pnpm dev` | Serveur de développement (HMR) |
+| `pnpm build` | Typecheck + build de production dans `dist/` |
+| `pnpm lint` | Lint oxlint |
+| `pnpm preview` | Prévisualise le build de production |
+
+## Structure du projet
+
+```
+src/
+  App.tsx                 # Orchestrateur : état markdown, parsing, handlers
+  main.tsx                # Entry point React
+  index.css               # Tailwind + variables de thème + styles markdown/hljs
+  types/types.ts          # Types et interfaces partagés
+  hooks/
+    useTheme.ts           # Thème + persistance + data-theme
+  components/
+    Header.tsx            # Barre supérieure (titre, actions, toggle thème)
+    CopyButton.tsx        # Bouton copie avec feedback "Copié !"
+    EditorInput.tsx       # Textarea markdown
+    Preview.tsx           # Prévisualisation HTML sanitisé
+    ThemeToggle.tsx       # Bouton lune/soleil
+  utils/
+    download.ts           # Téléchargement download.md
+```
+
+## Détails techniques
+
+### Rendu markdown
+- `marked.use(markedHighlight(...))` configuré une fois en haut de `App.tsx`
+- Bloc de code avec langage inconnu → fallback `plaintext`
+- Le HTML généré passe **toujours** par `DOMPurify.sanitize` avant injection
+- Mémorisation du parse avec `useMemo` (pas de recalcul au changement de thème)
+
+### Thème
+- Variables CSS (+ surcharge `[data-theme="dark"]`), pas de classes `dark:`
+- `useTheme` persiste le choix sous la clé `md-theme` et pose `data-theme` sur `<html>`
+- Les blocs de code restent sombres quel que soit le thème
+- Transition 350ms avec support `prefers-reduced-motion`
+
+### Persistance
+- Contenu markdown : clé `md-content` (écrite à chaque frappe)
+
+## Licence
+
+MIT — voir le fichier [LICENSE](./LICENSE).