Tutorial Smart Lamp (WiFi Control) dengan ESP8266

Pada tutorial ini kita akan membuat Smart Lamp sederhana menggunakan ESP8266 + Relay, yang bisa dikontrol langsung dari HP atau browser tanpa internet.

ESP8266 akan berjalan dalam mode Access Point (AP), sehingga HP/laptop bisa langsung terhubung ke WiFi dari ESP8266, lalu mengontrol lampu lewat Web Server.

Alat & Bahan

Nama KomponenGambar Komponen
NodeMcu esp8266
Relay Module 1 Channel
Bola Lampu
Fitting Lampu
Kabel Jumper
Breadboard

Gambar Rangkaian

ESP8266Relay
pin D1pin S
vin / vupin +
GNDpin –

Library yang digunakan

  • ESP8266WiFi.h
  • ESPAsyncWebServer.h
  • ESPAsyncTCP.h

Code

#include <ESP8266WiFi.h>
#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>

#define RELAY_PIN D1

const char* ssid = "SmartLamp_AP";
const char* password = "12345678";

AsyncWebServer server(80);

bool lampState = false;

String processor() {
  String statusText = "";

  if (lampState == true) {
    statusText = "ON";
  } else {
    statusText = "OFF";
  }

  String html = "";
  html += "<!DOCTYPE html><html><head>";
  html += "<meta name='viewport' content='width=device-width, initial-scale=1'>";
  html += "<title>Smart Lamp</title>";
  html += "<style>";
  html += "body{font-family:Arial;text-align:center;margin-top:40px;}";
  html += "button{padding:15px 30px;font-size:18px;margin:10px;}";
  html += "</style>";
  html += "</head><body>";

  html += "<h1>Smart Lamp Control</h1>";
  html += "<p>Status: <b>" + statusText + "</b></p>";
  html += "<button onclick=\"fetch('/on')\">ON</button>";
  html += "<button onclick=\"fetch('/off')\">OFF</button>";

  html += "</body></html>";

  return html;
}

void setup() {
  pinMode(RELAY_PIN, OUTPUT);
  digitalWrite(RELAY_PIN, HIGH);

  WiFi.mode(WIFI_AP);
  WiFi.softAP(ssid, password);

  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(200, "text/html", processor());
  });

  server.on("/on", HTTP_GET, [](AsyncWebServerRequest *request){
    digitalWrite(RELAY_PIN, LOW);
    lampState = true;
    request->send(200, "text/plain", "ON");
  });

  server.on("/off", HTTP_GET, [](AsyncWebServerRequest *request){
    digitalWrite(RELAY_PIN, HIGH);
    lampState = false;
    request->send(200, "text/plain", "OFF");
  });

  server.begin();
}

void loop() {
  // Async Web Server tidak membutuhkan handleClient()
}

Petunjuk Penggunaan

  1. Unggah (upload) program Smart Lamp ke papan ESP8266 menggunakan Arduino IDE.
  2. Setelah proses upload selesai, aktifkan fitur WiFi pada perangkat HP atau laptop.
  3. Cari dan sambungkan perangkat ke jaringan WiFi dengan nama SmartLamp_AP.
  4. Buka aplikasi browser, kemudian akses alamat IP 192.168.4.1.
  5. Gunakan tombol ON atau OFF pada halaman web untuk mengendalikan kondisi lampu.

Sangat Perlu Untuk Diperhatikan

  1. Pastikan sumber listrik PLN dalam kondisi mati sebelum melakukan pemasangan atau perubahan rangkaian.
  2. Hindari menyentuh kabel AC, terminal relay, atau bagian logam lainnya saat rangkaian masih terhubung dengan sumber listrik.
  3. Gunakan box atau casing relay untuk melindungi rangkaian dari sentuhan langsung serta mengurangi risiko korsleting.
  4. Periksa kembali setiap sambungan kabel, pastikan terpasang dengan kuat dan tidak ada kabel yang terkelupas.
  5. Setelah semua komponen terpasang dengan benar, barulah sambungkan rangkaian ke sumber listrik dan lakukan pengujian secara bertahap.