Modul Tutorial

Membuat Project IoT (Internet of Things)

Dengan esp 8266
Dengan MQTT+EMQX+HTML+Arduino IDE

Disusun oleh :
Rokhmad Astika Triprasetia
SMK NEGERI 2 SRAGEN
www.rokhmad.com
 Kata Pengantar

Puji Syukur kehadirat Allah SWT, sehingga modul Membuat Project IoT (Internet of
Things) Dengan esp 8266 Dengan MQTT+EMQX+HTML+Arduino IDE, terselesaikan
penyusunannnya
Modul ini adalah hasil resume dan Kumpulan Ketika mengikuti pelatihan IOT bagi guru
SMK/SMA Gratis yang diselengrakan oleh NusaBot (https://nusabot.id/) .
Saya ucapkan terimakasih kepada :
1. Direktur https://nusabot.id/
2. Mas Lorenz Adama Damara
3. Kepala SMK N 2 Sragen Dr. Sutikno, S.Pd, M.Pd
4. Keluarga saya tercinta: mama susi, kak siwi, kak lili dek rizky
5. Rekan rekan guru TITL SMK N 2 Sragen
6. Rekan-Rekan di LSP P1 SMK N 2 Sragen
7. Dan rekan rekan lainnya yang tidak dapat kami sebutkan semuanya
Semoga modul ini dapat memberikan manfaat bagi yang ingin belajar IOT, masih banyak
kekurangan dalam penyusunan modul ini, kurang lebihnya mohon maaf, dan kritik dan
saran sangat kami harapkan

Penyusun
Daftar Isi :
A. Pendahuluan ........................................................................................................... 4
B. Instalasi Visual Code Studio .................................................................................... 5
C. Membuat profile EMQX ........................................................................................... 8
D. Membuat Dashboard kendali ................................................................................. 13
E. Memprogram ESP 8266 dengan Arduino IDE........................................................ 16
F. membuat rangkaian Hardware esp8266 ................................................................ 23
A. Pendahuluan
IoT adalah singkatan dari Internet of Things, yang merupakan konsep untuk
menghubungkan perangkat elektronik, sensor, dan objek lainnya ke internet. Dengan IoT,
perangkat-perangkat tersebut dapat saling berkomunikasi dan bertukar data tanpa perlu
campur tangan manusia.
IoT dapat digunakan untuk berbagai aktivitas, seperti: Pencarian informasi,
Pengolahan data, Mengendalikan perangkat elektronik, Menciptakan lingkungan yang
lebih pintar dan efisien.
Beberapa contoh perangkat IoT yang umum adalah: Sensor, Kamera, Lampu,
Pintu otomatis.
IoT memiliki banyak manfaat, di antaranya:
• Di bidang kesehatan, IoT dapat membantu petugas kesehatan dalam mengakses
data rekam medik pasien secara mudah.
• Di industri pertambangan, IoT dapat meningkatkan efisiensi operasi dan
mengurangi risiko kecelakaan kerja.
• Di industri manufaktur, ritel, dan kesehatan, IoT dapat membantu menciptakan
efisiensi bisnis.
IoT memiliki kesamaan dengan konsep Machine-to-Machine (M2M), tetapi keduanya
memiliki perbedaan dalam skala dan lingkup penggunaannya
B. Instalasi Visual Code Studio

https://code.visualstudio.com/

1. Instal Pada Komputer anda

2. Tampilan Visual Studio Code

3. Membuat Folder Baru :

Kemudian buka Visual Studio Code → lalu klik file → open →

folder
4. Menambahkan ekstensi : VSMQTT

Klik Extension—Klik serach “vsmqtt”

Kemudian klik Instal

C. Membuat profile EMQX
Klik icon vsmqtt

Kemudian klik addProfile

Tulis nama profile, missal : belajarIOT → enter

Kemudian tulis nama broker : belajar.emqx.io → enter→enter

Klik edit profile

Hasilnya sebagai berikut :

Lakuka uji coba koneksi dengan klik : Connect to mqtt broker

Hasilnya seperti berikut, pastikan : Connected statusnya
Lakukan uji coba dengan mengirimkan Topic :
Ketik : twosra/#
Kemudian QoS pilih QoS 1
kemudian klik Subscribe

Hasilnya seperti berikut ini:

Kemudian uji coba melakukan PUBLISH data
Dengan menuliskan :
Twosra/suhu
Kemudian QoS 1 dan beri centang pada retain
Kemudian tulis nominal suhu, missal 50

Kemudian klik Publish

Hasilnya seperti berikut
D. Membuat Dashboard kendali
Buka file contoh dashboard file .zip, kemudian ekstrak menjadi 1
folder

Folder hasil ekstrak

Buka file index.html dengan browser, Tampilan dashboard seperti

berikut ini.
Mengecek koneksi dashboard dengan mqtt di broker.emqx.io
Buka visual studio Code dan browser chrome yang membuka file
index.html

Ketika tombol kendali lampu di geser ke posisi on, maka di VS

studio Code akan muncul
twosra/lampu
on
Dan Ketika digeser ke off, maka akan
muncul :
twosra/lampu
off
Uji coba kirim teks melalui dashboard
Misal kita ketik pada kolom kirim teks ke LCD : www.rokhmad.com
Klik kirim, hasilnya pada VS Code muncul
tulisan : twosra/lcd
www.rokhmad.com

Dashboard siap untuk digunakan !

E. Memprogram ESP 8266 dengan Arduino IDE
1. Buka Softwrae Arduino IDE, dapat diunduh di web
https://www.arduino.cc/en/software/OldSoftwareReleases
2. Saya menggunakan Arduino IDE 1.8.5

3. Buka file : iot kodingan.ino

4. Tampilannya sebagai berikut :
Kode lengkap sebagai berikut :

#include <ESP8266WiFi.h>
#include <PubSubClient.h>
#include "DHT.h"
#define DHTTYPE DHT11
#define DHTPIN 14 //gpio14 //D5
#include <Wire.h>
#include <LiquidCrystal_I2C.h>
// Set the LCD address to 0x27 for a 16 chars and 2
line display
LiquidCrystal_I2C lcd(0x27, 16, 2);
//atau 0x3F

#define LED 13 // GPIO 5 (D1) for LED

bool ledState = false;

// WiFi settings
const char *ssid = "R.MEETING"; //
Replace with your WiFi name
const char *password = "smktwosra123"; //
Replace with your WiFi password

// MQTT Broker settings

const char *mqtt_broker = "broker.emqx.io"; //
EMQX broker endpoint
const char *mqtt_topic = "twosra/#"; // MQTT
topic
const char *mqtt_topic2 = "twosra/suhu"; //
MQTT topic
const char *mqtt_topic3 = "twosra/kelembapan";
// MQTT topic
const char *mqtt_topic4 = "twosra/esp8266Twosra";
// MQTT topic
const char *mqtt_username = "emqx"; // MQTT
username for authentication
const char *mqtt_password = "public"; // MQTT
password for authentication
const int mqtt_port = 1883; // MQTT port (TCP)

WiFiClient espClient;
PubSubClient mqtt_client(espClient);

void connectToWiFi();
void connectToMQTTBroker();
void mqttCallback(char *topic, byte *payload,
unsigned int length);

void setup() {
lcd.init();
// Turn on the blacklight and print a message.
lcd.backlight();
Serial.begin(115200);
connectToWiFi();
mqtt_client.setServer(mqtt_broker, mqtt_port);
mqtt_client.setCallback(mqttCallback);
pinMode(LED, OUTPUT);
connectToMQTTBroker();
}

void connectToWiFi() {
WiFi.begin(ssid, password);
Serial.print("Connecting to WiFi");
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("\nConnected to the WiFi
network");
}

void connectToMQTTBroker() {
while (!mqtt_client.connected()) {
 String client_id = "esp8266-client-" +
String(WiFi.macAddress());
Serial.printf("Connecting to MQTT Broker as
%s.....\n", client_id.c_str());
if (mqtt_client.connect(client_id.c_str(),
mqtt_username, mqtt_password)) {
Serial.println("Connected to MQTT broker");
mqtt_client.subscribe(mqtt_topic);
// Publish message upon successful connection
mqtt_client.publish(mqtt_topic, "12345A");

} else {
Serial.print("Failed to connect to MQTT
broker, rc=");
Serial.print(mqtt_client.state());
Serial.println(" try again in 5 seconds");
delay(5000);
}
}
}

void mqttCallback(char *topic, byte *payload,

unsigned int length) {
Serial.print("Message received on topic: ");
Serial.println(topic);
Serial.print("Message:");
String message;
for (int i = 0; i < length; i++) {
message += (char) payload[i]; // Convert *byte
to string
}
// Control the LED based on the message received
if (message == "on" && !ledState) {
digitalWrite(LED, HIGH); // Turn on the LED
ledState = true;
Serial.println("LED is turned on");
}
 if (message == "off" && ledState) {
digitalWrite(LED, LOW); // Turn off the LED
ledState = false;
Serial.println("LED is turned off");
}

if (String (topic) == "twosra/lcd") {

lcd.clear();
lcd.setCursor(0, 0);
lcd.print("---Twosra-IoT---");
lcd.setCursor(0, 1);
lcd.print(message);

Serial.println(message);
Serial.println();
Serial.println("-----------------------");

void loop() {
if (!mqtt_client.connected()) {
connectToMQTTBroker();
////
DHT dht(DHTPIN, DHTTYPE);
float suhu = dht.readTemperature();
int kelembaban = dht.readHumidity();

//////////////////
Serial.println(suhu);
Serial.println(kelembaban);
mqtt_client.subscribe(mqtt_topic2);
mqtt_client.publish(mqtt_topic2, String
(suhu).c_str());
mqtt_client.subscribe(mqtt_topic3);
 mqtt_client.publish(mqtt_topic3, String
(kelembaban).c_str());
mqtt_client.subscribe(mqtt_topic4);
mqtt_client.publish(mqtt_topic4, "Terhubung");

}
mqtt_client.loop();
}
Lakukan Compile kodingan, dan pastikan sukses, jika error perbaiki,
kesalahan biasanya masalah di librarynya yang tidak cocok.

Setelah compile berhasil, lakukan upload ke esp 8266

Jika sukses UPLOD hasilnya sebagai berikut ini
F. membuat rangkaian Hardware esp8266
Skema Rangkaian :

Dashboard online akses :

https://smkn2sragen.sch.id/iot-project/

.: Terimakasih :.
Profil penulis Modul :

Rokhmad Astika Triprasetia, S.Pd

Guru Teknik Instalasi Tenaga Listrik SMK Negeri 2 Sragen
Alumni Pendidikan Teknik Elektro UNNES
==============================================

Follow me :
twitter : https://twitter.com/Rokhmad_sragen
FB : https://facebook.com/rokhmad.triprasetia
IG : https://www.instagram.com/rokhmad_astika_triprasetia/
youtube channel :
https://www.youtube.com/channel/UCVLErf5tdzDY4qQYC4Qs
bhA