Kontrol LED WebServer

Web Server merupakan layanan yang berfungsi sebagai penerima permintaan yang dikirimkan melalui browser, kemudian memberikan tanggapan permintaan dalam bentuk halaman situs web (webpage) atau lebih umumnya dalam dokumen HTML. Saat mengambil halaman website, browser akan mengirimkan permintaan ke alamat server yang dituju, kemudian HTTP request akan dikirimkan ke web server lalu diproses. Setelah itu web server mengirimkan HTTP Respon ke browser dan memprosesnya menjadi halaman situs web. Salah satu contoh pengaplikasian web server yaitu digunakan untuk mengontrol perangkat IoT seperti kontrol LED web server.

1. Skema Rangkaian

Gambar rangkaian Kontrol LED

2. Alat / Bahan

• NodeMCU ESP8266  : 1 buah
• Breadboard                : 1 buah
• LED                            : 3 buah

[/membership]

3. Sketch Program

Belajar elektronika step by step dengan bantuan tangga belajar? Regitrasi dulu dan dapatkan konsultasi dari kami!

REGISTER SEKARANG>>

/*
    Program Kontrol LED Web Server
    dibuat oleh Indobot
*/
#include <ESP8266WiFi.h>  //Pendeklarasian Library
#include <ESP8266WebServer.h>

#define LED1 16  // Pemilihan Pin D0
#define LED2 5    // Pemilihan Pin D1
#define LED3 4    // Pemilihan Pin D2

const char* ssid = "Indobot";       // Nama SSID AP/Hotspot
const char* password = "123456789";    // Password Wifi

ESP8266WebServer server(80);      //Menyatakan Webserver pada port 80
String webpage;

void setup() {  //Pengaturan Pin
  Serial.begin(115200);
  delay(10);
  pinMode(LED1, OUTPUT);
  pinMode(LED2, OUTPUT);
  pinMode(LED3, OUTPUT);

  // Connect ke WiFi
  Serial.println();
  Serial.print("Configuring access point...");

  // Mengatur WiFi 
  WiFi.mode(WIFI_AP);                      // Mode Station
  WiFi.begin(ssid, password);               // Mencocokan SSID dan Password

  // Print status Connect 
  Serial.println("IP address: ");
  Serial.println(WiFi.softAPIP());

  // Isi dari Webpage 
  webpage += "<h1> Web Control LED ESP8266</h1>";
  webpage += "<p>LED 1 : ";
  webpage += "<a href=\"LED1ON\"\"><button>ON</button></a><a href=\"LED1OFF\"\"><button>OFF</button></a></p><br>";
  webpage += "<p>LED 2 : ";
  webpage += "<a href=\"LED2ON\"\"><button>ON</button></a><a href=\"LED2OFF\"\"><button>OFF</button></a></p><br>";
  webpage += "<p>LED 3 : ";
  webpage += "<a href=\"LED3ON\"\"><button>ON</button></a><a href=\"LED3OFF\"\"><button>OFF</button></a></p>";

  // Membuat file webpage 
  server.on("/", []() {
    server.send(200, "text/html", webpage);
  });

  // Bagian ini untuk merespon perintah yang masuk 
  server.on("/LED1ON", []() {
    server.send(200, "text/html", webpage);
    digitalWrite(LED1, HIGH);
    delay(1000);
  });
  server.on("/LED2ON", []() {
    server.send(200, "text/html", webpage);
    digitalWrite(LED2, HIGH);
    delay(1000);
  });
  server.on("/LED3ON", []() {
    server.send(200, "text/html", webpage);
    digitalWrite(LED3, HIGH);
    delay(1000);
  });
  server.on("/LED1OFF", []() {
    server.send(200, "text/html", webpage);
    digitalWrite(LED1, LOW);
    delay(1000);
  });
  server.on("/LED2OFF", []() {
    server.send(200, "text/html", webpage);
    digitalWrite(LED2, LOW);
    delay(1000);
  });
  server.on("/LED3OFF", []() {
    server.send(200, "text/html", webpage);
    digitalWrite(LED3, LOW);
    delay(1000);
  });

  server.begin();
  Serial.println("Server dijalankan");
}

void loop() {  //Perulangan Program
  server.handleClient();
}

Cek terminal serial untuk mendapatkan IP untuk kontrol LED

Gambar terminal serial

Masukkan IP tersebut ke web browser, kemudian akan muncul tampilan kontrol LED seperti ini :

Kesimpulan :

Dalam project ini NodeMCU ESP8266 berfungsi sebagai sebuah web server yang digunakan untuk mengontrol LED. Cara kerjanya dengan memanfaatkan NodeMCU sebagai web server, kita dapat memanggil sebuah halaman webpage yang bisa digunakan untuk menghidupkan dan mematikan  LED yang kita pilih.

PESAN STARTER KIT SEKARANG>>