Pendahuluan

Di Home Assistant (#21) dan ESPHome (#22) kamu sudah membangun smart home lewat integrasi native. Artikel ini melanjutkan Jalur C dengan pendekatan berbeda: Node-RED — editor flow berbasis node yang menghubungkan MQTT, logika, dan dashboard visual tanpa menulis backend Python/PHP.

Node-RED sangat cocok untuk prototipe cepat, integrasi antar layanan, dan dashboard custom di LAN — sambil tetap memakai broker Mosquitto pribadi (#16) dan topic MQTT yang sama dengan ESP32 dari proyek gabungan (#9).

Prasyarat: Paham MQTT dasar (#7), broker Mosquitto + auth (#16) sudah jalan, dan ESP32 mempublish DHT22 + subscribe relay (sketch #9 atau setara — wiring DHT22 (#5)). Opsional: sudah baca #21 / #22 untuk membandingkan stack smart home.

Yang Kamu Butuhkan

  • PC / Raspberry Pi / VPS — bisa mesin yang sama dengan Mosquitto (#16)
  • Node.js 18+ (jika install npm) atau Docker
  • ESP32 yang publish ke topic Seri 1 (broker pribadi, bukan publik)
  • Browser untuk editor Node-RED (http://IP:1880)

Estimasi biaya: Node-RED gratis (open-source) — hardware sama proyek sebelumnya; bisa pakai Raspberry Pi yang sudah menjalankan Mosquitto.

Home Assistant vs ESPHome vs Node-RED

AspekHome Assistant (#21)ESPHome (#22)Node-RED (artikel ini)
FokusPlatform smart home lengkapFirmware ESP32 dari YAMLIntegrasi & flow visual
UIDashboard HA built-inEntitas di HADashboard Node-RED + flow canvas
AutomasiYAML / UI automasi HAVia HADrag-and-drop node (if/switch/function)
MQTTSubscriber/publisherNative API (+ MQTT opsional)Inti — mqtt in/out node
Kapan pakaiSmart home rumah tanggaFlash ESP32 cepatPrototipe, glue antar API, dashboard custom

Arsitektur: ESP32 → Mosquitto → Node-RED

KomponenPeranKoneksi
ESP32Publisher sensor & subscriber relayWiFi → Mosquitto :1883
Mosquitto (#16)Broker pusatTopic Seri 1 + auth
Node-REDDashboard + otomasi visualSubscribe/publish MQTT yang sama
Home Assistant (opsional)Bisa jalan paralelSubscriber MQTT terpisah — tidak bentrok

Alur data secara singkat:

  [ ESP32 — DHT22 + relay ]
      |
      |  publish: kodingindonesia/esp32/dht22/data  (JSON)
      |  subscribe: kodingindonesia/esp32/lampu/kontrol  (ON/OFF)
      v
  [ Mosquitto @ Pi / VPS ]  (#16)
      |
      |  MQTT
      v
  [ Node-RED :1880 ]
      |
      +-- dashboard: gauge suhu & kelembaban
      +-- tombol: NYALA / MATI lampu
      +-- automasi: suhu > 30°C → publish OFF

Topic MQTT (konsisten Seri 1):

  • Sensor: kodingindonesia/esp32/dht22/data — JSON {"suhu":28.5,"kelembaban":65.2}
  • Relay: kodingindonesia/esp32/lampu/kontrol — ON / OFF

Langkah 1 — Install Node-RED (Docker)

Cara termudah di server yang sudah punya Mosquitto:

# docker-compose.yml (tambahkan service di bawah Mosquitto)
services:
  nodered:
    image: nodered/node-red:latest
    container_name: nodered
    ports:
      - "1880:1880"
    volumes:
      - nodered_data:/data
    restart: unless-stopped

volumes:
  nodered_data:
docker compose up -d nodered
# Buka http://192.168.1.50:1880

Docker + Mosquitto di mesin sama: Dari dalam container Node-RED, broker MQTT pakai IP LAN host (mis. 192.168.1.50) — bukan localhost / 127.0.0.1, karena container punya network terpisah.

Install npm (alternatif): npm install -g --unsafe-perm node-red lalu node-red — cocok di Raspberry Pi tanpa Docker.

Langkah 2 — Pasang Dashboard UI

  1. Node-RED → menu ☰ → Manage palette
  2. Tab Install → cari node-red-dashboard
  3. Install → tunggu selesai → Deploy
  4. Di palette kiri, buka grup dashboard (bukan dashboard 2.0)
  5. Drag ui_tab ke canvas → isi nama tab, misalnya ESP32 Kindo
  6. Drag ui_group → pilih tab tadi → nama group Sensor DHT22
  7. Dashboard tersedia di http://IP:1880/ui setelah node ui_* di-deploy

Langkah 3 — Konfigurasi Broker MQTT

  1. Drag node mqtt in ke canvas
  2. Klik ikon pensil pada node → Add new mqtt-broker
  3. Isi (sesuaikan #16):
    • Server: 192.168.1.50 (IP LAN host; jika Node-RED native di mesin yang sama dengan Mosquitto, 127.0.0.1 boleh)
    • Jika Mosquitto dan Node-RED dalam satu docker-compose.yml, isi Server dengan nama service Mosquitto (mis. mosquitto) — Docker DNS internal mengenali hostname antar-container
    • Port: 1883
    • Username: kindo_esp32
    • Password: isi lewat credential store Node-RED — jangan hardcode di flow yang di-export
  4. Simpan broker — node mqtt in/out lain bisa pakai config yang sama

Broker publik: Jangan pakai test.mosquitto.org — sama seperti peringatan di #16 dan #21.

Langkah 4 — Flow Sensor DHT22 (Dashboard)

Rangkai node berikut (kiri → kanan):

  1. mqtt in — topic kodingindonesia/esp32/dht22/data, Output: auto-detect
  2. json — parse payload string ke object
  3. function — ekstrak nilai: 
    msg.payload = msg.payload.suhu;
return msg;
    (Duplikasi cabang dari output json — function kedua untuk kelembaban: 
    msg.payload = msg.payload.kelembaban;
return msg;
    lalu sambungkan ke ui_text)
  4. ui_gauge — pilih Group Sensor DHT22 yang sudah dibuat; set min 0, max 50 untuk suhu
  5. ui_text — group yang sama; tampilkan angka kelembaban (%)

Pastikan setiap node ui_gauge / ui_text terhubung ke ui_group — kalau group kosong, widget tidak muncul di /ui.

Klik Deploy → buka /ui → gauge harus bergerak setiap ~10 detik (interval publish ESP32).

Langkah 5 — Kontrol Relay dari Dashboard

  1. Drag ui_group baru di tab yang sama → nama Kontrol Lampu (group terpisah dari Sensor DHT22)
  2. Drag ui_button — pilih group Kontrol Lampu; label NYALA
  3. Drag change — set msg.payload = ON (string)
  4. mqtt out — topic kodingindonesia/esp32/lampu/kontrol; QoS 0 cukup
  5. Sambungkan berurutan: output ui_button → input change → input mqtt out (satu jalur untuk tombol NYALA)
  6. Duplikasi ketiga node untuk tombol MATI dengan payload OFF — tetap di group Kontrol Lampu
  7. Deploy → uji di /ui — relay ESP32 harus klik (pastikan sketch #8 / #9 subscribe topic ini)

Pro tip: Beri nama node yang jelas (DHT22 → Gauge Suhu) — flow kompleks cepat berantakan tanpa label.

Langkah 6 — Automasi Visual (Suhu > 30°C)

Tambahkan cabang paralel dari output json:

  1. function — cek threshold: 
    if (msg.payload.suhu > 30) {
    return { payload: "OFF", topic: "kodingindonesia/esp32/lampu/kontrol" };
}
return null;
  2. mqtt out — pilih broker yang sama dengan Langkah 3; kosongkan field Topic (Node-RED memakai msg.topic dari function) atau pilih msg.topic dari dropdown di field Topic

Rule ini jalan setiap kali payload sensor masuk (~10 detik). Berbeda dengan automasi Home Assistant (#21) yang bisa pakai for: 5 minutes — kalau lampu sering berkedip, tambahkan node delay (mis. 5 menit, rate limit 1 msg) atau trigger hanya saat suhu naik melewati 30°C, bukan setiap pembacaan di atas threshold.

Ini setara automasi numeric_state di Home Assistant (#21), tapi sepenuhnya visual di canvas Node-RED.

Import Flow (Opsional)

Jika ingin mempercepat, salin JSON berikut → menu ☰ → Import → clipboard → Deploy. Sesuaikan broker MQTT setelah import:

[
  {
    "id": "tab_esp32",
    "type": "tab",
    "label": "ESP32 MQTT Kindo"
  },
  {
    "id": "mqtt_broker_kindo",
    "type": "mqtt-broker",
    "name": "Mosquitto Kindo",
    "broker": "192.168.1.50",
    "port": "1883",
    "clientid": "nodered-kindo",
    "usetls": false,
    "credentials": {
      "user": "kindo_esp32",
      "password": "GANTI_PASSWORD_MQTT_ANDA"
    }
  }
]

JSON di atas hanya contoh tab + broker — setelah import, double-click broker node dan isi password lewat credential Node-RED (jangan simpan password asli di artikel/repo publik). Lengkapi node mqtt in, json, ui_gauge, dan mqtt out mengikuti Langkah 4–6.

Uji Coba (Checklist)

  1. ESP32 online — verifikasi publish dari terminal: 
    mosquitto_sub -h 192.168.1.50 -p 1883 \
  -u kindo_esp32 -P 'PASSWORD_ANDA' \
  -t "kodingindonesia/esp32/dht22/data" -v
  2. Node-RED /ui menampilkan suhu & kelembaban
  3. Tombol NYALA/MATI mengubah relay — atau uji tanpa dashboard: 
    mosquitto_pub -h 192.168.1.50 -p 1883 \
  -u kindo_esp32 -P 'PASSWORD_ANDA' \
  -t "kodingindonesia/esp32/lampu/kontrol" -m "ON"
  4. Automasi: hangatkan sensor (>30°C) → lampu mati otomatis
  5. Restart container Node-RED — flow harus restore dari volume /data

Gabung dengan Stack Seri 2

  • Home Assistant (#21) + Node-RED bisa subscribe topic yang sama — HA untuk rumah, Node-RED untuk integrasi custom
  • ESPHome (#22) untuk node baru; Node-RED untuk orkestrasi MQTT lintas perangkat
  • Sensor BME280 (#13) — tambah mqtt in ke topic kodingindonesia/esp32/bme280/data
  • Artikel #18 — simpan histori MQTT ke MySQL (flow Node-RED + function, atau subscriber Python)

Tips & Troubleshooting

  • Dashboard kosong: Pastikan sudah Deploy; cek tab UI di /ui; install node-red-dashboard
  • mqtt in tidak terima data: Topic case-sensitive; cek auth broker; ESP32 harus ke broker pribadi (#16)
  • JSON parse error: Pastikan node json setelah mqtt in; payload harus valid JSON dari #9
  • Relay tidak merespons: Cek topic lampu/kontrol; ESP32 perlu mqttClient.loop() di sketch
  • Node-RED & Mosquitto di Docker: Gunakan IP host atau nama service compose, bukan localhost dari dalam container lain
  • Port 1880 tidak bisa diakses: Buka firewall LAN; jangan expose ke internet tanpa auth
  • WiFi 2.4 GHz: ESP32 tidak support jaringan 5 GHz saja

Keamanan & Produksi

  • Aktifkan adminAuth di settings.js Node-RED — editor tanpa password berbahaya di LAN tamu
  • Jangan expose port 1880 ke internet tanpa HTTPS + reverse proxy
  • Simpan kredensial MQTT di credential store Node-RED (bukan hardcode di flow export publik)
  • Backup folder /data (volume Docker) berisi flow — sama pentingnya dengan backup HA
  • Untuk MQTT over internet, gunakan TLS (#17) — bukan port 1883 plain

Langkah Selanjutnya (Seri 2)

  • PIR + lampu MQTT (#24) — automasi gerak dengan debounce & hold time
  • Artikel #17: MQTT TLS — amankan Mosquitto di internet
  • Artikel #18: Python subscriber → MySQL untuk histori sensor
  • Capstone greenhouse (#39) — gabung sensor, Node-RED/HA, dan aktuator

Node-RED melengkapi Jalur C: prototipe dashboard dan otomasi MQTT dalam hitungan menit. Lanjutkan di halaman artikel Koding Indonesia.