UNIVERSITAS BINA NUSANTARA
Sekolah Ilmu Komputer Program Teknik Informatika Skripsi Sarjana Komputer Semester Genap 2014/2015 APLIKASI INSTANT MESSAGING MENGGUNAKAN WEBSOCKET DAN NODE.JS PADA JARINGAN WLAN PT INDONESIA COMNETS PLUS Fadli Febriansyah
1401091432
Deka Putra Mahardika
1501142674
Muhamad Nugroho Purnomo
1501143286
Kelas / Kelompok : LA01 / 02
ABSTRAK Tujuan penelitian ini ialah membangun aplikasi instant messaging berbasis web browser menggunakan Node.js pada jaringan WLAN PT Indonesia Comnets Plus. Pembuatan aplikasi instant messaging ini menggunakan metode pengembangan aplikasi waterfall. Metode penelitian yang dilakukan yaitu wawancara dan kuisioner. Wawancara dilakukan untuk melakukan identifikasi masalah sedangkan kuesioner dilakukan untuk mengevaluasi aplikasi. Komunikasi dengan perusahaan dilakukan secara intensif karena penelitian yang dilakukan tidak berakhir ketika aplikasi telah dibangun, namun penelitian dilanjutkan dengan dilakukannya survey kepada para pengguna yang telah menggunakan aplikasi ini dan dilakukan evaluasi dari hasil kuesioner yang telah disebar kepada para pengguna. Hasil yang dicapai dengan dibuatnya aplikasi ini, yaitu diharapkan komunikasi dan pengiriman data soft copy antar end user di jaringan lokal PT Indonesia Comnets Plus lebih efektif, karena seringkali komunikasi dan pengiriman data antar meja end user pada PT Indonesia Comnets Plus mengalami hambatan yang menyebabkan komunikasi antar end user kurang efektif. Kata Kunci: Instant Messaging, Node.js, Websocket, WLAN. i
ABSTRACT The main interest of this research is building an instant messaging application based on web browser using Node.js to WLAN PT Indonesia Comnets Plus network. Creating this instant messaging application is using Waterfall development application method. research method we are using is interview and questionaire, interview used to identify issue whereas using questionaire to evaluate the application. Communication with the company carried out intensively, because the following research doesn’t end when the application was established yet the research continue by doing survey to users whom already using this application and doing evaluation from questionaire results which had distributed to users. By manufacturing this application as our target result, communication and sending softcopy data between end user in PT Indonesia Comnets Plus local network runs more effective, since communication and data transfer between end user in PT Indonesia Comnets Plus come into obstacle softenly, causing communication between end user runs less effective.
ii
PRAKATA
Puji dan syukur penulis panjatkan kehadirat Tuhan Yang Maha Esa karena berkat, rahmat, dan karunia-Nya serta seluruh kemampuan yang telah diberikan kepada penulis sehingga dapat menyelesaikan penyusunan skripsi dengan judul “APLIKASI INSTANT MESSAGING MENGGUNAKAN WEBSOCKET DAN NODE.JS PADA JARINGAN WLAN PT. INDONESIA COMNETS PLUS”. Tujuan ini dibuat sebagai salah satu syarat dalam menyelesaikan jenjang studi Strata1 di Bina Nusantara University, Jakarta. Dalam menyelesaikan skripsi
ini penulis telah menerima begitu banyak
bantuan baik itu berupa kritik, saran dan dorongan serta bimbingan dan berbagai pihak secara langsung maupun tidak langsung. Oleh karena itu, melalui kesempatan ini penulis ingin menyampaikan terima kasih kepada : 1. Bapak Prof. Dr. Ir. Harjanto Prabowo, M.M., selaku Rektor Universitas Bina Nusantara. 2. Bapak Fredy Purnomo, S.Kom, M.Kom., selaku Dean of School of Computer Science Universitas Bina Nusantara. 3. Ibu Yen Lina Prasetio,S.Kom., McompSc., selaku Head of Computer Science School Program Universitas Bina Nusantara. 4. Ibu Meiliana, S.Kom., M.Sc., selaku Deputy Head of Computer Science School – Academic & Operation dan Deputy Head of Computer Science School – Student & Alumni Universitas Bina Nusantara. 5. Bapak Rudi Tjiptadi, M.Eng., selaku dosen pembimbing yang telah memberikan bimbingan, saran dan pengarahan kepada penulis dalam penyusunan skripsi ini. 6. Bapak Purnamajati, Manager SDM PT Indonesia Comnets Plus yang telah membantu memberikan izin dalam pengambilan data perusahaan. 7. Bapak Bayu Sukmanto, selaku kepala Divisi SIK PT Indonesia Comnets Plus yang telah memberikan bimbingan dalam pembuatan aplikasi. 8. Segenap staff pengajar Binus University yang telah memberikan pengajaran dan bimbingan kepada penulis sejak awal perkuliahan. iii
9. Segenap staff dan karyawan PT Indonesia Comnets Plus yang telah membantu dalam partisipasi pengumpulan data. 10. Orang Tua dan keluarga yang telah banyak memberikan dukungan, bantuan, dan doa kepada penulis baik dalam bentuk moral maupun materil. 11. Sahabat-sahabat yang telah memberikan dukungan, doa, dorongan, bantuan, serta semangat dalam menyelesaikan penulisan skripsi ini.
Akhir kata dengan segala keterbatasan dan kekurangan yang dimiliki oleh penulis, penulis mengucapkan terima kasih dan mengharapkan semoga skripsi ini bisa bermanfaat bagi pihak yang membutuhkannya.
Jakarta, Juni 2015
Fadli Febriansyah 1401091432
Deka Putra Mahardika 1501142674
iv
Muhamad Nugroho Purnomo 1501143286
DAFTAR ISI
Abstrak ..............................................................................................................i Prakata...............................................................................................................iv Daftar Isi............................................................................................................vi Daftar Gambar ...................................................................................................ix Daftar Tabel .......................................................................................................xi Daftar Lampiran ................................................................................................xi BAB 1 PENDAHULUAN 1.1 Latar Belakang .............................................................................................1 1.2 Rumusan Masalah .......................................................................................2 1.3 Ruang Lingkup ............................................................................................2 1.4 Tujuan dan Manfaat .....................................................................................3 1.5 Metode Penelitian..........................................................................................3 1.6 Sistematika Penulisan ..................................................................................4 BAB 2 TINJAUAN PUSTAKA 2.1 Teori Umum ................................................................................................6 2.1.1 Jaringan Komputer ..............................................................................6 2.1.2 Jenis-Jenis Network .............................................................................6 1 Pengertian Local Area Network ...........................................................6 2 Pengertian Metropolitan Area Network................................................7 3 Pengertian Wide Area Network ............................................................7 2.1.3 Media Transimisi Data ........................................................................8 a. Media Tembaga ..................................................................................8 1 Twisted Pair ..................................................................................8 2 Coaxial ..........................................................................................9 3 Serat Optik ....................................................................................10 2.1.4 Perangkat Jaringan Komputer ..............................................................10 1 Ethernet Card......................................................................................10 2 Hub dan Switch ...................................................................................12 3 Repeater ..............................................................................................12 4 Router .................................................................................................12 5 Modem ................................................................................................13 v
6 Access Point ........................................................................................13 2.1.5 Kriptografi ..........................................................................................14 2.1.6 Sejarah Kriptografi ..............................................................................15 2.1.7 Tujuan Kroptografi ..............................................................................16 1 Confidentiality .....................................................................................16 2 Integrity...............................................................................................16 3 Avaliability ..........................................................................................16 4 Authentication .....................................................................................16 5 Access Control ....................................................................................17 2.1.8 Waterfall Model ..................................................................................17 2.1.9 Server ..................................................................................................19 2.1.10 Web Browxer .....................................................................................19 2.1.10 Web Development ..............................................................................20 1 HTML .................................................................................................20 2 CSS .....................................................................................................21 3 Javascript ............................................................................................22 2.1.12 Instant Messaging..............................................................................23 2.2 Teori Khusus................................................................................................24 2.2.1 Node.js ................................................................................................24 2.2.2 Node Packet Manager .........................................................................25 2.2.3 Express.js ............................................................................................25 2.2.4 Operasi I/O ..........................................................................................26 2.2.5 SynchronousI/O ...................................................................................27 2.2.6 AsynchronousI/O .................................................................................27 2.2.7 Websocket ...........................................................................................27 2.2.8 Socket.io .............................................................................................29 2.2.9 Hypertext Transfer Protocol (HTTP) ...................................................29 2.3 Hasil Penelitian Sebelumnya ........................................................................30 BAB 3 METODOLOGI 3.1 Metodologi ..................................................................................................33 3.2 Analisis ........................................................................................................34 3.2.1 Analisis Sistem yang Berjalan .......................................................34 3.2.1.1 Sejarah Perusahaan..........................................................34 vi
3.2.1.2 Sekilas Tentang ICON+ ..................................................35 3.2.1.3 Topologi Jaringan ICON+ ...............................................36 3.2.1.4 Struktur Organisasi ICON+ .............................................36 3.2.2 Analisis Permasalahan atau Kebutuhan ..........................................37 3.2.3 Usulan Pemecahan Masalah...........................................................39 3.3 Perancangan .................................................................................................42 3.3.1 Use Case Diagram ........................................................................42 3.3.2 Activity Diagram ...........................................................................43 3.3.3 Deskripsi Aplikasi .........................................................................48 3.3.4 Fitur-fitur Aplikasi.........................................................................49 3.3.5 Kebutuhan Teknologi ....................................................................50 BAB 4 HASIL DAN PEMBAHASAN 4.1 Spesifikasi Sistem ........................................................................................52 4.1.1 Kebutuhan Perangkat Keras ...........................................................52 4.1.2 Kebutuhan Perangkat Lunak ..........................................................53 4.2 Prosedur Instalasi Aplikasi ...........................................................................53 4.3 Prosedur Penggunaan Aplikasi .....................................................................62 4.3.1 Prosedur penggunaan pada server ..................................................62 4.3.2 Prosedur penggunaan pada client ...................................................64 4.4 Evaluasi .......................................................................................................68 4.4.1 Evaluasi Antar Muka Pengguna .....................................................68 4.4.1.1 Lima Faktor Manusia Terukur .........................................68 4.4.1.2 Delapan Aturan Emas......................................................69 4.4.2 Evaluasi Teknikal ..........................................................................72 4.4.3 Evaluasi Perngguna .......................................................................74 BAB 5 SIMPULAN DAN SARAN 5.1 Simpulan ......................................................................................................83 5.2 Saran............................................................................................................83 DAFTAR PUSTAKA ....................................................................................... LAMPIRAN-LAMPIRAN...............................................................................L1 RIWAYAT HIDUP SURAT SURVEY
vii
DAFTAR TABEL
Tabel 2.1 Perbandingan HTTP dengan Websocket .............................................32 Tabel 4.1 CPU Usage Aplikasi Instant Messaging pada saat idle .......................73 Tabel 4.2 CPU Usage Aplikasi Instant Messaging pada saat server berjalan ......73
DAFTAR GAMBAR
Gambar 2.1 Local Area Network ........................................................................7 Gambar 2.2 Metropolitan Area Network ............................................................7 Gambar 2.3 Wide Area Network .........................................................................8 Gambar 2.4 UTP dan STP ..................................................................................9 Gambar 2.5 Coaxial ...........................................................................................9 Gambar 2.6 Serat Optik .....................................................................................10 Gambar 2.7 Ethernet Card .................................................................................11 Gambar 2.8 Switch .............................................................................................11 Gambar 2.9 Reapeater .......................................................................................12 Gambar 2.10 Router ...........................................................................................13 Gambar 2.11 Modem..........................................................................................13 Gambar 2.12 Proses Enkripsi dan Dekripsi ........................................................14 Gambar 2.13 Tulisan Hieroglyph .......................................................................15 Gambar 2.14 Proses Pengembangan Perangkat Lunak Waterfall ........................17 Gambar 2.15 Proses Synchronous dan Asynchronous I/O ...................................26 Gambar 2.16 Polling send http request...............................................................27 Gambar 2.17 Polling vs Websocket ....................................................................28 Gambar 2.18 Representasi Visual Socket.io .......................................................29 Gambar 2.19 Websocket Protocol ......................................................................31 Gambar 3.1 Metodologi .....................................................................................33 Gambar 3.2 Topologi Jaringan ICON+ ..............................................................36 Gambar 3.3 Struktur Organisasi ICON+.............................................................36 viii
Gambar 3.4 Rancangan Layar Halaman Index ...................................................39 Gambar 3.5 Rancangan Layar Halaman Utama ..................................................40 Gambar 3.6 Rancangan Fitur Time Stamp ..........................................................40 Gambar 3.7 Rancangan Fitur Emoticon ..............................................................41 Gambar 3.8 Rancangan Fitur Notifikasi Pesan ...................................................41 Gambar 3.9 Use Case Diagram..........................................................................42 Gambar 3.10 Do Login ......................................................................................43 Gambar 3.11 Join Room.....................................................................................44 Gambar 3.12 Leave Room ..................................................................................45 Gambar 3.13 Chat ..............................................................................................46 Gambar 3.14 File Sharing ..................................................................................47 Gambar 3.15 Do Logout.....................................................................................48 Gambar 4.1 Halaman Download Node.js ...........................................................54 Gambar 4.2 Halaman Awal Instalasi Node.js .....................................................54 Gambar 4.3 Halaman Persutujuan Node.js .........................................................55 Gambar 4.4 Halaman Penentuan Direktori .........................................................55 Gambar 4.5 Halaman Penentuan Komponen Node.js .........................................56 Gambar 4.6 Halaman Sebelum Install Node.js ...................................................56 Gambar 4.7 Proses Instalasi Node.js ..................................................................57 Gambar 4.8 Halaman Selesai Instalasi Node.js ...................................................57 Gambar 4.9 Halaman Download Pada Website XAMPP ....................................58 Gambar 4.10 Halaman Pemilihan Bahasa...........................................................58 Gambar 4.11 Halaman Peringatan UAC .............................................................59 Gambar 4.12 Halaman Instalasi Awal XAMPP ..................................................59 Gambar 4.13 Halaman Penentuan Direktori XAMPP .........................................60 Gambar 4.14 Halaman Penentuan Service XAMPP ............................................60 Gambar 4.15 Proses Instalasi XAMPP ...............................................................61 Gambar 4.16 Halaman Selesai Instalasi XAMPP ...............................................61 Gambar 4.17 Direktori Aplikasi Server ..............................................................62 Gambar 4.18 Konfigurasi Direktori Server .........................................................62 Gambar 4.19 Konfigurasi Server ........................................................................63 Gambar 4.20 Konfigurasi Server Selesai ............................................................63 Gambar 4.21 Tampilan Halaman Index ..............................................................64 ix
Gambar 4.22 Tampilan Halaman Utama ............................................................64 Gambar 4.23 Tampilan Private Chat ..................................................................65 Gambar 4.24 Tampilan Fitur Emoticon ..............................................................66 Gambar 4.25 Tampilan Upload File ...................................................................66 Gambar 4.26 Hasil Upload File Yang Tersimpan ...............................................67 Gambar 4.27 Tampilan Download File ..............................................................68 Gambar 4.28 Contoh Peletakan Tombol .............................................................68 Gambar 4.29 Informasi Selected File Pada Search Box ......................................70 Gambar 4.30 Dialog Penutupan Upload .............................................................70 Gambar 4.31 Dialog Pesan Kesalahan ................................................................71 Gambar 4.32 Pengguna Meninggalkan Chat ......................................................72 Gambar 4.33 Screenshot Proses Chat .................................................................73 Gambar 4.34 Screenshot Proses Upload File .....................................................73 Gambar 4.35 Screenshot Proses Mengirim Fitur Emoticon .................................74 Gambar 4.36 Diagram Pie Kuesioner Pertanyaan Ke-1 ......................................75 Gambar 4.37 Diagram Pie Kuesioner Pertanyaan Ke-2 ......................................75 Gambar 4.38 Diagram Pie Kuesioner Pertanyaan Ke-3 ......................................76 Gambar 4.39 Diagram Pie Kuesioner Pertanyaan Ke-4 ......................................77 Gambar 4.40 Diagram Pie Kuesioner Pertanyaan Ke-5 ......................................77 Gambar 4.41 Diagram Pie Kuesioner Pertanyaan Ke-6 ......................................78 Gambar 4.42 Diagram Pie Kuesioner Pertanyaan Ke-7 ......................................79 Gambar 4.43 Diagram Pie Kuesioner Pertanyaan Ke-8 ......................................79 Gambar 4.44 Diagram Pie Kuesioner Pertanyaan Ke-9 ......................................80 Gambar 4.45 Diagram Pie Kuesioner Pertanyaan Ke-10 ....................................81 Gambar 4.46 Diagram Pie Kuesioner Pertanyaan Ke-11 ....................................82
x
DAFTAR LAMPIRAN
Hasil Wawancara ...............................................................................................L1 Resepsionis Kantor ............................................................................................L2 Narasumber Wawancara ....................................................................................L3 Ruangan Tempat Implementasi ICON Chat .......................................................L4 Ruangan Meeting PT Indonesia Comnets Plus ...................................................L5 Uji Coba Aplikasi ICON Chat............................................................................L6
xi
