Diktat ini untuk mengajar matakuliah web interaktif di kampus STMIK El Rahma Yogyakarta. Matakuliah ini mengajarkan membuat website dengan menggunakan node.js. Dimulai dari dasar javascript, sehingga mudah diikuti meskipun belum bisa javascript
2 KISI-KISI Ujian Sekolah Dasar mata pelajaranPPKn 2024.pdf
OPTIMASI NODEJS
1. Web Interaktif Dengan Node.js 1
Web Interaktif
Dengan Menggunakan Node.js
Disusun Oleh :
Wahyu Widodo
SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER
EL RAHMA
YOGYAKARTA
2. Web Interaktif Dengan Node.js 2
Contents
Web Interaktif .................................................................................................................................... 1
Bab 1......................................................................................................................................... 3
Pengenalan Dasar Node.js ........................................................................................................ 3
Pengenalan Node.js................................................................................................................... 4
Bagaimana Node.js Bekerja....................................................................................................... 5
Keunggulan Node.js................................................................................................................... 6
Siapa Pembuat Node.js?........................................................................................................... 6
Beberapa Website yang telah menggunakan Node.js................................................................. 7
Bab 2....................................................................................................................................... 10
Dasar Bahasa Node.js ............................................................................................................. 10
Persiapan Alat-alat untuk Belajar Nodejs.................................................................................. 11
Instalasi Nodejs di Linux .......................................................................................................... 11
Membuat Program Berbasis Teks dengan Nodejs........................................................................ 11
Variabel ................................................................................................................................... 12
Pencabangan (Decission)........................................................................................................ 14
Studi Kasus 1........................................................................................................................... 15
Perulangan (Looping)............................................................................................................... 15
Bab 3....................................................................................................................................... 16
Object Pada Javascript ............................................................................................................ 16
Pembuatan Object ................................................................................................................... 17
Akses Nilai Properti.................................................................................................................. 18
Mengubah Nilai Properti........................................................................................................... 19
Menghapus Properti................................................................................................................. 20
Prototype ................................................................................................................................. 21
Penelusuran Nilai Properti........................................................................................................ 23
Penanganan Nilai Global.......................................................................................................... 26
Bab 4....................................................................................................................................... 28
Asinkron I/O & Event................................................................................................................ 28
PHP & Server HTTP Apache.......................................................................................................... 28
Javascript & Node.js ....................................................................................................................... 29
Bab 5....................................................................................................................................... 31
Server HTTP Dasar ................................................................................................................. 31
Server HTTP Dasar ........................................................................................................................ 31
Menjalankan Server ................................................................................................................. 33
Bab 6....................................................................................................................................... 35
Server File Statis...................................................................................................................... 35
Bab 7....................................................................................................................................... 37
Pemrosesan Data Form HTML................................................................................................. 37
URL Encode ............................................................................................................................ 37
3. Web Interaktif Dengan Node.js 3
Bab 1
Pengenalan Dasar Node.js
Membahas :
Pengenalan Node.js
Cara Kerja Node.js
Keunggulan Node.js
Situs Terkenal yang Menggunakan Node.js
Kompetensi Mahasiswa:
Mampu menjelaskan cara kerja Node.js
Mampu menjelaskan keunggulan Node.js
4. Web Interaktif Dengan Node.js 4
Pengenalan Node.js
Node.js adalah perangkat lunak yang didesain untuk mengembangkan aplikasi
berbasis web dan ditulis dalam sintaks bahasa pemrograman JavaScript. Bila
selama ini kita mengenal JavaScript sebagai bahasa pemrograman yang berjalan di
sisi client / browser saja, maka Node.js ada untuk melengkapi peran JavaScript
sehingga bisa juga berlaku sebagai bahasa pemrograman yang berjalan di sisi
server, seperti halnya PHP, Ruby, Perl, dan sebagainya. Node.js dapat berjalan di
sistem operasi Windows, Mac OS X dan Linux tanpa perlu ada perubahan kode
program. Node.js memiliki pustaka server HTTP sendiri sehingga memungkinkan
untuk menjalankan server web tanpa menggunakan program server web seperti
Apache atau Nginx.
Untuk mengeksekusi Javascript sebagai bahasa server diperlukan engine yang
cepat dan mempunyai performansi yang bagus. Engine Javascript dari Google
bernama V8-lah yang dipakai oleh Node.js yang juga merupakan engine yang
dipakai oleh browser Google Chrome. Sejak kehadirannya, Nodejs banyak
membawa perubahan terhadap dunia pemrograman, khususnya web. Dengan
Nodejs, kita bisa membuat aplikasi Web, Desktop, Mobile, bahkan IoT (Internet of
Things).
Gambar 1 Popularitas Javascript Masih Menduduki Peringkat 1
5. Web Interaktif Dengan Node.js 5
Bagaimana Node.js Bekerja
Berbeda dengan bahasa pemrograman sisi server pada umumnya yang bersifat
blocking, Node.js bersifat non-blocking, sebagaimana halnya JavaScript bekerja.
Node.js berjalan dengan basis event (event-driven). Maksud dari Blocking secara
sederhana adalah, bahwa suatu kode program akan dijalankan hingga selesai, baru
kemudian beralih ke kode program selanjutnya.
Misalkan kita memiliki program dengan algoritma berikut:
Terima reques untuk halaman blog
ambil data blog dari database
tulis html berisi data blog
kirim respon ke klien
Bila kita menggunakan bahasa pemrograman blocking yang bersifat multi-thread,
pada poin kedua saat program mengambil data dari database selama jangka waktu
tertentu pada satu thread, maka thread lain yang disiapkan untuk menjalankan poin
ketiga (yakni menulis data dari database ke dalam bentuk HTML) tidak akan
dijalankan hingga thread untuk poin kedua mengembalikan data. Ini sebenarnya
bukan masalah karena CPU menjalankan proses dengan sangat cepat. Hanya saja,
Node.js dengan single-threaded-nya melakukan dengan cara yang berbeda.
Gambar 2 Cara Kerja Node.js
6. Web Interaktif Dengan Node.js 6
Node.js, alih-alih mengalokasikan thread untuk setiap poin, dia hanya akan
membuat thread hanya apabila ada event yang membutuhkan hal tersebut.
Contohnya untuk kasus di atas, ketika program mengambil data dari database,
program hanya akan membuat thread atau dengan kata lain mulai memproses poin
ketiga hanya apabila data dari database sudah diterima, menggunakan callback.
Selain itu, bila ada proses lain yang tidak tergantung pada data tadi, maka proses
tersebut akan dijalankan tanpa harus menunggu pengambilan data selesai.
Keunggulan Node.js
Tak terelakkan bahwa Javascript merupakan bahasa pemrograman yang paling
populer. Jika anda sebagai developer pernah mengembangkan aplikasi web maka
penggunaan Javascript pasti tidak terhindarkan. Sekarang dengan berjalannya
Javascript di server lalu apa keuntungan yang anda peroleh dengan mempelajari
Node.js, kurang lebih seperti ini :
Pengembang hanya memakai satu bahasa untuk mengembangkan aplikasi
lengkap client & server sehingga mengurangi Learning Curve untuk
mempelajari bahasa server yang lain.
Sharing kode antara client dan server atau istilahnya code reuse.
Javascript secara native mendukung JSON yang merupakan standar transfer
data yang banyak dipakai saat ini sehingga untuk mengkonsumsi data-data
dari pihak ketiga pemrosesan di Node.js akan sangat mudah sekali.
Database NoSQL seperti MongoDB dan CouchDB mendukung langsung
Javascript sehingga interfacing dengan database ini akan jauh lebih mudah.
Node.js memakai V8 yang selalu mengikuti perkembangan standar
ECMAScript, jadi tidak perlu ada kekhawatiran bahwa browser tidak akan
mendukung fitur-fitur di Node.js.
Siapa Pembuat Node.js?
Node.js pertama kali diciptakan dan diperkenalkan oleh Ryan Dahl, pada tahun 2009
sehingga JavaScript bisa digunakan sebagai bahasa pemrograman di sisi server,
sekelas dengan PHP, ASP, C#, Ruby dan lain sebagainya. Ryan Dahl adalah
7. Web Interaktif Dengan Node.js 7
seorang pengembang dari Joyent yang merupakan sebuah perusahaan perangkat
lunak dan infrasturktur Cloud. Ia memiliki ketertarikan dengan penerapan single-
threaded pada bahasa pemrograman sisi server dan akhirnya memilih JavaScript
sebagai bahasa untuk Node, setelah sebelumnya mencoba menggunakan Haskell,
Lua dan C.
Gambar 3 Creator Node.js
Beberapa Website yang telah menggunakan Node.js
Paypal
Pada tahun 2013 Paypal mengganti keseluruhan platform yang awalnya Java
menjadi Node JS. Tim Paypal menggunakan framework Express dalam
development tersebut. Disampaikan dalam engineering blog nya Paypal juga
mengembangkan KrakenJS sebagai basis dari platform pembayaran mereka, yang
kemudian di open source kan.
LinkedIn
LinkedIn yang merupakan social network terbesar untuk para professional ini
memanfaatkan Node JS sebagai backend API untuk aplikasi mobile mereka. Node
JS menjadi end point data untuk aplikasi Android dan Iphone.
Uber
8. Web Interaktif Dengan Node.js 8
Semenjak tahun 2011 Uber mengganti backend mereka dengan Node JS. Tujuan
perombakan ini untuk meningkatkan performa backend Uber. Seperti kita tahu Uber
adalah aplikasi transportasi yang populer di US. Layanan Uber juga saat ini tersedia
di Indonesia.
Medium
Situs besutan co-founder Twitter ini menjadi situs blog publishing yang populer.
Medium medapatkan 25 juta unique reader setiap bulannya. Seperti diterangkan
pada blog engineering nya, backend utama dari Medium memanfaatkan Node Js
dan DynamoDB.
Netflix
Situs yang baru saja di block oleh salah satu ISP ini menggunakan Node JS sebagai
backend. Selain Node JS, Netflix juga menggunakan Java, Python dan Cassandra
dalam stack nya. Situs dengan 33 juta member ini merupakan situs televisi internet
terbesar di dunia.
Flipboard
Flipboard adalah aplikasi personal magazine yang mengintegrasikan rss dan social
media feed. Flipboard adalah aplikasi popular dengan jutaan pengguna. Flipboard
sempat menjadi aplikasi build-in di beberapa gadget ternama beberapa tahun lalu.
Merujuk pada StackShare, Flipboard di host pada Amazon EC2 dan menggunakan
Node Js sebagai backend nya.
Trello
Trello merupakan aplikasi manajemen proyek yang digemari developer maupun non
developer. Trello masuk dalam top developer tool 2015 versi StackShare. Merujuk
pada blog FogCreek ternyata Node JS menjadi backend dari Trello. Selain itu Trello
juga menggunakan MongoDB untuk databasenya.
9. Web Interaktif Dengan Node.js 9
Referensi :
1. https://idjs.github.io/belajar-nodejs
2. https://www.codepolitan.com
10. Web Interaktif Dengan Node.js 10
Bab 2
Dasar Bahasa Node.js
Membahas :
Membuat Program Pertama
Cara Menjalankan Program
Variabel
Array
Kompetensi Mahasiswa:
Mampu membuat program sederhana.
Mengerti penulisan variable
Mengerti penulisan array
11. Web Interaktif Dengan Node.js 11
Persiapan Alat-alat untuk Belajar Nodejs
Apa saja peralatan yang harus dipersiapkan untuk belajar Nodejs?
Tek editor
Sudah terinstal node.js, jika belum silahkan install dulu
Instalasi Nodejs di Linux
Silahkan ketik perintah berikut untuk menginstal nodejs versi 6:
curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
sudo apt-get install -y nodejs
Sedangkan untuk versi 8:
curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
sudo apt-get install -y nodejs
Untuk distro dan sistem operasi yang lain, silahkan cek di
sini: https://nodejs.org/en/download/package-manager/
Membuat Program Berbasis Teks dengan Nodejs
Hal selanjutnya yang harus dilakukan adalah membuat program Hello World!.
Silahkan buka teks editor dan tulis kode berikut:
console.log("Belajar Node.js..Semangat !");
Simpan dengan nama hello-world.js. Setelah itu, eksekusi dengan
perintah:
node hello-world.js
Maka hasilnya:
12. Web Interaktif Dengan Node.js 12
Node.js bukan bahasa pemrograman baru, melainkan bahasa
pemrograman javascript. Untuk mereview ulang dasar-dasar
pemrograman javascript, silahkan praktikkan contoh-contoh berikut ini
dengan langkah penyimpanan file dan cara menjalankan seperti
pembahasan tadi.
Variabel
Variabel di definisikan dengan menggunakan kata kunci var. Buat file dengan nama
variabel.js, ketik kode berikut :
Semua tipe angka pada javascript sama dengan tipe float, dan semua bisa
menggunakan operator aritmatika. Praktikan kode berikut :
13. Web Interaktif Dengan Node.js 13
Tipe boolean bernilai true & false. Buat kode berikut ini dengan nama boolean.js
Array dalam javascript ditandai dengan [ ] . buat file baru dengan nama
latihanarray.js ketik kode berikut ini :
14. Web Interaktif Dengan Node.js 14
Pencabangan (Decission)
Merupakan proses pemecahan masalah dalam bahasa pemrograman yang
memiliki kondisi dan aksi. Dengan bantuan decision, kita bisa membuat aksi
berdasarkan kondisi tertentu. Dalam bahasa pemrograman javascript decision
terbagi menjadi dua jenis yaitu IF dan SWITCH.
Contoh Decision If
Buat file dengan nama decision_if.js, kemudian ketik kode berikut :
Contoh Decision Switch
Buat file dengan nama decision_switch.js, kemudian ketik kode berikut :
15. Web Interaktif Dengan Node.js 15
Studi Kasus 1
Selesaikan soal berikut ini :
Sebuah usaha fotokopi mempunyai aturan berikut:
• Jika yang fotokopi statusnya adalah langganan, maka berapa lembar pun dia
fotokopi, harga perlembarnya Rp. 75,-
• Jika yang fotokopi bukan langganan, maka jika dia fotokopi kurang dari 100
lembar harga perlembarnya Rp. 100,-. Sedangkan jika lebih atau sama
dengan 100 lembar maka harga perlembarnya Rp. 85,-.
Buatlah program untuk menghitung yang harus biaya dibayar berdasarkan status
pelanggan atau bukan pelanggan.
Perulangan (Looping)
Looping merupakan metode penyelesaian masalah yang digunakan untuk
mengenerate data yang banyak sesuai dengan jumlah looping. Looping sendiri
terbagi menjadi dua yaitu looping for dan looping while.
Contoh Looping For
Buat file dengan nama looping_for.js, kemudian ketik kode berikut :
Contoh Looping While
Buat file dengan nama looping_while.js, kemudian ketik kode berikut :
16. Web Interaktif Dengan Node.js 16
Bab 3
Object Pada Javascript
Javascript memiliki dua jenis tipe data utama, yaitu tipe data dasar dan objek. Tipe
data dasar pada Javascript adalah angka (numbers), rentetan karakter (strings),
boolean (true dan false), null, dan undefined. Nilai-nilai selain tipe data dasar secara
otomatis dianggap sebagai objek. Objek dalam Javascript didefinisikan sebagai
mutable properties collection, yang artinya adalah sekumpulan properti (ciri khas)
yang dapat berubah nilainya. Karena nilai-nilai selain tipe data dasar merupakan
objek, maka pada Javascript sebuah Array adalah objek. Fungsi adalah objek.
Regular expression juga adalah objek. Segala tipe buatan pengembang tentunya
juga adalah objek.
Objek Javascript terdiri dari banyak properti. Masing-masing properti ini digunakan
untuk mendeskripsikan objek tersebut. Sebuah properti idealnya berhubungan
langsung dan mendeskripsikan objek dengan jelas. Misalkan, objek Mahasiswa
biasanya akan memiliki properti NoInduk dan Nama tetapi tidak memiliki properti
JumlahBaju karena nomor induk dan nama berguna untuk mendeskripsikan
mahasiswa, sementara jumlah baju tidak penting. Contoh lainnya adalah objek Mobil
yang mungkin memiliki properti WarnaBadan dan NoPolisi tetapi tidak memiliki
properti JumlahKaki.
Properti pada objek memiliki nama dan nilai dari properti tersebut. Nama dari
properti menjelaskan nilai yang disimpan oleh properti tersebut. Pada contoh
sebelumnya, WarnaBadan adalah nama dari properti. Nilai dari properti merupakan
“isi” dari nama properti. Contoh dari nilai pada WarnaBadan adalah Merah atau
#FF0000. Nama dari properti harus berupa string, dan boleh berisi string kosong.
Nilai dari properti lebih bebas, yaitu dapat berupa nilai apapun kecuali undefined. Hal
ini berarti kita dapat mengisikan properti dengan nilai bertipe number, boolean,
string, null, dan objek.
17. Web Interaktif Dengan Node.js 17
Pembuatan Object
Objek pada Javascript bersifat class-free. Hal ini berarti kita tidak wajib
mendefinisikan kelas terlebih dahulu agar dapat menggunakan sebuah objek
(melalui inisiasi / constructor). Jika pada bahasa pemrograman lain (misalnya
:code:`C#`) untuk membuat objek baru kita **harus* terlebih dahulu membuat kelas
dari objek tersebut dan kemudian menggunakannya seperti berikut:
maka pada Javascript kita tidak perlu mendefinisikan kelas terlebih dahulu untuk
membuat objek. Notasi pembuatan objek pada Javascript sangat sederhana:
sepasang kurung kurawal yang membungkus properti. Notasi pembuatan objek ini
dikenal dengan nama object literal. Object literal dapat digunakan kapanpun pada
ekspresi Javascript yang valid:
Nama properti dari sebuah objek harus berupa string, dan boleh berisi string kosong
(""). Jika merupakan nama Javascript yang legal, kita tidak memerleukan petik
ganda pada nama properti. Petik ganda seperti pada contoh ("warna-badan") hanya
diperlukan untuk nama Javascript ilegal atau kata kunci seperti “if” atau “var”.
Misalnya, "nomor-polisi" memerlukan tanda petik, sementara nomor_polisi tidak.
Contoh lain, variasi tidak memerlukan tanda petik, sementara "var" perlu.
18. Web Interaktif Dengan Node.js 18
Sebuah objek dapat menyimpan banyak properti, dan setiap properti dipisahkan
dengan tanda koma (,). Jika ada banyak properti, nilai dari properti pada setiap objek
boleh berbeda-beda. Contoh :
Karena dapat diisikan dengan nilai apapun (termasuk objek), maka kita dapat
membuat objek yang mengandung objek lain (nested object; objek bersarang)
seperti berikut:
Perhatikan dan tandai objek jadwal dan mobil yang baru saja kita buat, karena
bagian selanjutnya dari bab ini akan terus menggunakan kedua objek ini.
Akses Nilai Properti
Akses nilai properti dapat dilakukan dengan dua cara, yaitu:
Penggunaan kurung siku ([]) setelah nama objek. Kurung siku kemudian
diisikan dengan nama properti, yang harus berupa string. Cara ini biasanya
digunakan untuk nama properti yang adalah nama ilegal atau kata kunci
Javascript.
19. Web Interaktif Dengan Node.js 19
Penggunaan tanda titik (.) setelah nama objek diikuti dengan nama properti.
Notasi ini merupakan notasi yang umum digunakan pada bahasa
pemrograman lainnya. Sayangnya kita tidak dapat menggunakan notasi ini
untuk nama ilegal atau kata kunci Javascript.
Contoh penggunaan kedua cara pemanggilan di atas adalah sebagai berikut:
Ingat bahwa meskipun kedua cara di atas dapat digunakan, umumnya kita lebih
banyak menemukan cara kedua pada kode Javascript. Buku ini secara umum juga
akan menggunakan notasi kedua, karena lebih banyak digunakan dan tidak ambigu
dengan akses array.
Sebagai bahasa dinamis, Javascript tidak akan melemparkan pesan kesalahan jika
kita mengakses properti yang tidak ada dalam objek. Kita akan menerima nilai
undefined jika mengakses properti yang tidak ada:
Jika akan menyimpan nilai dalam variabel dan ingin memberikan nilai standar jika
properti tidak ditemukan, kita dapat menggunakan operator ||:
Mengubah Nilai Properti
Di awal bab, kita berkata bahwa objek adalah kumpulan properti yang nilainya dapat
berubah. Cara mengubah nilai properti sama dengan bahasa pemrograman lain
pada umumnya, yaitu dengan menggunakan operator =:
jadwal.platform = 30;
Sifat dinamis Javascript lagi-lagi dapat dilihat ketika kita mencoba mengubah nilai
dari properti yang tidak ada pada objek:
mobil["jumlah-roda"] = 4;
20. Web Interaktif Dengan Node.js 20
mobil.bahan_bakar = "Bensin";
Tidak akan ada pesan kesalahan pada kode di atas, karena Javascript akan
langsung menambahkan kedua properti yang kita ingin ubah tersebut.
Objek mobil sekarang akan menjadi seperti berikut:
Kemudahan untuk menambah (dan mengubah) nilai properti dari objek secara
dinamis ini merupakan salah satu kelebihan utama dari Javascript. Pada bab-bab
selanjutnya kita akan banyak menggunakan teknik ini, baik dalam pemrograman
berorientasi objek maupun fungsional. Pastikan untuk mengerti bagian ini dengan
baik agar dapat dengan mudah mempelajari bab-bab selanjutnya.
Menghapus Properti
Jika sudah tidak ingin menggunakan sebuah properti, kita dapat melakukan
penghapusan terhadap properti tersebut dengan menggunakan operator delete.
Contoh penggunaannya adalah sebagai berikut:
mobil.bahan_bakar // Hasil: "Bensin"
// hapus properti bahan_bakar dari mobil
delete mobil.bahan_bakar
mobil.bahan_bakar // Hasil: undefined
Untuk sekarang, kita belum melihat kegunaan penuh dari fitur penghapusan properti
ini. Kita akan melihat kembali kegunaan dari penghapusan properti setelah
mempelajari bagian selanjutnya, yaitu Prototype.
21. Web Interaktif Dengan Node.js 21
Prototype
Pada bab sebelumnya kita telah beberapa kali mengatakan bagaimana Javascript
menggunakan pendekatan yang berbeda dalam dukungannya terhadap
pemrograman berorientasi objek. Jika bahasa lain pada umumnya
menggunakan class-based OOP, Javascript menggunakan prototype-based OOP.
Kita akan melihat apa maksud dari prototype-based OOP secara sekilas pada
bagian ini. Pembahasan secara mendalam akan dilakukan pada bab selanjutnya,
karena pembahasan protoyped-based OOP tak dapat lepas dari penggunaan fungsi.
PBO lebih banyak berbicara tentang penggunaan kembali kode, yang mana pada
CBO salah satu mekanisme utamanya adalah inheritance. Pada CBO, ketika ingin
menggunakan fitur inheritance biasanya kita harus membuat kelas dan kemudian
melakukan penurunan dari kelas tersebut seperti berikut (contoh dalam bahasa C#):
public class Mobil {
// ..
}
// Truk sebagai turunan dari Mobil
public class Truk: Mobil {
// Truk memiliki semua property dan method dari Mobil.
}
// Penggunaan kelas Truk
var tronton = new Truck();
// Truk juga adalah mobil
Mobil tronton = new Truck();
Pada Javascript yang mengimplementasikan PBO kita tidak lagi perlu menuliskan
kelas, dan langsung melakukan penurunan terhadap objek. Misalkan kita memiliki
objek mobil yang sederhana seperti berikut:
var mobil = {
nama: "Mobil",
jumlahBan: 4
22. Web Interaktif Dengan Node.js 22
};
Kita dapat langsung menurunkan objek tersebut dengan menggunakan
fungsi Object.create seperti berikut:
var truk = Object.create(mobil);
// truk.nama === "Mobil"
// truk.jumlahBan === 4
Pada kasus ini, mobil dikatakan adalah prototype dari truk. Segala nilai atau properti
yang dimiliki oleh mobil secara otomatis akan juga dimiliki oleh truk. Semua objek
yang kita buat dalam Javascript juga secara otomatis merupakan turunan dari
objek Object.prototype, yang merupakan objek bawaan dari Javascript. Hal ini
berarti mobil, dan seluruh turunannya, adalah turunan dari Object.prototype.
Hubungan antara turunan dan orang tua dari objek hanya berlaku untuk
pengambilan nilai. Dalam contoh di atas, perubahan nilai pada properti di truk tidak
akan mengubah nilai dari properti mobil:
truk.nama = "Tronton"; // mobil.nama tetap "Mobil"
truk.jumlahBan = 10; // mobil.jumlahBan tetap 4
Ketika objek turunan memanggil properti yang kosong, maka Javascript secara
otomatis akan mencari nama properti tersebut pada prototype-nya, dan jika masih
tidak ada, properti akan dicari pada prototype dari objek prototype objek. Hal ini akan
terus berlangsung sampai pengecekan dilakukan terhadap Object.prototype.
Jika Object.prototype tidak memiliki properti tersebut juga, maka undefined akan
dikembalikan. Misalnya jika kita memanggil properti yang memang kita tahu tidak
ada pada truk:
truk.berat_maks // undefined
Maka proses pemanggilan yang terjadi sampai kita mendapatkan
nilai undefined adalah sebagai berikut:
1. Cek truk.berat_maks.
a. Karena nilai tidak ada, cek orang tua dari truk.
23. Web Interaktif Dengan Node.js 23
b. Orang tua dari truk adalah mobil.
2. Cek mobil.berat_maks.
a. Karena nilai tidak ada, cek orang tua dari mobil.
b. Orang tua dari mobil adalah Object.prototype.
3. Cek Object.prototype.berat_maks.
a. Karena nilai tidak ada, kembalikan undefined.
Proses penelusuran properti ke atas sampai pada Object.prototype ini dikenal
dengan nama delegasi (delegation). Kita dapat mencoba fitur delegasi ini misalnya
dengan membuang properti dalam truk, dan kemudian mengaksesnya melalui
kembali. Nilai yang diberikan akan menjadi nilai properti tersebut milik mobil:
delete truk.nama;
truk.nama // Hasil: "Mobil"
Pengecekan nilai prototype ini juga bersifat dinamis. Hal ini berarti ketika kita
menambahkan properti baru dalam prototype, seluruh objek turunan prototype
tersebut akan dapat mengakses properti barunya. Contoh:
mobil.berat_maks = 3.0
truk.berat_maks // Hasil: 3.0
Sejauh ini fasilitas penggunaan kembali kode pada PBO yang kita lihat masih belum
terlalu berbeda dengan pada CBO, kecuali di bagian yang sifatnya dinamis. Kita
akan melihat kekuatan yang sebenarnya dari PBO pada bab selanjutnya, setelah
selesai membahas fungsi.
Penelusuran Nilai Properti
Dengan menggunakan perulangan for in kita dapat melakukan penelusuran
terhadap satu per satu properti objek. Penelusuran akan dilakukan terhadap seluruh
nilai milik objek: properti, method (fungsi milik objek), maupun properti hasil
pewarisan (prototype). Langsung saja, lihat contoh berikut:
24. Web Interaktif Dengan Node.js 24
Fitur ini seringkali berguna ketika kita ingin menggabungkan beberapa objek yang
ada secara dinamis. Kegunaan lain lagi misalnya untuk memastikan sebuah properti
ada di dalam objek. Kekurangan dari penelusuran seperti ini adalah jika kita
menelusuri objek turunan, for in akan melakukan penelusuran terhadap properti-
properti milik objek induk juga. Misalnya pada kode di bawah:
25. Web Interaktif Dengan Node.js 25
Dalam kode di atas, dapat dilihat bagaimana jenis dan kain tetap ditelusuri
oleh for in. Jika tidak ingin menelusuri nilai turunan, kita dapat menggunakan
fungsi hasOwnProperty:
Dengan melakukan validasi menggunakan hasOwnProperty terlebih dahulu, kita
dapat menghapus properti yang bukan asli milik objek. Perhatikan juga
bagaimana jenis tetap ditelusuri. Hal ini terjadi karena jenis sudah kita isikan dengan
nilai baru, sehingga jenis dianggap milik kemeja.
Terakhir, jika ingin tidak menelusuri method (detil tentang method dapat dibaca pada
bab selanjutnya), kita dapat menggunakan ekspresi typeof untuk mengecek apakah
sebuah properti fungsi atau bukan:
26. Web Interaktif Dengan Node.js 26
Catatan lain yang juga perlu diingat adalah bahwa penelusuran properti
dengan for in seperti ini tidak memperhatikan urutan penulisan properti pada objek.
Meskipun terdapat beberapa cara untuk menghindari hal ini, kita lebih disarankan
untuk tidak bergantung kepada urutan properti jika ingin melakukan penelusuran.
Penanganan Nilai Global
Pada bab sebelumnya kita telah membahas bahwa salah satu kesalahan desain
yang paling fatal dari Javascript adalah penggunaan nilai global secara standar. Di
bagian ini kita akan mencoba sedikit memperbaiki hal ini, dengan menggunakan
objek.
Penanganan kita lakukan dengan membuat sebuah objek global yang menampung
seluruh kode kita. Objek global ini merupakan objek yang pertama kali kita buat
sebelum aplikasi dijalankan. Objek harus dibuat sebelum kode lain berjalan. Berikut
adalah implementasi paling sederhana dari objek global kita:
27. Web Interaktif Dengan Node.js 27
var MYAPP = MYAPP || {};
Kode yang sangat sederhana. Kita hanya mendeklarasikan sekaligus memanggil
objek global kita, MYAPP, jika MYAPP telah dideklarasikan sebelumnya. Jika belum
dideklarasikan, kita akan membuat sebuah objek kosong. Selanjutnya kita dapat
mengisikan MYAPP dengan kode yang kita inginkan:
Dengan menggunakan cara penulisan kode seperti di atas, kita akan mengurangi
variabel yang ada pada skala global menjadi hanya satu variabel saja, yaitu MYAPP.
Referensi :
- https://bertzzie.com
28. Web Interaktif Dengan Node.js 28
Bab 4
Asinkron I/O & Event
Tidak seperti kebanyakan bahasa backend lainnya operasi fungsi di javascript lebih
bersifat asinkron dan banyak menggunakan event demikian juga dengan Node.js.
Sebelum penjelasan lebih lanjut mari kita lihat terlebih dahulu tentang metode
sinkron seperti yang dipakai pada PHP dengan web server Apache.
PHP & Server HTTP Apache
Mari kita lihat contoh berikut yaitu operasi fungsi akses ke database MySQL oleh
PHP yang dilakukan secara sinkron
$hasil = mysql_query("SELECT * FROM TabelAnggota");
print_r($hasil);
pengambilan data oleh mysql_query() diatas akan dijalankan dan operasi
berikutnya print_r() akan diblok atau tidak akan berjalan sebelum akses ke
database selesai. Yang perlu menjadi perhatian disini yaitu proses Input Output
atau I/O akses ke database oleh mysql_query() dapat memakan waktu yang relatif
mungkin beberapa detik atau menit tergantung dari waktu latensi dari I/O. Waktu
latensi ini tergantung dari banyak hal seperti
Query database lambat akibat banyak pengguna yang mengakses
Kualitas jaringan untuk akses ke database jelek
Proses baca tulis ke disk komputer database yang membutuhkan waktu
Sebelum proses I/O selesai maka selama beberapa detik atau menit tersebut
state dari proses mysql_query() bisa dibilang idle atau tidak melakukan apa-apa.
Lalu jika proses I/O di blok bagaimana jika ada request lagi dari user ? apa yang
akan dilakukan oleh server untuk menangani request ini ?..penyelesaiannya yaitu
dengan memakai pendekatan proses multithread. Melalui pendekatan ini tiap
29. Web Interaktif Dengan Node.js 29
koneksi yang terjadi akan ditangani oleh thread. Thread disini bisa dikatakan
sebagai task yang dijalankan oleh prosesor komputer.
Sepertinya permasalahan I/O yang terblok terselesaikan dengan pendekatan
metode ini tetapi dengan bertambahnya koneksi yang terjadi maka thread akan
semakin banyak sehingga prosesor akan semakin terbebani, belum lagi untuk
switching antar thread menyebabkan konsumsi memory (RAM) komputer yang
cukup besar.
Berikut contoh benchmark antara web server Apache dan Nginx (server HTTP
seperti halnya Apache hanya saja Nginx memakai sistem asinkron I/O dan event
yang mirip Node.js).
Bisa dilihat bahwa Nginx bisa menangani request yang jauh lebih banyak daripada
web server Apache pada jumlah koneksi bersama yang semakin naik.
Javascript & Node.js
Kembali ke Javascript!. Untuk mengetahui apa yang dimaksud dengan
pemrograman asinkron bisa lebih mudah dengan memakai pendekatan contoh
kode. Perhatikan kode Javascript pada Node.js berikut
var fs = require('fs');
fs.readFile('./resource.json', 'utf-8',function(err, data){
if(err) throw err;
console.log(JSON.parse(data));
30. Web Interaktif Dengan Node.js 30
});
console.log('Selanjutnya...');
fungsi readFile() akan membaca membaca isi dari file resource.json secara
asinkron yang artinya proses eksekusi program tidak akan menunggu pembacaan
file resource.json sampai selesai tetapi program akan tetap menjalankan kode
Javascript selanjutnya yaitu console.log('Selanjutnya...'). Sekarng lihat apa yang
terjadi jika kode javascript diatas dijalankan
Jika proses pembacaan file resource.json selesai maka fungsi callback
pada readFile() akan di jalankan dan hasilnya akan ditampilkan pada console.
Yah, fungsi callback merupakan konsep yang penting dalam proses I/O yang
asinkron karena melalui fungsi callback ini data data yang dikembalikan oleh
proses I/O akan di proses.
Lalu bagaimana platform Node.js mengetahui kalau suatu proses itu telah selesai
atau tidak ?...jawabannya adalah Event Loop. Event - event yang terjadi karena
proses asinkron seperti pada fungsi fs.readFile() akan ditangani oleh yang
namanya Event Loop ini.
Campuran teknologi antara event driven dan proses asinkron ini memungkinkan
pembuatan aplikasi dengan penggunaan data secara masif dan real-time. Sifat
komunikasi Node.js I/O yang ringan dan bisa menangani user secara bersamaan
dalam jumlah relatif besar tetapi tetap menjaga state dari koneksi supaya tetap
terbuka dan dengan penggunaan memori yang cukup kecil memungkinkan
pengembangan aplikasi dengan penggunaan data yang besar dan kolaboratif.
Sumber : https://idjs.github.io/belajar-nodejs/
31. Web Interaktif Dengan Node.js 31
Bab 5
Server HTTP Dasar
Server HTTP Dasar
Penggunaan Node.js yang revolusioner yaitu sebagai server. Yup...mungkin kita
terbiasa memakai server seperti Apache - PHP, Nginx - PHP, Java - Tomcat -
Apache atau IIS - ASP.NET sebagai pemroses data di sisi server, tetapi sekarang
semua itu bisa tergantikan dengan memakai JavaScript - Node.js!. Lihat contoh
dasar dari server Node.js berikut (kode sumber pada direktori code pada repositori
ini)
server-http.js
var http = require('http'),
PORT = 3400;
var server = http.createServer(function(req, res){
var body = "<pre>Haruskah belajar Node.js?</pre><p><h3>...Yo
Mesto!</h3></p>"
res.writeHead(200, {
'Content-Length':body.length,
'Content-Type':'text/html',
'Pesan-Header':'Pengenalan Node.js'
});
res.write(body);
res.end();
});
server.listen(PORT);
console.log("Port "+PORT+" : Node.js Server...");
Paket http merupakan paket bawaan dari platform Node.js yang mendukung
penggunaan fitur-fitur protokol HTTP. Object server merupakan object yang di
kembalikan dari fungsi createServer().
32. Web Interaktif Dengan Node.js 32
var server = http.createServer([requestListener])
Tiap request yang terjadi akan ditangani oleh fungsi callback requestListener.
Cara kerja callback ini hampir sama dengan ketika kita menekan tombol button
html yang mempunyai atribut event onclick, jika ditekan maka fungsi yang
teregistrasi oleh event onclick yaitu clickHandler(event) akan dijalankan.
onclick-button.html
<script>
function clickHandler(event){
console.log(event.target.innerHTML+" Terus!");
}
</script>
<button onclick="clickHandler(event)">TEKAN</button>
Sama halnya dengan callback requestListener pada object server ini jika
ada request maka requestListener akan dijalankan
function(req, res){
var body = "<pre>Haruskah belajar Node.js?</pre><p><h3>...Yo
Mesto!</h3></p>"
res.writeHead(200, {
'Content-Length':body.length,
'Content-Type':'text/html',
'Pesan-Header':'Pengenalan Node.js'
});
res.write(body);
res.end();
}
Paket http Node.js memberikan keleluasan bagi developer untuk
membangun server tingkat rendah. Bahkan mudah saja kalau harus men-
setting nilai field header dari HTTP.
Seperti pada contoh diatas agar respon dari request diperlakukan
sebagai HTML oleh browser maka nilai field Content-Type harus
berupa text/html. Setting ini bisa dilakukan melalui
33. Web Interaktif Dengan Node.js 33
metode writeHead(), res.setHeader(field, value) dan beberapa metode
lainnya.
Untuk membaca header bisa dipakai fungsi seperti res.getHeader(field,
value) dan untuk menghapus field header tertentu dengan memakai
fungsi res.removeHeader(field). Perlu diingat bahwa setting header
dilakukan sebelum fungsi res.write() atau res.end() di jalankan karena
jika res.write()dijalankan tetapi kemudian ada perubahan field header
maka perubahan ini akan diabaikan.
Satu hal lagi yaitu tentang kode status dari respon HTTP. Kode status ini
bisa disetting selain 200 (request http sukses), misalnya bila diperlukan
halaman error dengan kode status 404.
Menjalankan Server
Untuk menjalankan server Node.js ketik perintah berikut di terminal
$ node server-http.js
Port 3400 : Node.js Server...
Buka browser (chrome) dan buka url http://localhost:3400 kemudian
ketik CTRL+SHIFT+I untuk membuka Chrome Dev Tool, dengan tool ini bisa
dilihat respon header dari HTTP dimana beberapa fieldnya telah diset
sebelumnya (lingkaran merah pada screenshot dibawah ini).
35. Web Interaktif Dengan Node.js 35
Bab 6
Server File Statis
Aplikasi web memerlukan file - file statis seperti CSS, font dan gambar atau file - file
library JavaScript agar aplikasi web bekerja sebagaimana mestinya. File - file ini
sengaja dipisahkan agar terstruktur dan secara best practices file - file ini memang
harus dipisahkan. Lalu bagaimana caranya Node.js bisa menyediakan file - file ini
?...ok mari kita buat server Node.js yang fungsinya untuk menyediakan file statis.
Agar server Node.js bisa mengirimkan file statis ke klien maka server perlu
mengetahui path atau tempat dimana file tersebut berada.
Node.js bisa mengirimkan file tersebut secara streaming melalui fungsi
fs.createReadStream(). Sebelum dijelaskan lebih lanjut mungkin bisa dilihat atau di
coba saja server file statis.js dibawah ini :
36. Web Interaktif Dengan Node.js 36
Berikut sedikit penjelasan dari kode diatas
__dirname merupakan variabel global yang disediakan oleh Node.js yang
berisi path direktori dari file yang sedang aktif mengeksekusi __dirname.
root merupakan direktori root atau referensi tempat dimana file-file yang
akan dikirimkan oleh server Node.js. Pada kode server diatas direktori root
di setting pada direktori www.
path adalah path file yang bisa didapatkan dengan menggabungkan path
direktori root dan pathname. pathname yang dimaksud di sini misalnya jika
URL yang diminta
yaitu http://localhost:3300/index.html maka pathname adalah /index.html.
Nilai variabel pathdihasilkan dengan memakai fungsi join().
var path = join(root, url.pathname)
stream yang di kembalikan oleh fungsi fs.createReadStream() merupakan
class stream.Readable. Objek stream ini mengeluarkan data secara
streaming untuk di olah lebih lanjut. Perlu menjadi catatan
bahwa stream.Readable tidak akan mengeluarkan data jikalau tidak di
kehendaki. Nah...cara untuk mendeteksi data streaming ini sudah siap di
konsumsi atau belum adalah melalui event.
Event yang di dukung oleh class stream.Readable adalah sebagai berikut
Event: readable
Event: data
Event: end
Event: error
Event: close
37. Web Interaktif Dengan Node.js 37
Bab 7
Pemrosesan Data Form HTML
Aplikasi web memperoleh data dari pengguna umumnya melalui pengisian form
HTML. Contohnya seperti ketika registrasi di media sosial atau aktifitas update
status di Facebook misalnya pasti akan mengisi text field dan kemudian menekan
tombol submit ataupun enter agar data bisa terkirim dan diproses oleh server.
Data yang dikirim oleh form biasanya salah satu dari dua tipe mime berikut
application/x-www-form-urlencoded
multipart/form-data
Node.js sendiri hanya menyediakan parsing data melalui body dari request
sedangkan untuk validasi atau pemrosesan data akan diserahkan kepada
komunitas.
URL Encode
Hanya akan dibahas untuk 2 metode HTTP yaitu GET dan POST saja. Metode GET
untuk menampilkan form html dan POST untuk menangani data form yang dikirim.
Ok langsung kita lihat kode server sederhana untuk parsing data form melalui objek
request dengan data form bertipe application/x-www-form-urlencoded yang
merupakan default dari tag form.
39. Web Interaktif Dengan Node.js 39
Pengujian POST dan GET bisa menggunakan software POSTMAN.
module querystring dari Node.js berfungsi untuk mengubah url encoded string
menjadi objek JavaScript. Contohnya :
querystring.parse('nama=lanadelrey&job=singer&album=borntodie&ultravi
olence');
// returns
{ nama: 'lanadelrey', job: 'singer',album: ['borntodie',
'ultraviolence']}
Sumber :
https://idjs.github.io