diff --git a/index.html b/index.html
new file mode 100644
index 0000000..cdd04b7
--- /dev/null
+++ b/index.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+  <meta charset="UTF-8">
+  <title>Test Centrifugo</title>
+  <script src="https://unpkg.com/centrifuge@5.2.2/dist/centrifuge.js"></script>
+  <style>
+    body { font-family: monospace; padding: 20px; background: #1e1e1e; color: #d4d4d4; }
+    h2 { color: #569cd6; }
+    #log { background: #252526; padding: 15px; border-radius: 6px; height: 300px; overflow-y: auto; margin-bottom: 15px; }
+    .msg { margin: 4px 0; }
+    .msg.received { color: #4ec9b0; }
+    .msg.system  { color: #ce9178; }
+    input { background: #3c3c3c; color: #d4d4d4; border: 1px solid #555; padding: 8px; border-radius: 4px; width: 300px; }
+    button { background: #0e639c; color: white; border: none; padding: 8px 16px; border-radius: 4px; cursor: pointer; margin-left: 8px; }
+    button:hover { background: #1177bb; }
+  </style>
+</head>
+<body>
+  <h2>🧪 Test Centrifugo — Canal "chat"</h2>
+  <div id="log"></div>
+  <input id="msgInput" type="text" placeholder="Ton message..." />
+  <button onclick="publier()">Publier</button>
+
+  <script>
+    // ⚠️ En dev on utilise un token généré sans expiry
+    // En prod, ce token viendra de ton backend Go
+    const TOKEN_SECRET = "bADmFI1tcYaMiISB3bJZjVpfTp4cvjUB"; // doit matcher config.json
+
+    // Token JWT simple pour les tests (généré via jwt.io avec secret ci-dessus)
+    // Header: {"alg":"HS256","typ":"JWT"}
+    // Payload: {"sub":"user-test-1"}
+    // Tu peux en générer un sur https://jwt.io avec le secret : mon-secret-jwt-dev-1234
+    const TOKEN = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJ1c2VyLXRlc3QtMSJ9.HUYh6NE8LsmiBNHCJhk-CRY1MHvaFKFHZsvXw7ZL3Fw";
+
+    const log = document.getElementById('log');
+
+    function addLog(msg, type = 'system') {
+      const div = document.createElement('div');
+      div.className = `msg ${type}`;
+      div.textContent = `[${new Date().toLocaleTimeString()}] ${msg}`;
+      log.appendChild(div);
+      log.scrollTop = log.scrollHeight;
+    }
+
+    const centrifuge = new Centrifuge('ws://192.168.4.109:8010/connection/websocket', {
+      token: TOKEN
+    });
+
+    centrifuge.on('connected', ctx => addLog('✅ Connecté au serveur Centrifugo'));
+    centrifuge.on('disconnected', ctx => addLog('❌ Déconnecté'));
+
+    const sub = centrifuge.newSubscription('chat');
+
+    sub.on('publication', ctx => {
+      addLog(`📨 Reçu : ${JSON.stringify(ctx.data)}`, 'received');
+    });
+
+    sub.on('subscribed', ctx => addLog('📡 Abonné au canal "chat"'));
+
+    sub.subscribe();
+    centrifuge.connect();
+
+    function publier() {
+      const input = document.getElementById('msgInput');
+      const msg = input.value.trim();
+      if (!msg) return;
+      sub.publish({ text: msg, from: 'user-test-1' });
+      addLog(`📤 Publié : ${msg}`);
+      input.value = '';
+    }
+
+    document.getElementById('msgInput').addEventListener('keypress', e => {
+      if (e.key === 'Enter') publier();
+    });
+  </script>
+</body>
+</html>
\ No newline at end of file
