Introducción

El Internet de las Cosas (IoT) parece algo reservado a quien tiene dinero para placas, sensores y cables. Por eso mucha gente que quiere empezar se queda en la teoría. En este post te voy a demostrar que se puede montar una solución IoT completa —de principio a fin: dispositivo, nube y una web que lo muestra— sin comprar absolutamente nada de hardware.

Vamos a construir una estación de monitorización: un microcontrolador ESP32 (simulado) lee temperatura y humedad y las envía a la nube, y una página web las muestra en tiempo real, avisa cuando se supera un umbral y permite controlar un LED del dispositivo de forma remota.

Lo que vas a aprender:

  • Simular el dispositivo y el sensor en el navegador con Wokwi.
  • Enviar datos a la nube con el protocolo MQTT.
  • Crear un dashboard web que los recibe y los pinta en directo.
  • Controlar el dispositivo desde la web (comunicación bidireccional).

Desarrollo paso a paso

1. Crear el proyecto en Wokwi. Entra en wokwi.com, crea una cuenta gratis y pulsa New Project → ESP32. Verás dos pestañas: sketch.ino (el código) y diagram.json (el circuito).

2. Montar el circuito. En diagram.json se define un sensor DHT22 y un LED con su resistencia. Conexiones: el DHT22 va a 3V3, GND y al pin GPIO 15; el LED va del GPIO 2, a través de una resistencia de 220 Ω, a masa.

3. Añadir las librerías. Desde el Library Manager de Wokwi, añade PubSubClient y DHT sensor library for ESPx. Wokwi creará solo el archivo libraries.txt.

4. El código del ESP32. La lógica es sencilla: el ESP32 se conecta a la red WiFi virtual de Wokwi, se conecta a un broker MQTT público y gratuito (broker.emqx.io), y cada 2 segundos lee el sensor y publica un JSON con la temperatura y la humedad. Además, se suscribe a un canal de comandos para encender o apagar el LED. Un detalle importante: como el broker es público y compartido, el canal incluye un identificador único propio, para que tus datos no se mezclen con los de otra persona. Tienes el código completo en mi GitHub (enlace al final).

5. El dashboard web. El navegador no habla MQTT de la forma tradicional, así que se conecta mediante WebSocket seguro usando la librería MQTT.js. El dashboard se suscribe al canal de datos y, cada vez que llega un mensaje, actualiza los números, la gráfica y dispara la alerta si se supera el umbral. También tiene botones que publican ON/OFF para controlar el LED. Para usarlo, abre el archivo dashboard.html en el navegador, escribe el mismo identificador que pusiste en el ESP32 y pulsa Conectar.

6. Probarlo todo junto. Con la simulación corriendo y el dashboard conectado, los datos se actualizan solos cada 2 segundos. Si en Wokwi subes la temperatura del sensor por encima del umbral, en la web salta una alerta roja. Y si pulsas «Encender LED» en la web, el LED del ESP32 se enciende en la simulación.

Conclusiones

Algunos problemas que me encontré: al principio el dashboard no conectaba porque estaba usando el puerto de MQTT normal en lugar del de WebSocket seguro; y veía datos que no eran míos hasta que usé un identificador único en el canal, ya que el broker es público.

Recomendaciones: para algo serio, no uses un broker público; monta el tuyo o usa un servicio gestionado en la nube. Y manda los datos en JSON desde el principio, porque te facilita mucho añadir más sensores después.


Autor: Álvaro Buiza Máster: Desarrollo Full Stack + Arquitecturas Cloud Centro: Tajamar Tech Año académico: 2025-2026 Código / recursos: https://github.com/AlvaroBuiza/Demo-IoT-Video-TechRiders Vídeo: https://tajamar365-my.sharepoint.com/:v:/p/alvaro_buiza/IQBNi6UYLLFYRpT40fyQNajgAQSAlCJiG9Q0PftqpHxW6uU?e=BcvREU

Leave a Comment

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.