Aplikasi Chatting Menggunakan Websocket Pusher

Aplikasi Chatting Menggunakan Websocket Pusher - Aplikasi Chatting adalah suatu teknologi jaringan yang mengijinkan penggunanya mengirimkan pesan secara realtime ke pengguna lain yang tersambung dalam sebuah jaringan LAN atau Local Area Network ataupun internet.

Memasuki era teknologi saat ini, kebutuhan akan fasilitas penyebaran media informasi yang cepat dan mudah semakin meningkat terutama pada aplikasi Android. Seiring dengan berkembangnya teknologi, bentuk dan media untuk berkomunikasi juga mengalami perubahan.

Bentuk komunikasi dimulai dengan komunikasi bertatap muka dan melalui surat. Salah satu fasilitas media komunikasi sekaligus tempat bertukarnya informasi yang paling populer dan paling banyak digunakan masyarakat adalah chat.

Ada banyak protocol yang digunakan dalam membangun aplikasi chatting seperti IRC, MTProto, YMSG dan yang terbaru websocket. Websocket merupakan teknologi terbaru yang ada pada HTML5 untuk mendukung koneksi dua arah antara client dan server secara lebih cepat dan ringan dibandingkan dengan metode HTTP tradisional.

Websocket Pusher

Websocket adalah protokol yang dikembangkan oleh HTML5 yang menerapkan komunikasi full – duplex antara server untuk diterapkan di web browser dan web server. Protokol Websocket dirancang untuk diterapkan di web browser dan web server, tetapi dapat digunakan oleh aplikasi client atau server.

Protokol Websocket sendiri berbasis pada Transfer Control Protocol (TCP). Webscoket digunakan sebagai teknologi realtime pada aplikasi chatting yang akan dibangun dan websocket yang akan digunakan adalah websocket pusher.

Kali ini saya berkeinginan untuk menerapkan teknologi protocol websocket pada aplikasi chatting sehingga diharapkan dapat memberikan kemudahan bagi pengguna (user) dalam berkomunikasi secara real-time.

Alat dan Bahan

Pada tahap ini saya merancang aplikasi chatting ini menggunakan beberapa software dan hardware antara lain :

1. Perangkat Keras (Hardware)

Laptop: Core i3 Processor
Hardisk : 500GB
Ram 4GB

2. Smartphone Android

Android versi 5.0 Lolypop
Octa-core 1.5 GHz CPU
Internal Memory : 8 GB
RAM : 1 GB

3. Perangkat Lunak (Software)

Sistem Operasi Windows 10
Sublime Text 3
XAMPP
Android Studio
Web Browser Google Chrome

Hasil Desain

Adapun hasil dari pengujian yang dilakukan pada “Aplikasi Chatting Berbasis Web Dan Mobile Menggunakan Websocket Pusher” adalah sebagai berikut :

1. Tampilan Halaman Daftar Kontak Mobile

Tampilan sistem untuk menampilkan Halaman Daftar Kontak yang terdapat didalam menu private pada aplikasi chatting web socket pusher, dimana pada halaman ini terdapat beberapa pengguna/kontak yang sudah melakukan pendaftaran pada aplikasi chatting ini. Pada halaman ini pengguna dapat memilih kontak terlebih dahulu sebelum melakukan chat.

2. Tampilan Halaman Private Chat Mobile

Tampilan sistem untuk menampilkan Halaman Private Chat pada aplikasi chatting web socket pusher, dimana pada halaman ini terdapat didalam menu private dan telah melakukan pemilihan pengguna yang akan di chat. Pada halaman ini user atau pengguna dapat menulis pesan yang akan dikirim dengan kontak yang sudah dipilih.

3. Tampilan Halaman Tambah Grup Chat Mobile

Tampilan sistem untuk menampilkan Halaman Tambah Grup Chat pada aplikasi chatting web socket pusher, dimana pada halaman ini terdapat didalam menu Grup. Pada halaman ini user atau pengguna dapat membuat grup chat baru dengan mengisi form nama grup dan deskripsi grup. Pada tampilan halaman tambah grup chat terdapat dua button (tombol) yaitu tombol simpan berfungsi untuk menyimpan grup yang telah dibuat agar terdaftar dan tombol cancel berfungsi untuk membatalkan proses pembuatan tambah grup.

4. Tampilan Halaman Undang Teman Grup Chat Mobile

Tampilan sistem untuk menampilkan Halaman Undang Teman Grup Chat pada aplikasi chatting web socket pusher, fungsinya dimana pada halaman ini terdapat didalam menu grup dan telah melakukan pemilihan grup. Pada halaman ini user atau pengguna dapat mengisikan e-mail teman yang akan ditambahkan ke grup baru. Pada tampilan halaman undang teman grup chat terdapat dua button (tombol) yaitu tombol simpan berfungsi untuk menambahkan teman ke grup chat dan tombol cancel berfungsi untuk membatalkan proses undang teman ke grup.

5. Tampilan Halaman Daftar Grup Chat Mobile

Tampilan sistem untuk menampilkan Halaman Daftar Grup Chat pada aplikasi chatting web socket pusher, fungsinya dimana pada halaman ini terdapat didalam menu Grup. Pada halaman ini pengguna dapat memilih grup terlebih dahulu sebelum melakukan chat dan pengguna juga dapat menambah grup baru dengan memilih tombol tambah grup.

6. Tampilan Halaman Grup Chat Mobile

Tampilan sistem untuk menampilkan Halaman Grup Chat pada aplikasi chatting web socket pusher, fungsinya dimana pada halaman ini terdapat didalam menu Grup dan telah melakukan pemilihan grup yang akan di chat. Pada halaman ini user atau pengguna dapat menulis pesan yang akan dikirim ke grup yang sudah dipilih serta dapat mengundang teman untuk masuk kedalam grup lalu memilih tombol undang dengan memasukkan email teman yang sudah register atau mendaftar.

Fitur

Register
Login
Daftar Grup
Daftar Kontak
Level Akun
Logout

Level Akses

User

Database

Tabel

grups
grup_users
grup_user_chats
messages
migrations
password_resets
status_chats
users
user_chats

Languages

PHP 66.6%
Vue 13.8%
HTML 17.3%
Hack 2.3%

Source Code

Download Aplikasi Chatting Menggunakan Websocket Pusher yang dibuat dengan PHP dan MySQL. Setelah itu jalankan melalui server localhost Anda terlebih dahulu. Jika Anda berminat mendapatkan source code Aplikasi Chatting Menggunakan Websocket Pusher bisa menghubungi melalui halaman kontak.

Demikian artikel yang dapat saya sampaikan semoga dapat membantu dan bermanfaat. jika ada yang ingin sobat tanyakan bisa tulis di kolom komentar. Terimakasih