IOT MANUAL BOOK UPDATED

Project 2: Mengawal

LED menggunakan

Smartphone

❖ Pada latihan sebelum ini, anda telah
mengawal switch LED menggunakan
laptop. Untuk latihan kali ini, anda
akan mengawal LED menggunakan
Smartphone

❖ Buka appliksi Blynk. Senarai device
yang anda telah bina menggunakan
website Blyk akan dipaparkan di
applikasi Blynk.

❖ Untuk Project 2, kita akan
menggunakan MyPushButtonDevice
yang telah dibuat sebelum ini

❖ Tekan pada ikon MyPushButtonDevice
❖

❖ Sekiranya ini adalah kali pertama anda
menggunakan ikon
MyPushButtonDevice, tiada sebarang
ikon akan dipaparkan dalam
MyPushButtonDevice .

❖ Tekan ikon setting paparan

© 2022 Asral Bin Bahari Jambek

50

© 2022 Asral Bin Bahari Jambek

51

❖ Paparan MyPushButton template akan ❖ Senarai widget akan ditunjukkan

ditunjuukkan. dalam Widget Box
❖ Tekan ikon + untuk menambah Widget ❖ Pilih widget Button

© 2022 Asral Bin Bahari Jambek

52

❖ Widget Button tersebut akan ❖ Setting tentang Button akan

diletakkan dalam MyPushButton dipaparkan.
❖ Tekan Datastream
Template.
❖ Tekan pada Button tersebut.

© 2022 Asral Bin Bahari Jambek

53

❖ Dalam Select Data Stream window, ❖ Setelah selesai, PushButton Switch
pilih PushButton Switch (V0). Ini
adalah PushButton Switch yang telah akan dipaparkan dalam Button Setting
anda bina dalam website Blynk ❖ Tekan button Back untuk kempali ke
sebelum ini
paparan sebelum ini.

© 2022 Asral Bin Bahari Jambek

54

❖ Sekarang swtch untuk mengawal
lampu LED anda telah sedia.

❖ Tekan Button tersebut. Buton
tersebut akan berubah daripada
OFF kepada ON. Anda akan dapat
melihat lampu LED di papan litar
anda menyala.

© 2022 Asral Bin Bahari Jambek

55

Praktikal Projek 3:

Bacaan Suhu Menggunakan
Sensor (LM35)
Tanpa

Internet Of Things (IoT)

Sila lihat Video PERCUMA Tutorial Projek ini di Youtube Channel Kami:
https://bit.ly/2J59DOu

37

EBOOK INTERNET OF THING (IOT) CYBOX ELECTRONICS RESOURCES

56

Projek 3 : Bacaan Suhu Menggunakan Sensor (LM35) Tanpa IoT

Objektif :
Memahami asas komponen menggunakan sensor suhu dan ESP32 Dev Kit V1

Komponen yang di perlukan :

ESP32 Dev Kit V1 LED Breadboard Jumper Wire
(1x) (1x) (1x) (1x) (Male to Female)

Sensor LM35
(1x)

Breadboard Circuit

38

EBOOK INTERNET OF THING (IOT) CYBOX ELECTRONICS RESOURCES

57

Schematic Circuit

Cara Memaparkan Bacaan Suhu di Aplikasi Arduino IDE

Buka aplikasi Arduino IDE di Laptop/PC

Serial Monitor

39

EBOOK INTERNET OF THING (IOT) CYBOX ELECTRONICS RESOURCES

58

Pilih 115200 baud .

Data akan keluar di Serial Monitor untuk setiap 2 saat.
Hasil:

40

EBOOK INTERNET OF THING (IOT) CYBOX ELECTRONICS RESOURCES

59

Coding

int Raw= 0;
double Volt = 0;
double Celcius = 0;
const int ledPin = 22; // Led di pin 22
const int lmPin = 15; // LM35 di pin 15

void setup() {
Serial.begin(115200);

pinMode (lmPin, INPUT); // LM35 di pin 15 sebagai input
pinMode (ledPin, OUTPUT); // Led di pin 22 sebagai output
}

void loop() {
Raw = analogRead(lmPin); // Bacaan data asal dari LM35 sensor
Volt = (Raw / 2048.0) * 3300; // Menukar data asal mengikut voltage

yang digunakan (3.3v)
Celcius = Volt * 0.1; // Dapatkan nilai temperature dalam Celcius
Serial.print("Temperature in C = ");
Serial.println(Celcius); // Paparkan nilai bacaan di Serial Monitor

if (Celcius >= 20){
digitalWrite (ledPin, HIGH); // Lampu akan menyala jika suhu lebih

dari 20 Cel
}
else{

digitalWrite (ledPin, LOW); // Lampu akan tutup jika suhu kurang dari
20 Cel
}

delay(2000); // lambatkan bacaan data selama 2 saat
}

41

EBOOK INTERNET OF THING (IOT) CYBOX ELECTRONICS RESOURCES

60

Praktikal Projek 4:

Bacaan Suhu Menggunakan
Sensor (LM35)
Dengan

Internet Of Things (IoT)

Sila lihat Video PERCUMA Tutorial Projek ini di Youtube Channel Kami:
https://bit.ly/2J59DOu

42

EBOOK INTERNET OF THING (IOT) CYBOX ELECTRONICS RESOURCES

61

Projek 4 : Bacaan Suhu Menggunakan Sensor (LM35) Dengan (IoT)

Objektif :
Memahami asas komponen menggunakan sensor suhu, ESP32 Dev Kit V1 &
Aplikasi BLYNK

Komponen yang di perlukan :

ESP32 Dev Kit V1 LED Breadboard Jumper Wire
(1x) (1x) (1x) (1x) (Male to Female)

Sensor LM35 Smart Phone (1x)
(1x) (1x)

Breadboard Circuit

43

EBOOK INTERNET OF THING (IOT) CYBOX ELECTRONICS RESOURCES

62

Schematic Circuit

Configurasi Aplikasi BLYNK

Di aplikasi Arduino IDE, untuk install libraries bagi Blynk, klik Tools tab
dan pilih Manage Libraries .

44

EBOOK INTERNET OF THING (IOT) CYBOX ELECTRONICS RESOURCES

63

Asas IoT - Project 4: Bacaan
Suhu Menggunakan Sensor

(LM35) (…sambungan
selepas pemasangan litar)

© 2022 Asral Bin Bahari Jambek

64

Asas IoT - Project 4: Bacaan Suhu Menggunakan Sensor
(LM35) (…sambungan selepas pemasangan litar)

❖ Buka applikasi Arduino IDE di Laptop anda
❖ Tulis kod dibawah dan Save menggunakan nama SuisLED
❖ Di dalam kod tersebut, isikan maklumat berikut mengikut maklumat Wifi anda

o char ssid[] = "Nama Wifi";
o char pass[] = "Passowrd Wifi";

© 2022 Asral Bin Bahari Jambek

65

© 2022 Asral Bin Bahari Jambek

66

❖ Layari website Blynk 2.0:https://blynk.cloud
❖ Login ke akaun Blynk anda. Jika anda masih belum mendaftar akaun Blynk, rujuk

seksyen “Mendaftar Akaun Blynk 2.0.
❖ Klik pada ikon “Templates”
❖ Seterusnya, klik pada “+ New Template”

❖ Isikan makluman dalam “Create a New Template”
o Name: MyTemperature
o Hawdware: ESP32
o Connection type: WiFi
o Description: Ini adalah template Temperature.

❖ Kemudian klik “Done”.

© 2022 Asral Bin Bahari Jambek

67

❖ Template yang baru anda buat akan dipaparkan.

❖ Seterusnya, kita akan menentukan bagaimana Template tersebut beroperasi.
❖ Pilih tab Datastreams → New Datastream → Virtual Pin

© 2022 Asral Bin Bahari Jambek

68

❖ Isikan borang Virtual Pin Datastream seperti di bawah. Ini akan menjadi tingkah laku
suis tersebut yang mempunyai nilai sama ada 1 (HIDUP) atau 0 (MATI)

o Name: TemperatureMeter
o Alias: TemperatureMeter
o Pin: V0
o Data Type: Integer
o Units: None
o Min: 0
o Max: 60
o Default Value: 0

❖ Kemudian Pilih Create

© 2022 Asral Bin Bahari Jambek

69

❖ Tab Datastreams anda akan menunjukkan Virtual Pin yang baru dibuat

❖ Seterusnya, kita akan memilih grafik untik Template tadi.
❖ Klik tab ‘Web Dashboard’

© 2022 Asral Bin Bahari Jambek

70

❖ Dalam Web Dashboard, terdapat Widget Box column. Pilih widget “Gauge” dan
bawakannya ke dalam kawasan " Add new widget ". Widget “Gauge” akan kelihatan
di kawan Dashboard

❖ Pergi ke widget “Gauge” di Dashboard dan tekan butang tetapan seperti dibawah:

© 2022 Asral Bin Bahari Jambek

71

❖ Paparan tetapan “Gauge” akan kelihatan. Isikan tetapan “Gauge” seperti di berikut:
o Datastream: TemperatureMeter(V0)

❖ Klik butang Save.
❖

❖ Kini Web Dashboard anda akan kelihatan seperti rajah di bawah. Template
MyTemperature sudah sedia untuk digunakan untuk peringkat seterusnya.

❖ Pilih Save untuk menyimpan templat anda.

© 2022 Asral Bin Bahari Jambek

72

❖ Untuk menggunakan template yang telah dibuat, kita perlu melampirkan template
pada suatu Device.

❖ Pilih “Search” → New Device → From Template → MyEsp32IoT

❖ Kemudian pilih “From Template”

© 2022 Asral Bin Bahari Jambek

73

❖ Window “New Device” akan dipaparkan. Isikan maklumat seperti berikut
o Template: MyTemperature
o Device Name: MyTemperatureDevice

❖ Klik “Create”

❖ Seterusnya paparan Template ID, Device Name, and Auth_token is displayed
❖ Pilih “Copy to Clipboard”

© 2022 Asral Bin Bahari Jambek

74

❖ Kemudian Paste kedalam kod Arduino anda

© 2022 Asral Bin Bahari Jambek

75

❖ Untuk memudahkan memantau apa yang belaku pada ESP32 anda, buka Window
Serial Monitor: Tools → Serial Monitor

❖ Serial Monitor window akan terpapar
❖ Pastikan nilai 115200 baud dipilih di ruang berikut

© 2022 Asral Bin Bahari Jambek

76

❖ Compile dan Upload program ke peranti ESP32 anda.
❖ Setelah compile, tekan butang Reset pada peranti ESP32.
❖ Perhatikan output pada output Serial Monitor.

© 2022 Asral Bin Bahari Jambek

77

❖ Setelah berjaya upload ke ESP32, kitab oleh melihat suhu persekitran menggunakan

Laptop.
❖ Kembali ke laman web Blynk anda.
❖ Jika peranti MyTemperature telah berjaya disambungkan ke Internet, anda

seharusnya melihat status peranti tersebut sebagai ‘Online’.
❖ Anda akan dapat melihat nilai suhu berubah mengikut suhu persekitaran.

© 2022 Asral Bin Bahari Jambek

78

Memantau Suhu ❖ Sekiranya ini adalah kali pertama anda

mengunakan menggunakan ikon MyTemperature,
tiada sebarang ikon akan dipaparkan
Smartphone dalam MyTemperature.
❖ Tekan ikon setting paparan
❖ Pada latihan sebelum ini, anda telah
memantau suhu menggunakan laptop.
Untuk latihan kali ini, anda akan
memantau suhu menggunakan
Smartphone

❖ Buka appliksi Blynk. Senarai device
yang anda telah bina menggunakan
website Blyk akan dipaparkan di
applikasi Blynk.

❖ Untuk Project 2, kita akan
menggunakan MyTemperature yang
telah dibuat sebelum ini

❖ Tekan pada ikon MyTemperature

© 2022 Asral Bin Bahari Jambek

79

❖ Paparan MyTemperature template ❖ Senarai widget akan ditunjukkan

akan ditunjuukkan. dalam Widget Box
❖ Tekan ikon + untuk menambah Widget ❖ Cari dan pilih widget Gauge
❖ ❖

© 2022 Asral Bin Bahari Jambek

80

❖ Widget Gauge tersebut akan ❖ Setting tentang Gauge akan

diletakkan dalam MyTemperature dipaparkan.
❖ Tekan Datastream
template.
❖ Tekan pada Gauge tersebut.

❖
© 2022 Asral Bin Bahari Jambek

81

❖ Dalam Select Data Stream window, ❖ Setelah selesai, Gauge akan
pilih Integer V0 (V0). Ini adalah
datastream yang sama yang telah dipaparkan dalam Gauge Setting
anda bina dalam website Blynk ❖ Tekan Back untuk kempali ke paparan
sebelum ini
sebelum ini.

© 2022 Asral Bin Bahari Jambek

82

❖ Sekarang andasedia untuk
memantau suhu telah sedia.

❖ Nilai suhu semasa akan terpapar
pada Gauge tersebut secara
langsung mengikut suhu
persekitaran.

❖

© 2022 Asral Bin Bahari Jambek

83