Cours Complet : Arduino + MQTT + Web – Contrôle tes LEDs depuis ton téléphone 🚀
PARTIE 1 — INTRODUCTION : Pourquoi ce projet est magique ?
Objectif : Découvrir l’architecture globale (Arduino + MQTT + Web) et son utilité.
Ce que tu vas apprendre
Tu vas découvrir comment faire discuter ton Arduino avec une page web, comme si tu envoyais des SMS à tes LEDs ! 💬 On va utiliser RabbitMQ (un "standardiste" qui transmet les messages) pour que ton téléphone puisse :
- Allumer une LED à distance.
- Lire la valeur d’un potentiomètre en temps réel.
Pourquoi c’est utile (et amusant)
Imagine :
- Allumer la lumière de ta chambre depuis ton canapé, juste avec ton téléphone. 🛋️➡️💡
- Voir en direct le niveau d’humidité de tes plantes sur ton écran. 🌱📊
- Piloter un robot ou une station météo depuis l’autre bout de la maison. 🤖🌦️
Avec ce projet, tu poses les bases de la domotique sans te prendre la tête. Et le meilleur ? Tu peux tout adapter à tes idées !
Le plan du projet
Voici comment on va s’y prendre, étape par étape :
1️⃣ Prépare ton matériel : LEDs, potentiomètre, et ton Arduino R4 WiFi (ton "chef d’orchestre").
2️⃣ Installe RabbitMQ (le "standardiste") dans Docker, comme une appli sur ton ordi.
3️⃣ Configure MAMP (un serveur web tout simple) pour afficher une jolie page de contrôle sur ton téléphone.
4️⃣ Code l’Arduino pour qu’il écoute les ordres (ex : "Allume la LED 13 !") et renvoie des infos (ex : "Le potentiomètre est à 36%").
5️⃣ Teste tout : tu cliques sur ton téléphone, et pouf ! La LED s’allume. Magique, non ? ✨
À la fin, tu auras une interface web qui ressemble à un tableau de bord de vaisseau spatial… mais en version Arduino ! 🚀
PARTIE 2 — PRÉPARE TON MATÉRIEL COMME UN PRO 🛒
Objectif : Vérifier et organiser les composants avant de commencer.
Liste de courses
| Composant | Quantité | Où l'acheter | Prix estimé |
|---|---|---|---|
| Arduino R4 WiFi | 1 | Amazon / Mouser | 30€ |
| LEDs (rouge + verte) | 2 | Gotronic / Amazon | 1€ |
| Résistances 220Ω | 2 | Kit de résistances (Amazon) | 0,50€ |
| Potentiomètre 10kΩ | 1 | SparkFun / ElectroDragon | 2€ |
| Breadboard | 1 | Kit de démarrage (Amazon) | 5€ |
| Câbles de connexion | 6 | Kit de câbles dupont (Amazon) | 3€ |
| Budget total | ~41,50€ |
Avant de commencer, vérifie :
- Tu as tous les composants : Sors-les de leur emballage et pose-les devant toi comme un chef étoilé prépare ses ingrédients. 👨🍳
- Ton Arduino est reconnu par ton PC :
- Branche-le en USB et ouvre l’IDE Arduino.
- Va dans Outils > Port et sélectionne le port COM correspondant (ex:
COM3ou/dev/ttyACM0). - Pas de port ? Suis ce tutoriel d’installation.
- Tu as 30 minutes devant toi sans interruption : Éteins les notifications, c’est l’heure de coder ! ⏳
Astuces de pro
- Range tes composants dans des boîtes à compartiments (comme celles pour les vis) pour ne plus jamais perdre une résistance.
- Prends une photo de ton montage avant de débrancher : ça sauve des vies quand tu veux le refaire plus tard !
PARTIE 3 — LE SCHÉMA DE CÂBLAGE : TON PLAN DE BATAILLE 🔌
Objectif : Brancher correctement LEDs et potentiomètre sur l’Arduino.
Vue d'ensemble
On va brancher 2 LEDs et un potentiomètre à ton Arduino R4 WiFi, comme si tu connectais des enceintes à une chaîne hi-fi. L’ordre est important :
- D’abord les LEDs (pour vérifier que le courant passe).
- Puis le potentiomètre (pour lire des valeurs analogiques).
Tableau des connexions
| Composant | Broche composant | ➜ | Arduino | Raison (facultatif) |
|---|---|---|---|---|
| LED 13 | Patte longue (+) | ➜ | Pin 13 | Signal numérique (ON/OFF) |
| LED 13 | Patte courte (-) | ➜ | GND via résistance | Protection contre le court-circuit |
| LED 12 | Patte longue (+) | ➜ | Pin 12 | Signal numérique (ON/OFF) |
| LED 12 | Patte courte (-) | ➜ | GND via résistance | Protection contre le court-circuit |
| Potentiomètre | Broche du milieu | ➜ | A0 | Lecture de la valeur analogique (0-1023) |
| Potentiomètre | Broche de gauche | ➜ | 5V | Alimentation pour créer une tension variable |
| Potentiomètre | Broche de droite | ➜ | GND | Référence de masse |
Note :
- Les résistances (220Ω) sont obligatoires pour les LEDs : sans elles, le courant serait trop fort et grillerait la LED (comme un tuyau d’arrosage sous trop de pression).
- Le potentiomètre se branche comme un robinet : la broche du milieu est la sortie (comme le bec du robinet), et les deux autres sont l’entrée (5V) et la sortie (GND).
Les 3 erreurs à ne JAMAIS faire
- Inverser les pattes de la LED → Risque : La LED ne s’allumera pas (comme une pile branchée à l’envers dans une lampe).
- Astuce : La patte longue (+) va toujours vers la broche Arduino, la courte (-) vers la résistance et la masse.
- Oublier la résistance pour les LEDs → Risque : La LED va griller en quelques secondes (comme une ampoule sans variateur de lumière).
- Astuce : Une résistance de 220Ω est idéale pour les LEDs classiques (rouge, verte, jaune).
- Brancher le potentiomètre à l’envers → Risque : La valeur lue sera toujours à 0 ou 1023 (comme un robinet qui ne laisse passer que de l’eau froide ou chaude).
- Astuce : La broche du milieu (A0) doit toujours être connectée à la sortie du potentiomètre.
PARTIE 4 — MQTT & WEBSOCKET : LES SUPER-POUVOIRS DE LA COMMUNICATION 🧠
Objectif : Comprendre comment Arduino parle au web (broker, topics, messages).
L'analogie pour tout comprendre
Imagine ton Arduino comme un chef d’orchestre qui dirige une petite troupe de musiciens :
- Les LEDs sont des percussionnistes : elles ne savent faire que deux choses, jouer (allumées) ou se taire (éteintes).
- Le potentiomètre est un violoniste : il peut jouer toutes les notes entre 0 et 100% (comme un volume de musique).
- RabbitMQ est le chef d’orchestre adjoint : il transmet les ordres du public (ton téléphone) aux musiciens (Arduino) et vice versa.
Quand tu cliques sur un bouton dans ton navigateur :
- Ton téléphone envoie un message "Allume la LED 13 !" à RabbitMQ.
- RabbitMQ le transmet à l’Arduino.
- L’Arduino exécute l’ordre et répond "C’est fait !".
- RabbitMQ renvoie la confirmation à ton téléphone.
Comment ça marche techniquement
Étape 1 : Connexion au broker
- L’Arduino se connecte à RabbitMQ (le "standardiste") via WiFi, comme tu te connectes à ta box internet.
Étape 2 : Abonnement aux topics
- L’Arduino s’abonne à des "topics" (comme des chaînes de discussion) :
arduino/led13pour recevoir les ordres de la LED 13.arduino/potpour envoyer la valeur du potentiomètre.
Étape 3 : Envoi/réception des messages
- Quand tu cliques sur un bouton dans ton navigateur, un message est envoyé au topic
arduino/led13. - L’Arduino reçoit le message, allume la LED, et envoie une confirmation au topic
arduino/feedback.
À retenir
"MQTT, c’est comme des SMS pour objets connectés : léger, rapide, et sans fil."
Exemple concret : Une station météo qui envoie la température toutes les 5 minutes à ton téléphone.
PARTIE 5 — CODE PARTIE 1 : CONFIGURATION DE L'ARDUINO 💻
Objectif : Configurer les broches, le WiFi et MQTT.
Ce que fait cette partie du code
Ici, on configure l’Arduino comme un chef d’orchestre qui se présente à son public :
- On déclare les broches (où brancher les LEDs et le potentiomètre).
- On initialise les variables (comme des post-it pour se souvenir de l’état des LEDs).
- On prépare la connexion WiFi et MQTT (pour que l’Arduino puisse discuter avec ton téléphone).
Code commenté ligne par ligne
// ---- Inclusion des bibliothèques ----
#include <WiFiS3.h> // Pour gérer le WiFi de l'Arduino R4
#include <MQTT.h> // Pour communiquer en MQTT (comme des SMS)
#include "secrets.h" // Fichier externe qui contient tes identifiants WiFi (SSID + mot de passe)
// ---- Configuration IP fixe ----
// Comme une adresse postale pour ton Arduino sur le réseau
IPAddress localIP(192, 168, 1, 165); // Adresse IP de l'Arduino (modifiable si conflit)
IPAddress gateway(192, 168, 1, 1); // Adresse de ta box (généralement 192.168.1.1)
IPAddress subnet(255, 255, 255, 0); // Masque de sous-réseau (ne change pas)
IPAddress dns(8, 8, 8, 8); // DNS de Google (pour résoudre les noms de domaine)
// ---- Initialisation des clients ----
WiFiClient net; // Client WiFi (comme un câble réseau virtuel)
MQTTClient client; // Client MQTT (pour envoyer/recevoir des messages)
// ---- Déclaration des broches ----
const int ledPin13 = 13; // Broche pour la LED 13 (celle intégrée à l'Arduino R4)
const int ledPin12 = 12; // Broche pour la LED 12 (externe)
const int potPin = A0; // Broche analogique pour le potentiomètre (A0 = entrée analogique)
// ---- Variables d'état ----
bool ledState13 = false; // État de la LED 13 (false = éteinte, true = allumée)
bool ledState12 = false; // État de la LED 12
unsigned long lastPublishTime = 0; // Dernier moment où on a envoyé des données
const long publishInterval = 1000; // Délai entre chaque envoi (1000 ms = 1 seconde)
// ---- Fonction pour se connecter au WiFi ----
void connectWiFi() {
Serial.print("Connexion au WiFi..."); // Message dans le moniteur série
// On configure l'IP fixe (comme une adresse postale fixe)
WiFi.config(localIP, dns, gateway, subnet);
// On se connecte avec les identifiants du fichier "secrets.h"
WiFi.begin(WIFI_SSID, WIFI_PASSWORD);
// Tant qu'on n'est pas connecté, on attend et on affiche des points
while (WiFi.status() != WL_CONNECTED) {
Serial.print(".");
delay(1000); // On attend 1 seconde avant de réessayer
}
Serial.println("\nConnecté au WiFi !"); // Message de confirmation
Serial.print("Adresse IP : ");
Serial.println(WiFi.localIP()); // Affiche l'IP de l'Arduino
}
// ---- Fonction pour se connecter à MQTT ----
void connectMQTT() {
Serial.print("Connexion à MQTT...");
// On se connecte au broker MQTT (RabbitMQ)
client.begin("192.168.1.XX", net); // Remplace XX par l'IP de ton ordinateur
client.onMessage(messageReceived); // Fonction appelée quand un message arrive
// Tant qu'on n'est pas connecté, on attend
while (!client.connect("arduinoClient", "user", "password")) { // Remplace user/password
Serial.print(".");
delay(1000);
}
Serial.println("\nConnecté au MQTT !");
// On s'abonne aux topics pour recevoir les ordres
client.subscribe("arduino/led13");
client.subscribe("arduino/led12");
}
// ---- Fonction appelée quand un message MQTT arrive ----
void messageReceived(String &topic, String &payload) {
Serial.print("Message reçu sur topic : ");
Serial.println(topic);
Serial.print("Contenu : ");
Serial.println(payload);
// Si le message est pour la LED 13
if (topic == "arduino/led13") {
if (payload == "on") {
digitalWrite(ledPin13, HIGH); // Allume la LED
ledState13 = true;
} else if (payload == "off") {
digitalWrite(ledPin13, LOW); // Éteint la LED
ledState13 = false;
}
}
// Si le message est pour la LED 12
if (topic == "arduino/led12") {
if (payload == "on") {
digitalWrite(ledPin12, HIGH);
ledState12 = true;
} else if (payload == "off") {
digitalWrite(ledPin12, LOW);
ledState12 = false;
}
}
}
// ---- Configuration initiale (setup) ----
void setup() {
Serial.begin(115200); // Initialise la communication série
pinMode(ledPin13, OUTPUT); // Configure la broche 13 en sortie
pinMode(ledPin12, OUTPUT); // Configure la broche 12 en sortie
connectWiFi(); // Se connecte au WiFi
connectMQTT(); // Se connecte à MQTT
}
// ---- Boucle principale (loop) ----
void loop() {
client.loop(); // Garde la connexion MQTT active
// Envoie les données toutes les X secondes
if (millis() - lastPublishTime > publishInterval) {
lastPublishTime = millis();
// Lit la valeur du potentiomètre (0-1023)
int potValue = analogRead(potPin);
// Convertit en pourcentage (0-100%)
int potPercentage = map(potValue, 0, 1023, 0, 100);
// Envoie la valeur du potentiomètre au topic "arduino/pot"
client.publish("arduino/pot", String(potPercentage));
// Envoie l'état des LEDs
client.publish("arduino/led13/state", ledState13 ? "on" : "off");
client.publish("arduino/led12/state", ledState12 ? "on" : "off");
}
}
Exercice rapide
Mission : Modifie la variable publishInterval à la ligne 25 et passe de 1000 à 5000.
- Valeur initiale : 1000 ms (1 seconde).
- Valeur modifiée : 5000 ms (5 secondes).
Résultat attendu :
- Les données du potentiomètre seront envoyées toutes les 5 secondes au lieu de 1 seconde.
- Pourquoi ? Pour réduire la fréquence d’envoi et économiser de la bande passante.
PARTIE 6 — CODE PARTIE 2 : INTERFACE WEB EN HTML/JS 🌐
Objectif : Créer une page web pour contrôler l’Arduino.
Ce que fait cette partie du code
Ici, on crée une interface web qui envoie des ordres à l’Arduino via MQTT :
- Des boutons pour allumer/éteindre les LEDs.
- Une jauge pour afficher la valeur du potentiomètre en temps réel.
- Une connexion MQTT pour communiquer avec l’Arduino.
Code commenté ligne par ligne
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contrôle Arduino depuis ton téléphone</title>
<style>
/* ---- Styles CSS ---- */
body {
font-family: Arial, sans-serif;
text-align: center;
margin: 20px;
background-color: #f0f0f0;
}
h1 {
color: #333;
}
.button {
background-color: #4CAF50;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 10px;
cursor: pointer;
border-radius: 8px;
}
.button.off {
background-color: #f44336;
}
#potValue {
font-size: 24px;
margin: 20px;
}
#connectionStatus {
padding: 10px;
border-radius: 5px;
margin: 10px;
}
.connected {
background-color: #4CAF50;
color: white;
}
.disconnected {
background-color: #f44336;
color: white;
}
</style>
</head>
<body>
<h1>Contrôle ton Arduino depuis ton téléphone</h1>
<!-- Boutons pour les LEDs -->
<button id="toggleButton13" class="button">Allumer LED 13</button>
<button id="toggleButton12" class="button">Allumer LED 12</button>
<!-- Jauge pour le potentiomètre -->
<div id="potValue">Potentiomètre : 0%</div>
<progress id="potProgress" value="0" max="100" style="width: 80%; height: 30px;"></progress>
<!-- Statut de la connexion -->
<div id="connectionStatus" class="disconnected">Déconnecté</div>
<!-- Bibliothèque MQTT -->
<script src="https://unpkg.com/mqtt/dist/mqtt.min.js"></script>
<script>
// ---- Configuration MQTT ----
const mqttConfig = {
host: '192.168.1.XX', // Remplace XX par l'IP de ton ordinateur
port: 1983, // Port WebSocket de RabbitMQ
username: 'user', // Remplace par ton username MQTT
password: 'password' // Remplace par ton password MQTT
};
// ---- Connexion au broker MQTT ----
const client = mqtt.connect(`ws://${mqttConfig.host}:${mqttConfig.port}`, {
username: mqttConfig.username,
password: mqttConfig.password
});
// ---- Éléments du DOM ----
const toggleButton13 = document.getElementById('toggleButton13');
const toggleButton12 = document.getElementById('toggleButton12');
const potValue = document.getElementById('potValue');
const potProgress = document.getElementById('potProgress');
const connectionStatus = document.getElementById('connectionStatus');
// ---- Mise à jour du statut de connexion ----
function updateConnectionStatus(status, message) {
connectionStatus.textContent = message;
connectionStatus.className = status;
}
// ---- Connexion MQTT ----
client.on('connect', () => {
updateConnectionStatus('connected', 'Connecté au broker MQTT !');
console.log('Connecté au broker MQTT');
// On s'abonne aux topics pour recevoir les mises à jour
client.subscribe('arduino/pot');
client.subscribe('arduino/led13/state');
client.subscribe('arduino/led12/state');
});
// ---- Réception des messages MQTT ----
client.on('message', (topic, message) => {
console.log(`Message reçu sur ${topic}: ${message}`);
// Met à jour la jauge du potentiomètre
if (topic === 'arduino/pot') {
const value = parseInt(message.toString());
potValue.textContent = `Potentiomètre : ${value}%`;
potProgress.value = value;
}
// Met à jour l'état des LEDs
if (topic === 'arduino/led13/state') {
toggleButton13.textContent = message.toString() === 'on' ? 'Éteindre LED 13' : 'Allumer LED 13';
toggleButton13.className = message.toString() === 'on' ? 'button off' : 'button';
}
if (topic === 'arduino/led12/state') {
toggleButton12.textContent = message.toString() === 'on' ? 'Éteindre LED 12' : 'Allumer LED 12';
toggleButton12.className = message.toString() === 'on' ? 'button off' : 'button';
}
});
// ---- Envoi d'une commande MQTT ----
function toggleLed(ledNumber) {
if (client.connected) {
const topic = `arduino/led${ledNumber}`;
const currentState = document.getElementById(`toggleButton${ledNumber}`).textContent;
const newState = currentState.includes('Allumer') ? 'on' : 'off';
client.publish(topic, newState);
console.log(`Commande envoyée : ${topic} ${newState}`);
} else {
updateConnectionStatus('disconnected', 'Impossible d\'envoyer la commande: non connecté');
}
}
// ---- Événements des boutons ----
toggleButton13.addEventListener('click', () => toggleLed(13));
toggleButton12.addEventListener('click', () => toggleLed(12));
</script>
</body>
</html>
Exercice rapide
Mission : Change le délai de rafraîchissement de la jauge en modifiant la fréquence d’envoi des données dans le code Arduino (Partie 5).
- Valeur initiale : 1000 ms (1 seconde).
- Valeur modifiée : 200 ms (0,2 seconde).
Résultat attendu :
- La jauge du potentiomètre se mettra à jour 5 fois plus vite.
- Pourquoi ça marche ? Parce que l’Arduino envoie les données plus fréquemment, donc l’interface web les reçoit plus souvent.
PARTIE 7 — TEST : VÉRIFIE QUE TOUT FONCTIONNE 🧪
Objectif : Tester le projet et valider son fonctionnement.
Mise sous tension
- Branche ton Arduino au port USB de ton ordinateur.
- Vérifie : La LED orange "ON" doit s’allumer sur l’Arduino.
- Ouvre l’IDE Arduino et sélectionne le bon port COM.
- Téléverse le code (Partie 5) sur l’Arduino.
- Vérifie : La LED intégrée (broche 13) doit clignoter rapidement pendant le téléversement, puis s’éteindre.
- Ouvre le moniteur série (Outils > Moniteur série, vitesse 115200 bauds).
- Vérifie : Tu dois voir les messages
"Connecté au WiFi !"et"Connecté au MQTT !".
- Vérifie : Tu dois voir les messages
- Ouvre le fichier HTML (Partie 6) dans ton navigateur.
- Vérifie : La page doit afficher
"Connecté au broker MQTT !".
- Vérifie : La page doit afficher
Comportement attendu
Ce que tu dois voir :
- Sur l’interface web :
- Les boutons "Allumer LED 13" et "Allumer LED 12" doivent être actifs.
- La jauge du potentiomètre doit bouger quand tu tournes le bouton.
- Sur l’Arduino :
- La LED 13 doit s’allumer quand tu cliques sur le bouton correspondant.
- La LED 12 doit réagir de la même façon.
- Dans le moniteur série :
- Des messages comme
"Led13 on","Led12 off", et"pot XX"doivent défiler toutes les secondes.
- Des messages comme
Timing :
- Les messages MQTT doivent s’afficher toutes les secondes (ou selon ton
publishInterval). - Les LEDs doivent s’allumer/éteindre instantanément quand tu cliques sur les boutons.
Ça marche ?
Bravo ! 🎉 Tu viens de :
- Faire communiquer ton Arduino avec une page web comme un pro.
- Créer une interface de contrôle à distance pour tes LEDs et ton potentiomètre.
- Poser les bases de la domotique (tu peux maintenant contrôler n’importe quel composant depuis ton téléphone !).
Partage ta victoire ! :
- Prends une photo de ton montage et poste-la sur notre groupe Facebook avec le hashtag #PlaisirArduino.
- Enregistre une courte vidéo de l’interface web en action et envoie-la à un ami pour lui montrer ta création !
Ça ne marche pas ?
Pas de panique, c’est normal ! Direction la Partie 8 — Dépannage pour trouver la solution.
PARTIE 8 — DÉPANNAGE : LES SOLUTIONS À TES PROBLÈMES 🛠️
Objectif : Résoudre les problèmes courants.
Problème 1 : Les LEDs ne s’allument pas
Symptôme : Les LEDs restent éteintes même quand tu cliques sur les boutons.
Cause probable :
- Câblage incorrect (inversion des pattes de la LED ou oubli de la résistance).
- Broches mal déclarées dans le code Arduino.
Solution :
- Vérifie que la patte longue de la LED est branchée sur la broche Arduino (13 ou 12) et la patte courte sur la masse (GND) via une résistance.
- Vérifie que les broches sont bien déclarées dans le code :
const int ledPin13 = 13; const int ledPin12 = 12; - Teste les LEDs manuellement en branchant directement la patte longue sur le 5V (avec résistance).
Comment vérifier :
- Ouvre le moniteur série et cherche les messages
"Led13 on"ou"Led12 on". Si tu les vois mais que les LEDs ne s’allument pas, c’est un problème de câblage.
Problème 2 : La jauge du potentiomètre ne bouge pas
Symptôme : La jauge reste à 0% même quand tu tournes le potentiomètre.
Cause probable :
- Câblage incorrect du potentiomètre (broche du milieu non connectée à A0).
- Code Arduino mal configuré pour lire la valeur analogique.
Solution :
- Vérifie que la broche du milieu du potentiomètre est branchée sur A0.
- Vérifie que les autres broches sont branchées sur 5V et GND.
- Dans le code Arduino, vérifie que la broche est bien déclarée :
const int potPin = A0; - Teste le potentiomètre manuellement en affichant sa valeur dans le moniteur série :
Serial.println(analogRead(A0));
Comment vérifier :
- Tourne le potentiomètre et observe le moniteur série. Si la valeur change, c’est un problème avec l’interface web (vérifie la connexion MQTT).
Problème 3 : L’interface web affiche "Déconnecté"
Symptôme : La page web affiche "Déconnecté" et les boutons ne fonctionnent pas.
Cause probable :
- RabbitMQ n’est pas lancé ou l’IP est incorrecte.
- Le port WebSocket (1883) est bloqué par un pare-feu.
Solution :
- Vérifie que RabbitMQ est lancé dans Docker :
- Ouvre Docker Desktop et vérifie que le conteneur
rabbitmqest en cours d’exécution. - Si ce n’est pas le cas, lance-le avec :
docker run --name rabbitmqWeb -p 5672:5672 -p 15672:15672 -p 15675:15675 -p 1883:1883 rabbitmq:3.13-management
- Ouvre Docker Desktop et vérifie que le conteneur
- Vérifie que l’IP du broker MQTT est correcte dans le code HTML :
host: '192.168.1.XX', // Remplace XX par l'IP de ton ordinateur - Vérifie que le port 1883 est ouvert :
- Sur Windows : Ouvre le pare-feu et autorise le port 1883.
- Sur Mac/Linux : Vérifie avec
netstat -tuln | grep 1883.
Comment vérifier :
- Ouvre MQTT Explorer et essaie de te connecter au broker avec les mêmes identifiants que dans le code HTML. Si ça ne marche pas, c’est un problème de broker.
Toujours bloqué ?
Pas de panique ! Voici ce que tu peux faire :
- Relis les étapes : Vérifie que tu n’as pas sauté une étape du câblage ou du code.
- Cherche des indices : Les messages dans le moniteur série sont tes meilleurs amis.
- Demande de l’aide :
- Poste une photo de ton montage et une capture d’écran du moniteur série dans notre groupe Facebook.
- Décris précisément ce qui ne marche pas (ex : "La LED 13 s’allume mais ne s’éteint pas quand je clique").
- On est là pour t’aider ! 🚀
PARTIE 9 — RÉSUMÉ : CE QU’ON A FAIT ENSEMBLE 🎉
Objectif : Faire le bilan des compétences acquises.
Ce qu’on a accompli
On a construit un système malin où ton Arduino discute avec ton téléphone comme deux potes qui s’envoient des messages. Voici ce qu’on a fait :
1️⃣ On a branché les composants : deux LEDs et un potentiomètre sur l’Arduino, comme des musiciens prêts à jouer.
2️⃣ On a installé RabbitMQ (le "standardiste") dans Docker pour qu’il transmette les ordres entre ton téléphone et l’Arduino.
3️⃣ On a configuré MAMP pour afficher une page web sur ton téléphone, avec des boutons pour contrôler les LEDs et une jauge pour le potentiomètre.
4️⃣ On a codé l’Arduino pour qu’il :
- Se connecte au WiFi (comme quand tu te connectes à ta box).
- Écoute les messages MQTT (les "SMS" du projet).
- Allume/éteint les LEDs ou renvoie la valeur du potentiomètre. 5️⃣ On a testé et débogué : on a vérifié que tout fonctionnait et corrigé les erreurs.
Ce que tu peux faire maintenant
Avec ce projet, tu as toutes les clés pour créer tes propres systèmes connectés :
- Une station météo : Ajoute un capteur de température et affiche les données sur ton téléphone.
- Un système d’arrosage automatique : Utilise un relais pour contrôler une pompe à eau.
- Un robot télécommandé : Ajoute des moteurs et contrôle-les depuis ton navigateur.
Le plus beau ? Tu peux tout adapter à tes idées !
PARTIE 10 — ALLER PLUS LOIN : ET MAINTENANT ? 🚀
Objectif : Donner des idées pour aller plus loin.
3 projets pour continuer
- Station météo connectée
- Ajoute un capteur DHT11 pour mesurer la température et l’humidité.
- Affiche les données sur ton interface web avec des graphiques.
- Matériel : DHT11 (5€), câbles.
- Système d’arrosage automatique
- Utilise un relais pour contrôler une pompe à eau.
- Programme l’arrosage en fonction de l’humidité du sol (capteur FC-28).
- Matériel : Relais (3€), pompe à eau (10€), capteur FC-28 (5€).
- Robot télécommandé
- Ajoute des moteurs et un module L298N pour les contrôler.
- Contrôle le robot depuis ton téléphone avec des boutons directionnels.
- Matériel : 2 moteurs DC (10€), module L298N (5€), châssis (15€).
Ressources pour aller plus loin
- Tutoriels :
- Communauté :
- Rejoins notre groupe Facebook pour poser tes questions.
- Participe à nos live YouTube pour des projets en direct.
- Outils :
- MQTT Explorer : Pour visualiser les messages MQTT.
- PlatformIO : Un IDE plus puissant que l’IDE Arduino.
Ton prochain défi
Mission : Ajoute une troisième LED à ton projet et contrôle-la depuis ton interface web.
- Indice : Il suffit de dupliquer le code pour la LED 13 ou 12 et de modifier les broches.
Partage ton résultat avec le hashtag #PlaisirArduino – on a hâte de voir tes créations ! 😊
5. VOCABULAIRE CLÉS
| Terme | Définition ultra-simple (max 15 mots) | Analogie du quotidien |
|---|---|---|
| MQTT | Protocole de messagerie léger pour objets connectés. | Comme des SMS entre ton Arduino et ton téléphone. |
| Broker | Serveur qui transmet les messages entre appareils. | Comme un standardiste qui transmet les appels. |
| Topic | Canal de discussion pour envoyer/recevoir des messages. | Comme une chaîne de discussion WhatsApp. |
| WebSocket | Connexion permanente entre un navigateur et un serveur. | Comme un appel téléphonique en continu. |
| Potentiomètre | Composant qui ajuste une valeur (ex : volume). | Comme le bouton de volume de ta chaîne hi-fi. |
| Breadboard | Plaque pour brancher des composants sans souder. | Comme une planche à pain pour l’électronique. |
6. POINTS D'ATTENTION PÉDAGOGIQUE
- Pour les débutants :
- Insiste sur l’importance de vérifier le câblage avant de coder.
- Explique que les résistances sont obligatoires pour les LEDs (risque de griller le composant).
- Montre comment utiliser le moniteur série pour déboguer.
- Pour les intermédiaires :
- Encourage à modifier le code pour comprendre comment ça marche.
- Propose des exercices rapides (ex : changer la fréquence d’envoi des données).
- Montre comment adapter le projet (ajouter des capteurs, des moteurs, etc.).
- Pour tous :
- Rassure : Les erreurs sont normales, même les pros en font !
- Encourage : Partage tes résultats et pose des questions.
- Inspire : Montre des exemples de projets réalisés par la communauté.
Félicitations ! 🎉 Tu as maintenant toutes les clés pour créer des projets Arduino connectés. À toi de jouer ! 🚀
Recevez gratuitement les codes sources de la communauté de Eugénio

Amusez-vous tout de suite avec les entrées/sorties de votre carte Arduino Uno
Vous y retrouverez : des scketchs, des schémas et des PDF