PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

86
PROPOSAL TUGAS AKHIR PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB Diajukan Untuk Memenuhi Syarat Kelulusan Mata Kuliah Seminar Skripsi dan Skripsi Di Fakultas Teknik Universitas Darma Persada Disusun oleh: ABDUL JABAR HAKIM 2011230045 PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS TEKNIK UNIVERSITAS DARMA PERSADA 2015

Transcript of PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

Page 1: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

PROPOSAL TUGAS AKHIR

PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING

(IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

Diajukan Untuk Memenuhi Syarat Kelulusan Mata Kuliah Seminar Skripsi dan Skripsi

Di Fakultas Teknik Universitas Darma Persada

Disusun oleh:

ABDUL JABAR HAKIM

2011230045

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK

UNIVERSITAS DARMA PERSADA

2015

Page 2: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

i

LEMBAR PERNYATAAN

Saya yang bertanda tangan di bawah ini:

N a m a : Abdul Jabar Hakim

NIM : 2011230045

Fakultas : Teknik

Jurusan : Teknik Informatika

Judul Laporan : Prototype Smart Home Dengan Konsep Internet Of

Thing Menggunakan Arduino Berbasis Web

Menyatakan bahwa laporan tugas akhir ini saya susun sendiri berdasarkan hasil

peninjauan, penelitian lapangan, wawancara serta memadukannya dengan buku-

buku literatur atau bahan-bahan referensi lain yang terkait dan relevan di dalam

menyelesaikan laporan tugas akhir ini.

Demikian pernyataan ini saya buat dengan sesungguhnya.

Bekasi, 6 September 2015

Abdul Jabar Hakim

Page 3: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

ii

LEMBAR PENGESAHAN

PROTOTYPE SMAT HOME DENGAN KONSEP INTERNET

OF THING MENGGUNAKAN ARDUINO BERBASIS WEB

Disusun Oleh :

Abdul Jabar Hakim

2011230045

Adam Arif Budiman, ST, M.KOM

Pembimbing Laporan

Page 4: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

iii

PENGUJIAN LAPORAN SKRIPSI

Laporan Tugas Akhir ini di presentasikan pada tanggal : 3 September 2015

Dengan Judul :

“PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING MENGGUNAKAN ARDUINO

BERBASIS WEB”

PENGUJI 1 PENGUJI 2

Herianto, SPd ., MT Aji Setiawan, S.Kom., MMSi.

PENGUJI 3

Bagus Tri Mahardika, S.Kom., MMSi.

Page 5: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

v

ABSTRAK

Seiring dengan perkembangan zaman dan meningkatnya ekonomi

masyarakat permintaan akan kebutuhan rumah yang aman dan nyaman kian

meningkat, serta penggunaan internet yang tanpa kita sadari hadir pada kehidupan

kita sehai hari menjadikan kita sebagai masyarakat yang berada dalam putaran

IoE (Internet of Everything) sehingga saya tertarik untuk mengembangkan smart

home dengan konsep Internet of Thing sebagai sekala yang lebih kecil dari

Internet of Everything Laporan ini adalah hasil dari pembuatan karya prototype

smart home dengan konsep internet of thing menggunakan arduino dan web

browser, membahas mengenai cara kerja dari hubungan arduino yang di kontrol

melalui website sebagai langkah penerapan internet of thing tanpa menggunakan

ip public, menggunakan device komputer sebagai perantara dan dibantu dengan

aplikasi ngrok sebagai penerapan konsep tunnneling antara VPS, komputer direct

dan arduino. Dengan adanya prototype ini diharapkan para pengembang

selanjutnya baik dari akademisi maupun non-akademisi dapat mengetahui dan

memepelajari konsep gabungan antara smart home dan internet of thing secara

lebih interaktif, walaupun penulis menyadari masih banyak yang harus diperbaiki

dan dikembangkan dari prototype yang penulis buat ini.

Kata Kunci : Smart Home, Internet of Thing, Prototype, Mikrokontroler, Arduino.

Page 6: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

vi

KATA PENGANTAR

Puji syukur saya panjatkan kehadirat Allah SWT yang telah memberikan

karunia-Nya kepada saya sehingga dapat menyelesaikan penulisan laporan tugas

akhir. Dalam pelaksanaan tugas akhir dan pembuatan laporan tugas akhir ini,

tidak jarang saya menemui berbagai macam kesulitan dan hambatan. Untuk itu

pada kesempatan kali ini saya ingin mengucapkan terima kasih kepada pihakpihak

yang secara langsung maupun tidak langsung membantu dalam tugas akhir dan

penulisan laporan ini. Saya menyampaikan ucapan terima kasih secara khusus

kepada :

1. Keluarga saya tercinta yang tidak pernah bosan memberikan do’a dan

semangat kepada saya.

2. Dekan Teknik Universitas Darma Persada Ir. Agus Sun Sugiharto, MT.

3. Kepala Jurusan Teknik Informatika AdamArif Budiman, M.Kom.

4. Dosen Pembimbing Aji Setiawan, MMSI. yang telah sabar membimbing

saya dalam penyusunan Laporan Tugas akhir.

5. Dosen-dosen Universitas Darma Persada yang telah memberikan ilmu yang

sangat bermanfaat kepada saya.

6. Teman-teman saya yang selalu memberikan support dan bantuan kepada saya

Satria, Anita, Oblak, Bocat, Tati, Umi, Jo dan lain-lain yang tidak bisa saya

sebutkan satu persatu.

7. Teman-teman group pojok kantek yang telah menemani dan meberikan

semangat kepada saya.

Page 7: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

vii

8. Toko Elektronik Mirat dan Dian yang berlokasi sepanjang Jl. Kembang

Sepatu, Senen, Jakarta yang telah membantu dalam pengadaan barang.

9. Rekan - rekan HIMIFDA angkatan 2011, 2012, 2013 dan 2014 yang

memberikan semangat kepada saya.

Saya menyadari bahwa tugas akhir dan penulisan laporan ini masih jauh dari kata

sempurna karena keterbatasan pengetahuan, kemampuan dan pengalaman yang

dimiliki. Oleh karena itu, kritik dan saran dari semua pihak yang membangun

selalu saya harapkan demi perbaikan yang lebih baik dikemudian hari.

Akhir kata semoga penulisan laporan tugas akhir ini dapat memberikan manfaat

bagi penulis sendiri maupun para pembacanya.

Jakarta, 6 September 2015

Abdul Jabar Hakim

Page 8: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

viii

DAFTAR ISI

HALAMAN COVER

LEMBAR PERNYATAAN ................................................................................ i

LEMBAR PERSETUJUAN ............................................................................... ii

LEMBAR PENGUJI ........................................................................................... v

LEMBAR KONSULTASI .................................................................................. i

DAFTAR ISI ....................................................................................................... ii

DAFTAR TABLE ............................................................................................... v

DAFTAR GAMBAR .......................................................................................... vi

BAB I PENDAHULUAN ...................................................................... 1

1.1 Latar belakang ........................................................................ 1

1.2 Rumusan Masalah .................................................................. 2

1.3 Batasan Masalah .................................................................... 2

1.4 Tujuan ..................................................................................... 3

1.5 Manfaat ................................................................................... 3

1.6 Sistemika Penulisan ................................................................ 3

BAB II LANDASAN TEORI ...................................................................... 5

2.1 IoT ( Internet of Thing) ............................................................. 5

2.2 UML ( Unified Modeling Langauage ) ..................................... 7

2.2.1 Use Case Diagram ........................................................... 9

2.2.2 Class Diagram ................................................................. 10

2.2.3 Statechart Diagram .......................................................... 11

2.2.4 Activity Diagram ............................................................ 12

2.2.5 Squence Diagram ............................................................ 13

Page 9: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

ix

2.2.6 Collaboration Diagram .................................................... 14

2.2.7 Component Diagram ....................................................... 15

2.2.8 Deployment Diagram ...................................................... 16

2.3 Smart Home .............................................................................. 16

2.4 Mikrokontroler Arduino ............................................................ 18

2.5 Pemrograman ............................................................................ 22

2.5.1 HTML ............................................................................. 22

2.5.2 CSS ................................................................................. 23

2.5.3 PHP ................................................................................. 24

2.5.4 mysql ............................................................................... 25

2.5.5 mysqli .............................................................................. 25

2.5.6 Javascript ......................................................................... 26

2.6 Motor DC dan Motor Stepper ................................................... 30

2.7 Komponen Elektronik ............................................................... 32

2.7.1 Resistor ........................................................................... 32

2.7.2 Kapasitor ......................................................................... 33

2.7.3 Dioda dan LED ............................................................... 34

BAB III ANALISIS DAN PERANCANGAN SISTEM .............................. 36

3.1 Analisis dan Perancangan Sistem ............................................. 36

3.2 Desain Sistem ........................................................................... 37

3.1.1 Analisa Flowchart ........................................................... 37

3.1.2 Analisa Use Case Diagram ............................................. 38

3.1.3 Analisa Squence Diagram ............................................... 39

3.3 Desain Alat dan Rangakaian Elektronik ................................... 42

Page 10: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

x

3.4 Desain Kemanan ...................................................................... 45

3.5 Desain Program ........................................................................ 47

BAB IV PEMBAHASAN .............................................................................. 50

4.1 Pembahasan Prototype Smart Home ......................................... 50

4.2 Implementasi Sistem ................................................................. 50

4.3 Uji Coba .................................................................................... 51

4.3.1 Persiapan ......................................................................... 51

4.3.2 Halaman Login ................................................................ 59

4.3.3 Halaman Validasi ............................................................ 60

4.3.4 Halaman Utama .............................................................. 61

4.3.5 Halaman Kontrol ............................................................. 62

4.3.6 Halaman Kamera............................................................. 65

4.3.7 Halaman Setting .............................................................. 66

BAB V PENUTUP ........................................................................................ 68

5.1 Kesimpulan ................................................................................ 68

5.2 Saran .......................................................................................... 68

DAFTAR PUSTAKA

Page 11: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

xi

DAFTAR TABEL

Tabel 2.1 Konsep Dasar UML .......................................................................... 8

Tabel 3.1 Table Keterangan Point Relay .......................................................... 44

Tabel 3.2 Tabel Simulasi Elektronik ................................................................ 45

Tabel 3.3 Tabel User ......................................................................................... 48

Tabel 3.4 Tabel Log ........................................................................................... 49

Page 12: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

xii

DAFTAR GAMBAR

Gambar 2.1 Perbedaan IOT dan C-IoT ............................................................ 6

Gambar 2.2 Ilustrasi Semua Terhubung Internet ........................................ ….. 7

Gambar 2.3 Contoh Use Case Diagram ............................................................ 9

Gambar 2.4 Contoh Class Diagram .................................................................. 10

Gambar 2.5 Contoh Statechart Diagram ........................................................... 11

Gambar 2.6 Contoh Activity Diagram .............................................................. 12

Gambar 2.7 Contoh Squence Diagram ............................................................. 13

Gambar 2.8 Contoh Collaboration Diagram ..................................................... 14

Gambar 2.9 Contoh Componen Diagram ......................................................... 15

Gambar 2.10 Contoh Deployment Diagram ..................................................... 16

Gambar 2.11 Ilustrasi Smart Home - Remote ................................................... 17

Gambar 2.12 Arduino Uno................................................................................ 19

Gambar 2.13 Ethernet Shield ............................................................................ 20

Gambar 2.14 ATMega 328 ............................................................................... 21

Gambar 2.15 ATMega 1280 ............................................................................. 22

Gambar 2.16 Motor DC .................................................................................... 30

Gambar 2.17 Motor Stepper ............................................................................. 31

Gambar 2.18 Resistor ......................................................................................... 32

Gambar 2.19 Kapasitor ...................................................................................... 33

Gambar 2.20 Contoh Simbol dan Bentuk Dioda ............................................... 34

Gambar 2.21 Bentuk Led ................................................................................... 34

Gambar 3.1 Analisa Flowchart .......................................................................... 37

Page 13: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

xiii

Gambar 3.2 Analisa Use Case Diagram............................................................. 38

Gambar 3.3 Ilustrasi Aplikasi ngrok .................................................................. 39

Gambar 3.4 Squence Diagram dengan IP public ............................................... 40

Gambar 3.5 Squence Diagram tanpa IP Public ................................................. 41

Gambar 3.6 Rencana rangkaian Prototype Smart Home ................................... 42

Gambar 3.7 Penggunaan Rilay .......................................................................... 43

Gambar 3.8 IC L293d ........................................................................................ 44

Gambar 3.9 Perencanaan denah Prototype Smart Home ................................... 45

Gambar 3.10 Flowchart Autentifikasi Login ..................................................... 46

Gambar 3.11 Perencanaan Tampilan Login ....................................................... 47

Gambar 3.12 Perencanaan Tampilan Menu ....................................................... 48

Gambar 4.1 Penggunaan Jaringan Pada Perangkat ............................................ 51

Gambar 4.2 Alur Persiapan ................................................................................ 52

Gambar 4.3 Arduino Ethernetshield sudah Terkoneksi ..................................... 53

Gambar 4.4 Pengecekan Internet dengan ping .................................................. 54

Gambar 4.5 Mengaktivikan Ngrok Server ......................................................... 54

Gambar 4.6 Tunneling ngrok berhasil di lakukan.............................................. 55

Gambar 4.7 Stream Server (Webcam XP) ......................................................... 56

Gambar 4.8 Mengirim Alamat Ngrok ................................................................ 57

Gambar 4.9 Membuat Schedule Pada Windows ................................................ 58

Gambar 4.10 Menu Login .................................................................................. 59

Gambar 4.11 Menu Validasi .............................................................................. 60

Gambar 4.12 Autentivikasi melalui E-Mail ....................................................... 60

Gambar 4.13 Halaman Utama ............................................................................ 61

Page 14: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

xiv

Gambar 4.14 Halaman Kontrol .......................................................................... 62

Gambar 4.15 Posisi Lampu 1 ............................................................................. 63

Gambar 4.16 Posisi Lampu 2 ............................................................................. 64

Gambar 4.17 Posisi Lampu 3 ............................................................................. 65

Gambar 4.18 Menu Halaman Camera................................................................ 6

Gambar 4.19 Menu Setting ................................................................................ 77

Gambar 4.20 Menu Log pada Menu Setting ...................................................... 67

Page 15: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

1

BAB I

PENDAHULUAN

1.1 Latar Belakang

Seiring dengan perkembangan zaman, teknologi tumbuh begitu pesat,

bahkan hal yang dulunya dianggap tidak mungkin kini bisa terealisasikan dengan

bantuan teknologi. Pertumbuhan ekonomi yang tinggi membuat permintaan akan

rumah yang nyaman dan aman kian meningkat dan penerapan teknologi yang

paling jelas terlihat adalah teknologi security dalam bentuk sistem pengaman

otomatis atau CCTV.

Dengan teknologi ini, ancaman pencurian pada rumah bisa terminimalisir

meskipun teknologi yang ditawarkan untuk rumah pribadi saat ini tidaklah cukup

sekedar pemantauan melalu CCTV, Terkadang kita lupa untuk mematikan lampu

atau merasa tidak yakin sudah mengunci pintu rumah ketika sedang berada di luar

sehingga kita harus kembali dan melakukan pengecekan yang sangat tidak efesien

baik dari sisi waktu ataupun financial seperti biaya bensin kelokasi rumah. dengan

tujuan efisiensi itulah muncul ide yang di sebut dengan Smart Home.

Internet of Thing (IOT) merupakan sebuah konsep yang bertujuan untuk

memperluas manfaat dari konektivitas internet , IOT sendiri sudah diperkenalakan

pertama kali oleh Kevin Ashton dalam presentasinya “cofounder and executive

director of the Auto-ID Center” di MIT pada tahun 1999. namun kenyataanya

konsep Internet of thing khususnya di indonesia belum di terapkan secara

maksimal.

Page 16: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

2

Hal tersebut dapat digunakan untuk menyusun laporan dengan judul

“PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING

(IOT) MENGGUNAKAN ARDUINO BERBASIS WEB”. Prototype ini

digunakan sebagai bahan pertimbangan seseorang menerapkan konsep smart

home dan Internet of Thing di kehidupan nyata.

1.2 Rumusan Masalah

Berdasarkan latar belakang yang telah diuraikan diatas, maka rumusan

masalah dalam pembuatan aplikasi ini adalah sebagai berikut:

a. Bagaimana menerapkan IOT (Internet of Things) pada konsep smart home atau

rumah pintar?

b. Bagaimana membuat aplikasi yang dapat mengontrol keadaan rumah melalui

internet?

c. Bagaimana sketch program di Arduino untuk Smart Home dengan konsep

Internet of Thing?

d. Bagaimana membuat rangkaian elektronik untuk menggerakan servo motor

kamera, pintu, dan pararel pada lampu ?

1.3 Batasan Masalah

Dalam perancangan aplikasi ini terdapat beberapa batasan masalah. Hal ini

dilakukan agar aplikasi dapat terfokus / sesuai kebutuhan. Batasan masalah

tersebut sebagai berikut :

a. Prototype smart home pada tipe rumah 1 lantai dengan akses kontrol lampu,

pintu, dan kamera yang disertai servo motor berotasi 90 derajat.

b. Kontrol dilakukan dengan perangakat Komputer / Laptop malalui media web

browser Google Chroom.

Page 17: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

3

c. Media kontrol melalui jaringan internet.

d. Mikrokontroler Arduino yang digunakan adalah jenis Arduino Uno dan

Arduino Ether Shield

e. Pengiriman data atau perintah dilakukan satu arah, hanya melalui browser.

1.4 Tujuan

Berdasarkan rumusan masalah diatas, tujuan dari laporan ini adalah

membuat karya yang mampu melakukan hal-hal berikut :

a. Memperkenalkan Smart Home dengan lebih interaktif.

b. Menjadi bahan pertimbangan seseorang dalam penerapan Smart Home dengan

kontrol melalu internet di dunia nyata.

1.5 Manfaat

Manfaat yang didapat dari penelitian ini adalah :

1. Diharapkan hasil penulisan Laporan Tugas Akhir ini dapat menjadi

tambahan referensi untuk penulisan dan penelitian selanjutnya.

2. Prototype smart home ini diharapkan dapat membantu orang dalam

menerapkan smart home di dunia nyata.

1.6 Sistematika Penulisan

Pada bagaian ini, penulis akan memberikan suatu uraian mengenai isi dari

laporan yang terdiri dari:

BAB I : PENDAHULUAN

Bab ini akan menguraikan permasalahan yang akan dibahas secara

keseluruhan meliputi Latar Belakang, Rumusan Masalah, Tujuan,

Batasan Masalah, Manfaat dan diakhiri dengan Sistematika

Penulisan.

Page 18: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

4

BAB II: LANDASAN TEORI

Bab ini menjelaskan tentang teori-teori yang berhubungan dengan

penulisan laporan tugas akhir yaitu Definisi Internet of Things,

UML ( Unified Modeling Language. ), Smart Home,

Mikrokontroler, Arduino, Prototype, Internet Protocol , Servo,

Arduino Ether Shield, .

BAB III : ANALISIS DAN PERANCANGAN SISTEM

Bab ini membahas mengenai pemilihan jenis aplikasi, pemilihan

tool yang digunakan untuk membuat aplikasi, baik hardware,

komponen elektronik, pemograman dan rancangan program yang

akan dibuat.

BAB IV : PEMBAHASAN

Bab ini akan membahas tentang aplikasi yang dibuat, meliputi

interface aplikasi, implementasi, hardware, software dan hasil uji

coba.

BAB V : PENUTUP

Bab ini berisi kesimpulan dan saran dari keseluruhan isi Laporan

Tugas Akhir, saran-saran dan harapan yang diajukan kepada semua

pihak sesuai dengan bahasan sebelumnya.

Page 19: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

5

2 BAB II

LANDASAN TEORI

2.1 IoT ( Internet of Thing )

Menurut Fawzi Behmann dan Kwok Wu : Internet of Thing atau IoT adalah

sebuah istilah yang dimaksudkan dalam penggunaan internet yang lebih besar ,

mengadopsi komputasi yang bersifat mobile dan konektivitas kemudian

menggabungkanya kedalam kesehari-harian dalam kehidupan kita.

IoT berkaitan dengan DoT ( Disruption of Things ) dan sebagai pengantar

perubahan atau transformasi penggunaan internet dari sebelumnya Internet of

People menjadi Internet of M2M (Maching-to-Machine).

Sedangkan C-IoT adalah singkatan dari Collaborative Internet Of Thing

adalah sebuah hubungan dari dua point solusi menjadi tiga point secara cerdas,

sebagai contohnya adalah iWatch salah satu smartwatch tidak hanya memanage

kesehatan dan kebugaran tetapi juga dapat menyesuaikan suhu ruangan pada AC

mobil.

Pada model C-IoT dalam bentuk sederhanya terdiri dari Sensing, Gateway,

dan Services. Pengindraan (Sensing) akan memasukan apa yang di anggap

penting, Gateway akan menambah kecerdasan dan konektifitas untuk tindakan

yang akan di ambil baik tingkatan lokal atau menyampaikan informasinya ke

Cloud level, sedangkan Services akan menangkap informasi dan mercerna,

menganalisa, dan mengembangkan wawasan untuk membantu meningkatan

kualitas hidup atau improve business operation.

Page 20: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

6

Gambar 2.1 Perbedaan IOT dan C-IoT

(Source : E-Book Collaborative Internet of Things (C-IoT) for Future Smart

Connected Life and Business)

a) IoT ( Internet Of Thing ) & IoE ( Internet of Everything )

IoE ( Internet Of Everything ) adalah konsep hal perangkat cerdas yang

terhubung bersama-sama dan melakukan apa yang tidak bisa dilakukan untuk

teknologi sebelumnya. Pergeseran paradigma tersebut menandai era dimana

kesempatan untuk menjadi lebih baik untuk semua orang, mulai dari konsumen

dan pelaku bisnis sampai kepemerintahan.

Page 21: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

7

Gambar 2.2 Ilustrasi Semua Terhubung Internet

(Source : E-Book Collaborative Internet of Things (C-IoT) for Future Smart

Connected Life and Business)

IoE ( Internet of Everything ) akan mengubah dunia dan berdampak pada

kehidupan sehari – hari baik siang ataupun malam akan dikelilingi oleh

konektivitas yang cerdas merespon apa yang kita inginkan dan apa yang kita

butuhkan yang diistilahkan Digital Sixth Sense.

Cisco mendefinisikan bahwa IoE ( Internet of Everything ) sebagai penyatu

masyarakat , proses , data , dan yang lainya menjadi terhubung besama-sama dan

menjadi lebih berharga dari sebelumnya.

2.2 UML ( Unified Modeling Language )

Menurut Sri Dwarwiyanti dan Romi Satria Wahono, UML adalah sebuah

bahasa yang telah menjadi standart dalam industri untuk visualisasi, merancang,

dan mendokumentasikan sistem piranti lunak. UML menawakan sebuah standar

Page 22: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

8

untuk merancang model sebuah sistem. Dengan menggunakan UML kita dapat

membentuk model untuk semua jenis aplikasi piranti lunak, dimana aplikasi

tersebut dapat berjalan pada piranti keras, sistem operasi dan jaringan apapun,

serta ditulis dalam bahasa pemrograman.

UML lebih cocok untuk penulisan piranti lunak dalam bahasa-bahasa

berorientasi objeck seperti C++, java, dan sebagainya , namun UML tetap dpat

digunakan untuk modeling aplikasi prosedural dalam VB atau C. UML

mendefinisikan notasi dan syntax / semantik. Notasi UML merupakan sekumpulan

bentuk khusus yang menggambarkan berbagai diagram piranti lunak. Setiap

bentuk memiliki makna tertentu, dan UML syntax mendefinisikan bagaimana

bentuk-bentuk tersebut dapat di kombinasikan. Notasi UML terustama di turunkan

dari 3 notasi yang telah ada, yaitu : Object-Oriented Design, Object-Modeling

Technique dan Object-Oriented Software Engineering.

Adapun konsepsi dasar dari UML adalah sebagai berikut :

Tabel 2.1 Konsep Dasar UML

Major Area View Diagrams Main Concepts

Structural Static View Class

Diagram

class,association, generaltions,

dependency, realization,

interface

Use Case View Use Case

Diagram

use case, actor, association,

extend, include, use case

generalitazion

Implementatio

n View

Component

Diagram

component, interface,

dependency, location

Deployment

View

Deployment

Diagram

noe, component, dependency,

locations

Dynamic State Machine

View

Statechart

Diagram state, event, transition, action

Activity View Activity

Diagram

state, activity, completion

transistion, fork, join

Page 23: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

9

Interaction

View

Sequence

Diagram

interaction, object, message,

activation

Collaboratio

n Diagram

collaboration, interaction,

collaboration role, message

Model

Managemen

t

Model

Management

View

Class

Diagram package, subsystem, model

Extensibility all All constraint, stereotype, tagged

values

Abstraksi konsep dasar UML terdiri dari struchtural classification, dynamic

behavior, model management. Sedangkan main concept dipandang sebagai yang

akan muncul pada saat kita membuat diagram. adapun diagram-diagram untuk

mendefinisikan UML adalah :

2.2.1 Use Case Diagram

Gambar 2.3 Contoh Use Case Diagram

(Source : E-Book Pengantar Unified Modeling Language (UML))

Page 24: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

10

Use Case diagram menggambarkan fungsionalitas yang di

harapkan dari sebuah sistem, yang ditekankan adalah “apa” yang di

perbuat sistem, dan bukan “bagaimana”.

Use case diagram dapat sangat membantu bila kita sedang

menyusun requirement sebuah sistem, mengkomunikasikan rancangan

dengan klien, dan merancang test case untuk semua feature yang ada pada

sistem. Sebuah use case dapat di-include oleh lebih dari satu use case lain,

sehingga duplikasi fungsionalitas dapat dihindari dengan cara menarik

keluar fungsionalitas yang common.

2.2.2 Class Diagram

Gambar 2.4 Contoh Class Diagram

(Source : E-Book Pengantar Unified Modeling Language (UML))

Class Diagram sebuah spesifikasi yang jika diinstansiasi akan

menghasilkan sebuah objek dan merukan inti dari pengembangan dan

desain berorientasi objek. Class Diagram menggambarkan keadaan

(attribut/properti) suatu sistem, sekaligus menawarkan layanan untuk

Page 25: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

11

memanipulasi keadaan tersebut (metoda/fungsi). Class diagram

menggambarkan struktur dan deskripsi class, package dan objek beserta

hubungan satu sama lain seperti containment, pewarisan, asosiasi, dan

lain-lain. Class memiliki tiga area pokok Nama, Atribut , dan Metoda.

Atribut dan metoda dapat memiliki salah satu sifat berikut :

a) Private, tidak dapat dipanggil dari luar class yang bersangkutan

b) Protected, hanya dapat dipanggil oleh class yang bersangkutan dan

anak-anak yang mewarisinya

c) Public, dapat dipanggil oleh siapa saja

2.2.3 Statechart diagram

Gambar 2.5 Contoh Statechart Diagram

(Source : E-Book Pengantar Unified Modeling Language (UML))

State Diagram menggambarkan transisi dan perubahan keadaan (dari

suatu state ke state lainya) suatu objek pada sistem sebagai akibar dari

Page 26: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

12

stimuli yang diterima. Pada umumnya statechart diagram menggambarkan

class tertentu (satu class dapat memiliki lebih dari satu statechart diagram).

Dalam UML, state digambarkan berbentuk segiempat dengan sudut

membulat dan memiliki nama sesuai kondisinya saat itu. Transisi antar

state umumnya memiliki kondisi guard yang merupakan syarat terjadinya

transisi yang bersangkutan, dituliskan dalam kurung siku. Action yang

dilakukan sebagai akibat dari event tertentu dituliskan dengan diawali

garis miring, Titik awal dan akhir digambarkan berbentuk lingkaran

berwarna penuh dan berwarna setengah.

2.2.4 Activity diagram

Gambar 2.6 Contoh Activity Diagram

(Source : E-Book Pengantar Unified Modeling Language (UML))

Page 27: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

13

Activity Diagram menggambarkan alir aktivitas dalam sistem yang

sedang dirancang bagaimana masing masing alir berawal, decision yang

mungkin terjadi, dan bagaimana mereka berakhir.

Activity diagram merupakan state diagram khusus, di mana

sebagian besar state adalah action dan sebagian besar transisi di-trigger

oleh selesainya state sebelumnya (internal processing). Oleh karena itu

activity diagram tidak menggambarkan behaviour internal sebuah sistem

(dan interaksi antar subsistem) secara eksak, tetapi lebih menggambarkan

proses-proses dan jalur-jalur aktivitas dari level atas secara umum

2.2.5 Squence diagram

Gambar 2.7 Contoh Squence Diagram

(Source : E-Book Pengantar Unified Modeling Language (UML))

Page 28: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

14

Sequence diagram menggambarkan interaksi antar objek di dalam

dan di sekitar sistem (termasuk pengguna, display, dan sebagainya) berupa

message yang digambarkan terhadap waktu. Sequence diagram terdiri atar

dimensi vertikal (waktu) dan dimensi horizontal (objek-objek yang

terkait).

Sequence diagram biasa digunakan untuk menggambarkan skenario

atau rangkaian langkah-langkah yang dilakukan sebagai respons dari

sebuah event untuk menghasilkan output tertentu.

2.2.6 Collaboration diagram

Gambar 2.8 Contoh Collaboration Diagram

(Source : E-Book Pengantar Unified Modeling Language (UML))

Collaboration diagram menggambarkan interaksi antar objek

seperti sequence diagram, tetapi lebih menekankan pada peran masing-

masing objek dan bukan pada waktu penyampaian message.Setiap

message memiliki sequence number, di mana message dari level tertinggi

Page 29: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

15

memiliki nomor 1.Messages dari level yang sama memiliki prefiks yang

sama.

2.2.7 Component diagram

Gambar 2.9 Contoh Componen Diagram

(Source : E-Book Pengantar Unified Modeling Language (UML))

Component diagram menggambarkan struktur dan hubungan antar

komponen piranti lunak,termasuk ketergantungan (dependency) di

antaranya.

Page 30: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

16

2.2.8 Deployment diagram

Gambar 2.10 Contoh Deployment Diagram

(Source : E-Book Pengantar Unified Modeling Language (UML))

Deployment/physical diagram menggambarkan detail bagaimana

komponen di-deploy dalam infrastruktur sistem, di mana komponen akan

terletak (pada mesin, server atau piranti keras apa),bagaimana kemampuan

jaringan pada lokasi tersebut, spesifikasi server, dan hal-hal lain yang

bersifat fisikal.

2.3 Smart Home

Menurut Fawzi Behmann dan Kwok Wu : Smart home adalah sebuah

konsep rumah cerdas yang memanfaatkan teknologi secara maksimal, dengan

Page 31: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

17

kontrol terpusat untuk mengendalikan dua atau lebih sistem individu yang

bertujuan meningkatkan efesiensi , kenyamanan dan keamanan.

Gambar 2.11 Ilustrasi Smart Home – Remote

(Source : E-Book Pengantar Unified Modeling Language (UML))

beberapa contoh penerapan smart home yang di bagi 4 kategori :

a) Kontrol Lingkungan

Penerapan konsep smart home pada area lingkungan rumah seperti pada

taman dan pekarangan. memberikan beberapa informasi seperti suhu ,

kelembapan udara, dektektor banjir , tirai elektrik, dan sebagainya.

b) Efesiensi Energy

Page 32: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

18

Penerapan konsep smart home untuk mengefesiensi sumber energi seperti

listrik , air , gas, lemari es, kompor, pencuci piring, mesin cuci, dan

sebagainya. Baik secara otomatis atau remote.

c) Keamanan dan Keselamatan ( Indor / Outdoor )

Penerapan konsep smat home untuk keamana dan keseleamatan seperti

detektor gerak, kunci pintu, jendela , garasi,dll. Baik secara otomatis atau

remote.

d) Kesehatan dan Kebugaran

Penerapan konsep smart home untuk kesehatan dan kebugaran seperti

iWatch yang dapat menyesuaikan suhu ruangan berdasarkan suhu badan,

mencegah penyakit kronis dengan memberikan sebuah informasi

kesehatan, dan sebagainya

2.4 Mikrokontroler Arduino

Mikrokontroler menurut Gunther Gridling dan Bettina Weiss adalah sebuah

prosesor dengan memory dan kompenen lainya yang dikemas dalam satu chip /

IC. Adapun Basic Layout dari mikrokontroler adalah :

a) Inti Prosesor

b) Memori

c) Interupsi Kontroler

d) Timer / Counter

e) Digital Input / Output

f) Analog Input / Output

g) Interfaces

h) Wachdog Timer

Page 33: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

19

i) Debugging Unit

Adapun secara garis besar mikrokontroler adalah (serangkaian) prosesor yang

dilengkapi dengan memori, timer, (paralel) I / O pin dan chip peripheral lainya.

Menurut Jazi Eko Prasetyo : Teknologi mikrokontroler sebagai salah satu produk

teknologi semikonduktor berkontrubusi besar untuk menunjang aktivitas manusia.

Sejumlah parameter kondisi bisa dipantau menggunakan teknologi mikrokontroler

sebagai front-end device dengan melibatkan perangkat berspesifikasi tinggi.

Gambar 2.12 Arduino Uno

Arduino merupakan salah satu dari sekian produk edukasi mikrokontroler

sebagai proyek rintisan berlisensi terbuka dan mampu difungsikan sebagai produk

akhir. Dalam modul juga disertai komponen elektronika, struktur serta antarmuka

Arduino yang sederhana memberi kemudahan pengguna dalam memahami

parameter (visualisasi maupun non-visual) seperti konsep sensor atau penerapan

sensor elektronik yang tidak selalu bisa di amati langsung seperti infra merah.

Konsep bahasa Arduino dengan mentargetkan ke pin tertentu (secara fisik)

menjadikan lebih mudah dipahami oleh berbagai kalangan. Bagi programer

tingkat lanjut, hal ini mungkin merupakan halangan, misalnya optimasi kecepatan

Page 34: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

20

eksekusi pada kisaran mikrodetik yang hanya bisa dilakukan menggunakan

bahasa C atau Assembler. Meskipun demikian, pengguna bahasa Arduino dapat

menjadi nilai tambah, yaitu efesiensi waktu desain prototype dan kemudahan

penerapan yang lebih luas tanpa perlu pemahaman dasar fungsu-fungsi

mikrokontroler.

Arduino juga memberikan kemudahan ekspensi sistem menggunakan sistem

komunikasi yang sederhana dan efektif. Dalam penerapan memakai konsep

“Shield”, sebab modul-modul eksternal arduino bersifat simple constumable dan

sebagaian besar produk modul ekspansi tidak perlu pensolderan sama sekali.

Konsep Shield pada arduino dapat di ibaratkan dengan sebuah plug-in pada

browser, arduino shield adalah device yang dapat dengan mudah dibuka dan

dilepas pada device inti arduino contoh penggabungan seperti arduino uno dan

arduino ethernet shield yang penulis akan terapkan, secara umum arduino uno

tidak memiliki fitur device untuk colokan kabel rj45 namun dengan fitur

tambahan dari arduino ethershield memungkinkan menerapkan konsep jaringan

melalui ethernet rj45.

Gambar 2.13 Ethernet Shield

Page 35: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

21

Seluruh mikrokontroler yang diimplementasikan pada produk Arduino

menggunakan ATMega keluaran AVR. Sala satunya seri ATMega 328 dengan

sejumlah fitur di antara On-Chip System Debug, 5 Mode Sleep, 6 saluran ADC

yang mendukung reduksi derau,, ragam hemat daya (Power-save Mode, Power-

down), dan Ragam Standby Mode.

Gambar 2.14 ATMega 328

Mikrokontroler ATMega 328 paling umumnya dugunakan pada board

Arduino seperti UNO, Duemilanove, Nano, dsb. Sedangkan ATMega 1280

dipakai pada tipe Arduino Mega.

Page 36: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

22

Gambar 2.15 ATMega 1280

baik ATMega 328 maupun ATMega 1280, keduanya menggunakan kristal

16Mhz sebagai pembangkit clock. Keduanya juga memiliki block memory Flash

untuk penyimpanan instruksi program, SRAM untuk penyimpanan variable data

sementara dan EEPROM sebagai media penyimpanan data yang tetap tersimpan

meskipun mikrokontroler dalam kondisi tidak di catu. Fitur mikokontroler AVER

seri lainya seperti ATMega 168 atau 2560 tidak jauh berbeda dengan 328 atau

1280, kecuali pada ukuran kapasitas neniru EEPROM, Flash, dan SRAM.

2.5 PEMROGRAMAN

2.5.1 HTML

Menurut buku Abdul kadir : "HTML (Hypertext Markup

Language) adalah bahasa script yang digunakan untuk menyusun halaman

Page 37: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

23

Web. Sejauh ini ada sejumlah standart HTML, antara lain HTML 4,

XHTML, HTML 5 ". Contoh script HTML :

<html>

<head>

<title>Contoh</title>

</head>

<body>

<h1> Abdul Jabar Hakim</h1>

</body>

</html>

Penulisan script HTML biasa di awali dengan <html> dan </html>

sebagai penutup script, sebagian script HTML selalu memiliki tanda

pembuka dan penutup seperti <title>.....</title> script yang berfungsi

untuk membuat judul pada dokument HTML. Extention HTML pada

umumnya adalah “ .html ” .

2.5.2 CSS

Menurut buku Abdul kadir : “CSS (Cascading Style Sheet) adalah

skrip yang di tunjukan secara khusus untuk mengatur tampilan aplikasi

web”.

Penulisan script css memiliki dua teknik, Internal dan External.

penulisan script Internal adalah penggunaan script css yang dimasukan

secara langsung pada halaman website yang sedang di design dengan

menambahkan <style> </style> di dalam <head>, sedangkan penulisan

script External adalah penggunaan script css yang diletakan terpisah pada

halaman website yang sedang di design. Contoh script CSS :

Page 38: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

24

.table{

text-align: center;

}

thead{

background-color: #f8f8f8;

}

Penulisan script CSS memiliki sebuah aturan seperti Selector,

Declaration, Property, dan Value. Untuk gambar di atas yang dimaksud

dengan selector adalah body, table,tr,td, .container. declaration adalah

background-color: blue; , padding: 5px , text-align :center; . sedangkan

Property adalah background-color, padding, text-align dan Value adalah

blue, 5px, center. Extention CSS pada umumnya adalah “ .css ” .

2.5.3 PHP

Menurut buku Lukman Hakim : “PHP adalah singkatan dari

Personal Home Page yaitu bahasa pemrograman yang di gunakan untuk

membuat aplikasi web. PHP disebut sebagai server side scripting, artinya

skrip PHP dijalankan di sisi server, dimana setelah skrip PHP di olah di

server, hasilnya dikirimkan ke broser (klien).”.Contoh script PHP

<?php

$nama = “Hakim”;

$umur = 22;

echo “Hai nama saya “.$nama.”<br />”;

echo “Umur saya saat ini ”.$umur;

?>

Penulisan script PHP selalu di awali dengan <?php dan ?> sebagai

penutup script. Salah satu kelebihan PHP adalah dapat berjalan di

Page 39: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

25

berbagai macam sistem opreasi seperti Linux, Windows, atau Mac.

Extention untuk file PHP pada umunya adalah “.php”.

2.5.4 Mysql

Menurut buku Lukman Hakim : “Mysql adalah salah satu software

database relasional yang di design khusus untuk menangani pengelolaan

database di lingkungan web”, walaupun pada kenyataannya mysql di

gunakan juga untuk aplikasi berbasis desktop contohnya adalah VB atau

Visual Basic.Contoh script Mysql :

SELECT * FROM mahasiswa where nama=”hakim”;

Penggunaan sintaks Mysql hampir sama dengan SQL karena

Mysql merupakan turunan salah satu konsep SQL. Penyisipan sintaks

mysql pada PHP biasa di kenal dengan Query. Contoh penerapan Mysql

pada PHP :

$contohquery = “INSERT INTO log (username, waktu,

nama_kontrol, posisi_terakhir) VALUES ('$username', '$waktu',

'Lampu 1', 'on')”

$tampung = mysql_query($contohquery);

2.5.5 Mysqli

Menurut Buku Lukman Hakim : “Ekstensi mysql paling populer

dikalangan programer PHP, namun sejak PHP versi 5.5 tidak di anjurkan

lagi untuk di gunakan, sehingga ada peringatan resmi dari pengembang

Page 40: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

26

PHP mengenai bahwa extention mysql dalam proses depreceted ( akan di

hapus pada versi berikutnya )”. Oleh karena itu penulis menggunakan

mysqli sebagai extention php. Contoh penerapan Mysqli pada PHP:

$contohquery = “INSERT INTO log (username, waktu,

nama_kontrol, posisi_terakhir) VALUES ('$username', '$waktu',

'Lampu 1', 'on')”

$tampung = mysqli_query($koneksinya,$contohquery);

Terlihat digambar penggunaan sintaks mysql dan mysqli tidak

begitu berbeda di PHP, sehingga pengguna yang terbiasa menggunakan

mysql tidak akan kesulitan untuk berpindah ke mysqli. Contoh apabila

mysql menggunakan mysql_query untuk mengeksekusi query maka

dengan mysqli menggunakan mysqli_query, perbedaanya hanya

menambahkan “ i “ .

2.5.6 JavaScript

Menurut buku Abdul Kadir : JavaScipt adalah bahasa script yang

di gunakan untuk mengontrol tindakan tindakan yang di butuhkan di

halaman web. Perkembangan javascript cukup pesat sehingga muncul

library yang di dasarkan oleh javascript seperti JQuery serta teknik

pemrograman yang makin populer seperti Ajax dan JSON.Contoh script

JavaScript :

<script>

var x = 5;

var y = 6;

Page 41: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

27

var z = x + y;

document.getElementById("demo").innerHTML = z;

</script>

Seperti layaknya CSS penulisan script javascript memiliki dua

teknik, Internal dan External. penulisan script Internal adalah penggunaan

script javascript yang dimasukan secara langsung pada halaman website

dengan menambahkan <script> untuk pembuka dan </script> untuk

penutup, sedangkan penulisan script External adalah penggunaan script

javascript yang diletakan terpisah pada halaman. Extention javascript

secara umum adalah “ .js ”.

JQuery pada dasarnya adalah daftar pustaka dari JavaScript,

artinya penggunaan JQuery adalah untuk menyederhanakan script-sciprt

Javascript menjadi lebih pendek.Contoh script JQuery :

$("button").click(function(){

$("p").hide("slow",function(){

alert("The paragraph is now hidden");

});

});

Jquery dirilis pada awal tahun 2006 dengan lisensi ganda MIT dan

GPL. Dengan adanya JQuery tersebut munculah beberapa metode-metode

untuk membuat sebuha website menjadi lebih interaktif seperti Ajax dan

JSON.

Contoh penggunaan Ajax seperti Berikut :

Page 42: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

28

$("#lampuhidup1").click(function(){

$.ajax({

url: "proses/lampu1hidup.php",

success: function(response)

{

if(response == "success") {

$("#lampu1mati").fadeOut();

$("#lampu1hidup").fadeIn();

}

else

alert("Terjadi Kesalahan");

}

});

return false;

});

Maksud dari penggunaan ajax di atas adalah apabila ID dengan

nama lampuhidup1 di klik maka akan menjalankan proses yang berada

pada file proses dengan nama file lampu1hidup.php, apabila

lampu1hidup.php memberikan output “success” atau proses berhasil

dilakukan maka akan menyembunyikan ID dengan nama lampu1mati dan

memunculkan ID dengan nama lampu1hidup, apabila proses tidak

berhasil atau tidak ada outpus “success” maka akan muncul sebuah alert

atau pop up yang berulisan “Terjadi Kesalahan”. Terlihat jelas di sini

bahwa dengan menggunakan jquery dan ajax makan akan membuat

website kita menjadi lebih interaktif.

Page 43: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

29

Sedangkan JSON singkatan dari JavaScript Object Notation

dengan cara kerja dan fungsi utama seperti XML untuk mentansfer data

antar device / OS / bahasa pemrograman yang berbeda dan sebagai media

penyimpanan data. Contoh penggunaan JSON pada JQuery :

var data_table = "";

var data_user = "";

$.ajax({

url: "json/json_master_guru.php",

dataType: "json",

success: function(data) {

for (var i =0; i<data.length; i++){

data_table +="<tr

class='"+data[i].id_guru+"' id='"+data[i].id_guru+"-

1'><td> "

+data[i].id_guru+"</td> <td>"

+data[i].nama+"</td> <td>"

+data[i].mata_pelajaran+"</td><td>

“</tr>"; data_user +="<tr class='"+data[i].id_user+"'

id='"+data[i].id_user+"-2'><td> "

+data[i].id_user+"</td> <td>"

+data[i].username+"</td> <td>"

+data[i].password+"</td> <td>"

+data[i].level+"</td></tr>";

}

$('#master_guru').append(data_table);

$('#master_user').append(data_user);

}

});

Dengan mengkombinasikan Ajax dan JSON maka akan membuat

sebuah web lebih interaktif khususnya pada pengelolan data. untuk

mereload sebuah data yang di proses pada umumnya sesorang harus

merefresh browser, tapi dengan bantuan JSON setiap proses bisa di atur

ketika berhasil yang di reload adalah datanya bukan halaman.

Page 44: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

30

2.6 Motor DC DAN Motor Stepper

Menurut Jazi Eko Istiyanto : Cara kerja motor DC sama seperti

dinamo pada kipas pending pada PC atau dinamo pada mainan remote

control. Motor akan berputar ke satu arah jika di beri masukan tegangan

DC, Sedangkan motor Stepper hanya berputar jika diberikan masukan

pulsa paralel berurutan dari 0 hingga nilai bit maksimal (susuai jumlah

koneksi yang tersedia) jika ada 4 konektor maka putaran motor stepper

akan dimulai dengan masukan logika 0000, 0001, 0010, hingga 1111

kemudian kembali ke 0000 lagu dan seterusnya. Jika dimasukan nilai

bernilai acak atau tidak berurutan, motor stepper tidak akan bergerak

berputar. Pada umumnya motor DC beroperasi pada tegangan 1,5V – 4,5

V, dengan putaran maksimal sekitar 12800rpm yang dapat dicapai jika

dicatu pada tegangan 4,5V dengan arus paling sedikit 320Ma.

Gambar 2.16 Motor DC

Page 45: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

31

Sedangkan motor Stepper bisa di gerakan menggunakan mekanisme

yang berbeda dengan motor DC, sehingga di perlukan rancangan skema

rancangan serta sketch Arduino yang berbeda dari penggerak motor DC.

Motor stepper bisa berputar di kedua arah, dengan memakai IC L293D

atau SN7754410 dengan saluran OUT1 sampai OUT 4 untuk masukan

IN1 samapi IN4 motor stepper. Pin kontrol enable ENA dan ENB

terhubung ke VCC = 5V, sedangkan IN1, IN2, IN3, IN4 secara berurutan

di hubungkan ke D5,D4,D3,dan D2. Apabila menggunkaan model SM-

42BYG011-25 harus bertipe bipolar.

Gambar 2.17 Motor Stepper

Page 46: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

32

2.7 KOMPONEN ELEKTRIK

2.7.1 RESISTOR

Gambar 2.18 Resistor

Menurut Jazi Eko Istiyanto : Fungsi Resistor sebagai peredam

tegangan DC atau AC, Resistor berbahan dasar karbon film atau metal

film, dengan besaran satuan resistans ohm berkisaran 0,1 ohm dan M-

ohm (1 Mega = 1. 10 pangkat 6 ohm).

Resistor tidak memiliki polaritas, atau disebut sebagai non-polar,

resistor dapat di bagi menjadi enam tipe di bedakan berdasarkan pada

kualitas dan nilai keakuratannya, antara lain Resistor tipe 5%, memiliki

ketepatan nilai resistansi rill 5% dari besaran resistansinya yang tertera.

Resistor tipe 10% memiliki nilai nyata tidak kurang / lebih dari 10%.

Resistor tipe 20% memiliki keakuratan terendah 20%. Resistor tipe 1%

memiliki keakuratas 1% dengan nilai selisih tidak kurang atau melampaui

1%. Resistor tipe 2% memiliki keakuratan 2% seperti resistor 1%. Dan

terakhir adalah Variable Resistor (VR) merupakan resistor yang besar

resistansnya dapat di variasikan 0 ohm hingga nilai maksimal yang tertera

Page 47: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

33

pada VR tersebut, untuk VR sendiri memiliki dua tipe yaitu potensiometer

yang memiliki ukuran cukup besar dengan tuas pengatur dan tipe trimpot

tanpa tuas pengatur.

2.7.2 KAPASITOR

Gambar 2.19 Kapasitor

Menurut Jazi Eko Istiyanto : Fungsi kapasitor memiliki banyak

fungsi di antaranya sebagai penguat tegangan DC untuk rangkaian catu

data atau tapis gelombang AC. Selain itu bisa di aplikasikan sebagai

generator pembangkitt gelombang kotak maupun sinusoida. Kapasitor

menggunakan saturan Farad (F), jangkauannya antar 1 pico-Farad (pF)

atau 1 x 10 pangkat 12 Farad hingga 1 F. beberapa jenis kapasitor ada

yang bertipe polar dan non-polar. Terdapat beberapa jenis kapasitor yang

beredar pada umumnya seperti kapasitor keramik, kapasitor yang bersifat

non-polar dan berbentuk seperti keramik. Kapasitor Polyster (Mylar)

kapasitor dengan kategori kelas II dan bersifat non-polar. Kapasitor

Elektrolit yang tersdisi dari dua lembar plat metal alumunium yang di

Page 48: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

34

pisahkan oleh bahan cariran dielektrik dan bersifat polar. Kapasitor

Tantalum adalah kapasitor dengan elektroda yang terbuat dari material

tantalum dan berpolaritas positif.

2.7.3 Dioda dan LED

Gambar 2.20 Contoh Simbol dan Bentuk Dioda

Menurut Jazi Eko Istiyanto : Dioda adalah komponen

semikonduktor yang hanya mengalirkan arus searah. Bahan dasar dari

dioda terdu atas germanium dan silikon yang dapat diklarifikasikan

menjadi tiga jenis yaitu,

a) Dioda Kontak Titik sebuah dioda yang diaplikasikan sebagai

pengubah sinya berfrekuensi tinggi ke sinyal yang berfekuensi

rendah, Umunya di gunkaan pada rangkaian radio penerima

gelombang AM atau FM. Contoh : dioda tipe 0A 71, 0A 90 dan

1N 60.

b) Dioda Hubungan sebuah dioda yang berfungsi sebagai penyearah

tegangan, memiliki batas tegangan dan arus maksimal, jika dialiri

melebih batas akan mengakibatkan rusaknya dioda. Contoh : dioda

tipe 1N40001 memiliki batas arus dan tenggangan hingga 1A 50V

Page 49: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

35

c) Dioda Zenar sebuah dioda dengan berbagai tipe tegangan dan arus

pembatasnya. Misalnya dioda zener 6V8 mampu membatasi

tegangan luaran pada 6,8V meskipun tegangan masukan sebesar

12V atau lebih. Sebaliknya, saat tegangan masukan kurang dari

6,8V tegangan luaran akan sama dengan tegangan masukan,

Pembatasan tengan ini terwujud dari pemanfaatan karakteristik sisi

eksklusif daerah tegangan breakdown (daerah kerja reverse bias)

d) Light Emitting Diode (LED) adalah dioda yang dapat

memancarkan cahaya dengan tegangan catu minimal 1,8V. selain

itu LED berfungsi sebagai penyearah arus dan dapat digunakan

berbagai rangkain elektronika, sebagai indikator lampu

penerangan dengan efesiensi yang tinggi dan ketahanan jauh lebih

baik dibandingkan lampu bohlam maupun neon PL.

Gambar 2.21 Bentuk Led

LED juga dapat digunakan sebagai pembatas tegangan dari

tegangan catu yang tidak terlalu besar (3V sampai 5V), jika di catu

melebihi 5V akan merusak LED

Page 50: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

36

3 BAB III

ANALISA DAN PERANCANGAN SISTEM

3.1 Analisa dan Perancangan Sistem

Menurut Abdul Kadir : Tahapan analisa sistem dimulai karena adanya

permintaan dan keinginan terhadap sistem baru atau penyempurnaan sistem lama,

beberapa faktor yang mempengaruhi analisa sistem antara lain adanya masalah

pada suatu sistem yang telah di terapkan atau menemukan adanya peluang baru.

Tujuan analisa sistem untuk menentukan hal-hal detail tentang akan dikerjakan

oleh sistem yang di usulkan (dan bukan bagaimana caranya).

Perancangan untuk Prototype Smart Home di gambarkan oleh penulis

menggunakan UML (Unified Modelling Language) yang meliputi Desain Sistem,

Desain Alat dan Rangakan Elektronik, Desain Keamanan, Desain Program.

Adapun fitur dari Prototype Smart Home ini adalah :

a) Menyalakan Lampu yang disimulasikan menggunakan lampu LED.

b) Menyalakan Lampu bohlam AC dengan bantuan Relay.

c) Menutup (mengunci) dan Membuka pintu yang disimulasikan

menggunakan motor DC dan H-Bridge.

d) Menggerakan Kamera yang memiliki rotasi 90 derajat yang disimulasikan

menggunakan webcam dan Servo.

Page 51: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

37

3.2 Desain Sistem

3.2.1 Analisa Flowchart

Gambar 3.1 Analisa Flowchart

Page 52: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

38

Gambar di atas menginformasikan bagan alur dari aplikasi prototype Smart

Home secara garis besar, dimana user melakukan login terlebih dahulu dan

melakukan autentifikasi device dan nantinya user dapat melakukan beberapa

kontrol seperti kontrol lampu, kontrol pintu ,dan kontrol kamera.

3.2.2 Analisa Use Case Diagram

Use Case Diagram adalah sebuah diagram yang menggambarkan

fungsionalitas yang di harapkan dari sebuah sistem , yang ditekankan adalah

“apa” bukan “bagaimana”.

Gambar 3.2 Analisa Use Case Diagram

Page 53: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

39

Gambar di atas menunjukan fungsi dari aplikasi yang akan di buat, pada

gambar di beri contoh ada user1 dan user2 masing-masing dari user atau

pengguna dapat menggunakan aplikasi prototype smart home untuk melakukan

beberapa kontrol seperti kontrol lampu dan kontrol pintu, melihat kamera dan

mengontrol posisi kamera, dan melihat aktivitas atau log.

3.2.3 Analisa Squence Diagram

Squence Diagram adalah sebuah diagram yang memperlihatkan interaksi

antara objek di dalam dan di sekitar sistem yang di gambarkan terhadap waktu.

Untuk Squence Diagram penulis memiki dua perencanan , perencanaan pertama

menggunakan IP public dan perencanaan tanpa IP public menggunakan ngrok,

ngrok adalah aplikasi untuk membuat tunneling dari internet sehingga

memungkinkan localhost dapat di akses dari internet.

Gambar 3.3 Ilustrasi Aplikasi ngrok

Page 54: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

40

Gambar 3.4 Squence Diagram dengan IP public

Gambar di atas adalah gambaran dari aplikasi prototype smart home yang

akan di buat apabila penulis mempunyai IP public, dimana nantinya akan ada

lebih dari 1 Ethernet pada komputer PC yang satu terhubung ke Arduino dan satu

lagi terhubung Internet, keduanya saling terkoneksi melalui jaringan LAN .

Page 55: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

41

Gambar 3.5 Squence Diagram tanpa IP Public

Gambar di atas adalah desain kerja dari aplikasi prototype smart home

yang akan di buat apabila penulis tidak memiliki IP public, ada tiga object yang

saling berkaitan satu sama lain yaitu VPS ( Virtual Private Server ) sebagai

interface user, Arduino sebagai pengendali ( lampu, pintu, motor penggerak

kamera), dan PC atau Komputer sebagai perantara antara VPS dan

Arduino.Sebelum menjalankan aplikasi prototype smart home, koneksi antara

arduino dan pc terkoneksi, kemudian dari PC menjalankan aplikasi ngrok.

Page 56: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

42

` Setelah konsep jaringan antara Arduino, PC, dan VPS sudah terkoneksi

maka user di haruskan login untuk dapat mengakses aplikasi prototype smart

home, dalam proses login terdapat autentifikasi device via E-mail , apabila user

melakukan login dari device baru maka user di haruskan melakukan autentifikasi

kode melalui e-mail.

3.3 Desain Alat dan Rangkaingan Elektronik

Gambar 3.6 Rencana rangkaian Prototype Smart Home

Gambar di atas adalah gambar rangkaian dasar untuk prototype smart

home dimana gambar tersebut menggambarkan 4 switch button, 4 resistor 220,

dengan output 3 buah led, walaupun salah satu led akan diganti dengan bohlam

Page 57: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

43

dan bantuan relay sebagi kontaktor.walaupun demikian secara konsep pengaliran

dan cara kerja sama seperti rangkaian pada gambar. Adapun komponen yang

digunakan selain Arduino Uno dan Arduino Ethershield pada prototype smart

home ini adalah :

Table 3.1 Komponen yang di gunakan

No Nama Komponen Jumlah

1 Lampu Led 6 ( 2 Warna)

2 Lampu Bohlam (AC) 1

3 Resistor 4

4 Button Switch 4

5 PCB Titik 1 (dipotong 2)

6 Motor DC 1

7 Servo Motor 1

8 H-Bridge (ic L293) 1

9 Rilay 1

10 Kabel Jumper (Kabel Telefon) 4 Meter

Karena menggunkan lampu Bohlam jenis listrik AC maka perlu menggunakan

Relay yang berfungsi untuk menjadi kontaktor dari tegangan DC ke AC ,

Page 58: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

44

Gambar 3.7 Penggunaan Rilay

Table 3.1 Table Keterangan Point Relay

No Keterangan

1 Input Power

2 Input Arduino

3 Input Ground

4 Input Arus AC

5 Bohlam Lampu

penulis merencakan untuk membuat pintu berupa slide dengan cara kerja seperti

mesin DVD dengan bantuan IC Motor Driver L293d yang berfungsi sebagai H-

Bridge atau pembolak balik tegangan.

1 2 3

4 5

Page 59: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

45

Gambar 3.8 IC L293d

penulis membuat simulasis untuk mewakili perangkat yang ada di rumah seperti :

Tabel 3.2 Tabel Simulasi Elektronik

TABEL SIMULASI

Simulasi Menggunakan

Lampu 1 Led 1

Lampu 2 Led 2

Lampu 3 Led 3 ( Lampu Bohlam)

Pintu 1 Motor DC

Rotasi Kamera Servo 2

Page 60: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

46

Setiap lampu mewakili ruangan, artinya penulis akan mendesain semacam

prototype rumah dengan tiga ruangan dan satu pintu, dimana satu ruangan akan di

wakili oleh Led yang disusun secara seri dan pararel.

Gambar 3.9 Perencanaan denah Prototype Smart Home

3.4 Desain Kemanan

Penulis membuat konsep keamanan berupa validasi data yang akan

mengakses aplikasi prototype smart home dengan metode login dan autentifikasi

device adapun alur untuk metode login dan autentifikasi device yang penulis

rencanakan seperti berikut :

Page 61: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

47

Gambar 3.10 Flowchart Autentifikasi Login

Gambar di atas adalah alur untuk mengakses aplikasi prototype smart

home, dimulai dengan user melakukan input username dan password yang sudah

dimiliki sebelumnya, kemudian dilakukan validasi oleh sistem apabila datanya

valid atau ada di database maka akan memasuki autentifikasi device, untuk

autentifikasi device penulis menggunakan cookies, sebelum masuk kedalam

aplikasi akan ada autentifikasi yang di haruskan pengakses memiliki cookies,

apabila tidak ditemukan cookies yang dimaksud oleh aplikasi prototype smart

home maka akan dialihkan kedalam halaman generate code , halaman generate

Page 62: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

48

code adalah halaman yang mewajibkan user memasukan kode yang dikirim via

email, apabila kode sesuai, maka sistem akan membuat cookies yang dibutuhkan

untuk dapat mengakses aplikasi protype smart home. Adapun cara kerja dari

generate kode dengan menjadikan password hash md5 dan mengambil

pertengahanya sebanyak enam digit, kemudian enam digit tersebut di simpan

dalam database dan dikirim ke email user yang melakukan login.

3.5 DESAIN PROGRAM

Agar user tidak kesulitan mengakses aplikasi perlu interface yang user

friendly, maka dari itu penulis merencanakan sebuah tampilan menggunakan

bootstrap dengan menggunakan bootstrap maka akan membuat tampilan menarik

dan responsive.

Gambar 3.11 Perencanaan Tampilan Login

Gambar di atas adalah perencanaan untuk tampilan login , dimana nantinya

user menginputkan username dan password pada tengah tengah halaman.

Username

Passowrd

Image

Kontrol Kamera Setting

Selamat Datang $User

Page 63: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

49

Gambar 3.12 Perencanaan Tampilan Menu

Gambar di atas adalah perencanaan untuk halaman menu awal ketika user

berhasil melakukan login, tampilan kiri atas adalah tampilan untuk Kontrol yang

meliputi kontrol lampu dan pintu, Kamera yang meliputi tampilan media stream

kamera beserta kontrol kiri dan kanan, sedangkan Setting berisikan informasi dari

pengguna user seperti email dan melihat aktivitas aplikasi.

Untuk tabel database penulis merencanakan membuat tabel seperti berikut :

Tabel 3.3 Tabel User

id_user nama username password hash mail

Table user berisikan informasi mengenai user atau pengguna dari aplikasi

prototype smart home, field id user sebagai primary key, field nama berisikan

informasi dari nama si user, field username dan field password untuk akses login,

field hash untuk menampung enam digit yang digunakan, dan field mail berisikan

alamat email si user untuk mengirimkan enam digit melalui mail tersebut.

Tabel 3.4 Tabel Log

Page 64: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

50

id_aksi username waktu nama_kontrol posisi

Table diatas adalah table log atau table aktivitas guna mencatat kejadian

yang dilakukan di dalam aplikasi prototype smart home, field id aksi sebagai

primary key ,field username berisi informasi dari user yang melakukan aksi, field

waktu berisikan informasi dari waktu kerjadian aksi, field nama_kontrol berisi

informasi jenis kontrol yang di lakukan dan field posisi berisikan informasi

mengenai posisi dari si kontrol tersebut contohnya on atau off, buka atau tutup.

Page 65: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

51

4 BAB IV

PEMBAHASAN

4.1 PEMBAHASAN PROTOTYPE SMART HOME

Prototype Smart Home yang penulis buat adalah sebuah simulasi dari

konsep rumah pintar , dalam penerapan konsep rumah pintar ada banyak metode

yang digunakan seperti media sensor (Otomatis) ataupun kontrol (Manual).

Pada umumnya konsep kontrol pada Smart Home menggunakan wireless

dan bluetooth, namun dengan tambahan konsep Internet of Thing penulis

membuat simulasi dengan cara menggabungkan smart home dan internet of thing ,

sehingga memungkinkan seseorang mengontrol rumah melalui internet dengan

interface kontrol yang baik, memusatkan kontrol pada satu interface aktif.

4.2 IMPLEMENTASI SISTEM

Implementasi rancangan aplikasi prototype smart home dengan konsep

Internet of Thing penulis menggunakan beberapa hardware antara lain Arduino

Uno, VPS (Virtual Private Server) dan komputer dengan spesifikasi :

Perangkat : Komputer

Sistem Operasi : Windows 7 Ultimate (32bit)

Processor : Intel-Core i3 (3240)

Memori : 2 GB

Browser : - Google Chrome

Page 66: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

52

Dalam implementasi aplikasi prototype smart home penulis tidak menggunakan ip

public, oleh sebab itu dalam pengimplementasian aplikasi prototype smart home

penulis menggunakan aplikasi ngrok, seperti yang telah dibahas sebelumnya

ngrok adalah aplikasi yang memungkinkan localhost dapat di akses dari internet

dengan konsep tunneling.

Gambar 4.1 Penggunaan Jaringan Pada Perangkat

Gambar di atas menginformasikan bahwa antara komputer dan arduino

terhubungan menggunakan via jaringan LAN, lalu untuk VPS dan Komputer

terhubung menggunakan jaringan Internet dan bantuan aplikasi ngrok.

4.3 UJI COBA

Uji coba ini dilakukan untuk melihat perkembangan terakhir aplikasi yang

telah dibuat. Uji coba juga dilakukan sebagai sarana evaluasi sehingga dapat

diketahui letak kekurangan dan kesalahan yang mungkin terdapat didalamnya.

4.3.1 Persiapan

Dalam pelaksanaan untuk menggunakan aplikasi prototype smart

home pelu beberapa konfigurasi yang harus dilakukan selain mengaktifkan

Page 67: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

53

web server pada komputer yang berfungsi sebagai penghubung,

konfigurasi ini dilakukan untuk menghubungkan antara Arduino, PC , dan

VPS, berikut ini adalah skema alur dalam persiapan yang harus dilakukan.

Page 68: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

54

Gambar 4.2 Alur Persiapan

Pada Gambar 4.2 terihat bawah hal yang harus dilakukan pertama

kali adalah memastikan Arduino dan PC sudah terkoneksi dengan baik,

(perangkat kabel jaringan sudah di colokan pada arduino ), arduino di

setting menggunakan IP DHCP yang di share oleh komputer.

Gambar 4.3 Arduino Ethernetshield sudah Terkoneksi

Setelah memastikan bahwa antara komputer dan arduino telah

terkoneksi dengan baik secara physical maka langkah kedua yang harus

dilakukan adalah memastikan komputer mendapatkan hak akses internet.

Mengenai standart koneksi dalam menjalankan aplikasi prototype smart

home menggunakan konsep internet of thing maka saya membuat standart

minimum yaitu 512kbps, hal ini dilakukan untuk menjaga stabilitas dan

koneksi yang baik untuk kedepanya.

Page 69: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

55

Gambar 4.4 Pengecekan Internet dengan ping

Ada beberapa cara dalam melakukan pengecekan terkoneksi internet

dapat di akses atau tidak, salah satunya dengan menuliskan sintaks seperti

gambar di atas melalui command prompt di windows atau terminal di linux,

Kemudian langkah ketiga adalah mengaktifkan ngrok server pada

komputer.

Gambar 4.5 Mengaktivikan Ngrok Server

Pada gambar di atas adalah sintak untuk mengaktifkan aplikasi

ngrok, aplikasi ngrok hanya bisa di jalankan via CMD atau Command

Prompt, pada sistem operasi windows untuk mengarahkan Command

Page 70: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

56

Prompt dapat menggunakan shortcut keyboard , Logo Windows+R

kemudian ketikan “cmd” dan enter, kemudian arahkan directory kelokasi file

ngrok berada lalu tuliskan sintaks ngrok seperti di atas.

Gambar 4.6 Tunneling ngrok berhasil di lakukan

Gambar di atas adalah informasi bahwa aplikasi ngrok berhasil

dilakukan, forwarding dengan kodeunik.ngrok.io adalah alamat tunneling

yang digunakan untuk mengakses komputer internal, untuk memastikan

ngrok server terlah jalan dapat melakukan pengecekan pada port 4040,

127.0.0.1:4040 .

Setelah mengaktivkan ngrok server langkah keempat adalah

mengaktifkan stream server, Media stream yang penulis maksud berfungsi

melihat capture webcam pada web browser seperti streaming.

Page 71: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

57

Gambar 4.7 Stream Server (Webcam XP)

Penulis menggunakan aplikasi stream server Webcam XP dengan

versi 5, adapun alasan penulis menggunakan webcam xp dikarnakan mudah

dan free.

Setelah itu langkah kelima adalah mengirim alamat forwarding

yang kodeunik.ngrok.io ke VPS (Virtual Private Server), penulis telah

membuat sebuah file php untuk mendirect langsung alamat dari ngrok ke

VPS (Virtual Private Server).

Page 72: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

58

Gambar 4.8 Mengirim Alamat Ngrok

Penulis membuat file dengan nama kirimngrok.php untuk

mentransfer alamat forwarding dari ngrok ke VPS (Virtual Private Server),

jalankan dari browser komputer, informasi yang muncul adalah informasi

yang di ambil dari ngrok server yang berada di 127.0.0.1:4040/status

kemudian memfilter kata-kata yang telah di tentukan dan mengambil alamat

dari ngrok yang aktiv (host) alamat tersebut di tampung dan di kirim ke

VPS (Virtual provate Server) pada file callback.php, agar lebih baik maka

perlu dilakukan langkah ke enam hal ini akan melakukan pengulangan

setiap 5 menit sekali dengan cara menjadwal langsung.

Page 73: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

59

Gambar 4.9 Membuat Schedule Pada Windows

Gambar di atas adalah skrip yang di tulis pada menu penambahan

schedule di windows, jadi setiap 5 menit sekali maka komputer akan

otomatis menjalankan file kirimngrok.php .

Page 74: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

60

4.3.2 Halaman Login

Gambar 4.10 Menu Login

Gambar 4.7 adalah halaman interface untuk melakukan login yang

beralamat skripsi.himifda.com alamat ini adalah alamat sub domain dari

himifda.com, untuk mengakses alamat tersebut tidak perlu konfigurasi

browser ataupun standart model browser, namun karena penulis

mengembangkan aplikasi ini menggunakan browser Google Chroom maka

penulis mengusulkan untuk menggunkan browser Google Chroom dengan

versi minimal 40. aplikasi ini di bangun menggunkan bootstrap dengan

konsep responsive sehingga penguna dapat mengakses aplikasi ini dari

komputer,laptop, atau ponsel . dalam menjalankan aplikasi prototype smart

home ini si user di haruskan memasukan username dan password yang

telah di buat sebelumnya, setelah yakin bahwa username dan passwordnya

benar tekan rombol “send code” .

Page 75: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

61

5 4.3.3 Halaman Validasi

Gambar 4.11 Menu Validasi

Penulis membuat sebuah metode login, apabila user belum pernah

melakukan login pada browser sekarang maka perlu melakukan

Autentifikasi kode yang di kirim melalui email. Kode yang dikirimkan ke

email sebanyak 6 digit.

Gambar 4.12 Autentif

ikasi melalui E-Mail

Page 76: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

62

Adapun cara kerja dari kode ini adalah dengan merubah variable

menjadi hash, penulis menggunakan md5, secara default md5 terdiri dari 32

character secara acak, penulis mengambil 6 digit dari tengah hash tersebut

dan kemudian mengirim ke email dan disimpan database.

6 4.3.4 Halaman Utama

Gambar 4.11 Halaman Utama

Berikut adalah tampilan menu utama setelah berhasil melakukan

login dan autentifikasi device, ada informasi terkait user yang melakukan

login, metode login sebelumnya memiliki session yang akan digunakan

untuk menghasilkan log.

Page 77: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

63

7 4.3.5 Halaman Kontrol

Gambar 4.14 Halaman Kontrol

Gambar diatas adalah halaman dari kontrol, halaman ini berfungsi

menjadi sarana interface pusat untuk melakukan kontrol terhadap prototype

smart home, adapun yang dilakukan kontrol lampu 1, lampu 2 , lampu 3 dan

Pintu 1 dengan Informasi posisi kontrol terakhir.

Page 78: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

64

Gambar 4.15 Posisi Lampu 1

Apabil pada lampu 1 ditekan tombol berwarna merah maka lampu

1 pada prototype smart home akan mati dan informasi terkait dengan

lampu 1 akan berubah sesuai dengan posisinya yaitu tidak menyalah,

apabila ditekan tombol bewarna hijau maka lampu 1 pada prototype smart

home akan menyalah dan informasi terkait dengan lampu 1 akan berubah

sesuai dengan posisinya yaitu menyalah

Page 79: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

65

Gambar 4.16 Posisi Lampu 2

Apabil pada lampu 2 ditekan tombol berwarna merah maka lampu

2 pada prototype smart home akan mati dan informasi terkait dengan

lampu 2 akan berubah sesuai dengan posisinya yaitu tidak menyalah,

apabila ditekan tombol bewarna hijau maka lampu 2 pada prototype smart

home akan menyalah dan informasi terkait dengan lampu 2 akan berubah

sesuai dengan posisinya yaitu menyalah.

Page 80: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

66

Gambar 4.17 Posisi Lampu 3

Apabil pada lampu 3 ditekan tombol berwarna merah maka lampu

3 pada prototype smart home akan mati dan informasi terkait dengan

lampu 3 akan berubah sesuai dengan posisinya yaitu tidak menyalah,

apabila ditekan tombol bewarna hijau maka lampu 3 pada prototype smart

home akan menyalah dan informasi terkait dengan lampu 3 akan berubah

sesuai dengan posisinya yaitu menyalah.

8 4.3.6 Halaman Kamera

Gambar 4.18 Menu Halaman Camera

Page 81: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

67

Gambar 4.15 adalah halaman yang menampilkan streaming pada

kamera, penulis menggunakan kamera webcam dengan bantuan stream

server Webcam Xp, pada halaman ini terdapat dua kontrol yang dapat

berotasi kiri dan kanan, dan informasi mengenai posisi terakhir dari si

kamera. Kamera webcam dapat berputar dengan bantuan servo, apabila

ditekan tombol panah kiri, maka kamera akan berputar kearah kiri dan

apabila di tekan tombol panah yang kanan maka akan berputar ke kanan.

9 4.3.7 Halaman Setting

Gambar 4.19 Menu Setting

Gambar diatas adalah halaman yang berfungsi mengatur dari

informasi pengguna aplikasi Prototype Smart Home, dimana pengguna

dapat merubah username dan password serta alamat email yang biasa

digunakan untuk autentifikasi device.

Page 82: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

68

Gambar 4.20 Menu Log pada Menu Setting

Pada halaman setting ini terdapat juga tampilan menu log, tampilan

menu log adalah tampilan yang berisi aktivitas dari prototype smart home,

seperti posisi terakhir dari perangkat , di lakukan oleh siapa dan pada jam

berapa dilakukanya.

Page 83: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

69

10 BAB V

PENUTUP

5.1 KESIMPULAN

Aplikasi Prototype Smart Home adalah sebuah aplikasi untuk simulasi dari

Smart Home atau rumah pintar dengan Konsep Internet Of Thing, Konsep internet

of thing sebuah konsep yang memungkinkan kendali sebuah device melalui

internet. Tampilan aplikasi yang penulis buat telah memenuhi standart aplikasi

web desk yang baik : Keindahan, Komposisi, Simple, Fokus dan Konsisten.

Adapun Hasil dari penggunaan Prorotype Smart Home dengan Konsep

Internet of Thing adalah :

a) Seseorang dapat mengetahui konsep Smart Home dengan lebih interaktif

melalui alat peraga.

b) Seseorang dapat mengetahui konsep Internet Of Thing dengan lebih

interaktif melalui alat peraga.

c) Menjadi bahan pertimbangan yang baik bagi seseorang yang ingin

mengembangkan konsep smart home dan internet of thing

5.2 SARAN

Prototoye smart home dan internet of thing yang penulis buat masih jauh

dari kata sempurna, mengingat gagasan Internet of thing dan smart home belum

begitu lama muncul dikalangan khususnya pada negara indonesia, Berikut ini

adalah saran yang dapat digunakan untuk pengembangan lebih lanjut dari

Prototype Smart Home Dengan Konsep Internet of Thing Menggunakan Arduino

dan Browser :

Page 84: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

70

a) Lebih dikembangkan lagi Logika dari konsep smart home dan internet of

thing untuk kontrol yang lebih spesifik, contohnya adalah pengaturan

suhu, tingkat kecerahan, dan kondisi menggunakan sensor.

b) Lebih dikembangkan lagi Logika dari konsep smart home dan internet of

thing yang berfokus pada keadaan keadaan tidak normal , contohnya

adalah apabila mati listrik.

c) Lebih dikembangkan lagi Logika dari konsep smart home dan internet of

thing bila menggunakan IP public.

d) Lebih dikembangkan lagi Logika dari konsep smart home dan internet of

thing khususnya dalam keamanan.

Page 85: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

DAFTAR PUSTAKA

Agus Eka Pratama, I Putu. 2014 .Smarty City beserta Cloud Computing dan

Teknologi – Teknologi pendukung Lainya

Behmann, Fawzi . Kwok Wu. 2015 . Collaborative Internet of Things for

Futre Smart Connected Life and Business.

Dharwiyanti, Sri . 2003 . Pengantar Unified Modeling Language (UML).

Ilmukomputer.com

Eko, Jazi Istiyanto. 2014 . Pengantar Elektronika & Instrumentasi .

Yogyakarta : ANDI

Hakim, Lukmanul. 2014. Rahasia Inti Master PHP danMysqli. Yogyakarta:

Lokomedia.

Kadir, Abdul. 2013 . Belajar Sendiri Pasti Bisa jQuery. Yogyakarta : ANDI

Kadir, Abdul. 2003. Pengenalan Sistem Informasi. Yogyakarta : ANDI

http://www.arduino.cc/

http://www.w3schools.com/css/

http://www.w3schools.com/bootstrap/

http://www.w3schools.com/ajax/

http://www.w3schools.com/json/

Page 86: PROTOTYPE SMART HOME DENGAN KONSEP INTERNET OF THING (IOT) MENGGUNAKAN ARDUINO BERBASIS WEB

http://getbootstrap.com/

http://www.datatables.net/

https://www.facebook.com/groups/35688476100/?fref=ts

1) https://www.instructables.com

2) http://www.dummies.com/