Senin, 17 April 2017

Membuat Web Server Menggunakan XAMPP Dengan PHP Dan SMS Gateway.


Website dimasa sekarang ini bukan hal yang awam bagi setiap orang. Sebuah sarana online yang terdiri dari sebuah Domain (nama atau tanda pengenal untuk sebuah situs atau website ".com, .net, .org, .info dll") dan Hosting (Media penyimpanan yang bisa di akses dari penjuru dunia baik yang berbayar atau gratis). Jika anda adalah orang yang sedang tertarik untuk membuat website, tutorial ini bisa membantu anda dalam memahami dan mengerti tentang tatacara pembuatan website dengan menggunakan komputer pribadi (PC). Cara ini bisa juga digunakan untuk para netter untuk membuat website "prelaunching" sebelum website sesungguhnya di onlinekan secara keseluruhan di dunia maya.

Dalam kesempatan ini saya ingin mengajak anda untuk bisa mempraktekkan membuat sebuah webserver yang biasa di kenal dengan sebutan HTTPD [Hypertext Transfer Protocol Deamon] atau HTTP server. HTTP server adalah sebuah service yang bekerja untuk melayani request (permntaan) dari HTTP client (web browser) ke computer server. Tujuan akhir dari tutorial ini adalah agar anda bisa menggunakan webserver anda untuk keperluan pembuatan website, baik yang berbasis database (menggunakan mysql) atau nondatabase (berupa web statis "biasanya hanya menggunakan html saja").


Untuk menjadikan komputer kita menjadi sebuah webserver tidak perlu spesifikasi komputer yang supercanggih atau cepat, tetapi adakalanya di butuhkan guna mempepercepat aplikasi yang kita gunakan. Untuk memulai menjadikan komputer pribadi kita menjadi sebuah webserver kita bisa menggunakan software free (software gratis) berupa :- Appserv (AppservNetwork) bisa anda Download di situsnya : http://www.appservnetwork.com- XAMPP Bisa anda download di situsnya : http://www.apachefriends.org/en/xampp.html
Kedua software ini sama, fungsinya adalah untuk bisa menjadikan komputer pribadi kita menjadi Web Server yang nantinya kita gunakan untuk hosting berbasis Apache yang digunakan untuk menampilkan website di localhost. PHP ( PHP adalah bahasa pemrograman berupa script (text) yang dijalankan pada server side. Artinya semua sintaks (perintah) yang kita berikan akan sepenuhnya dijalankan oleh server sedangkan yang dikirimkan ke browser hanya hasildari pemrosesan di server ) dan MySQL (adalah database "bankdata" yang sering digunakan dalam kombinasi sistem yang menggunakan interface PHP) dapat bekerja sama dengan banyak web server. Salah satu web server yang dikenal dan sudah terbukti ketangguhan serta konektifitasnya dengan PHP dan MySQL, adalah Apache. Anda bisa menginstall web yang berbasis CMS (Conten Management System) seperti Wordpress, Joomla, Drupal dll yang databasenya menggunakan Mysql. Apabila Software ini d install d computer anda, maka anda sudah bisa online menggunakan browser anda (IE, Firefox, Google Chrome, Opera dll) tetap secara local atau Localhost. untuk memastikan programnya berjalan anda bisa memanggilnya di browser anda dengan menuliskan "localhost" . jika sudah benar maka di browser akan mnampilkan informasi dari Fasilitas yang ada pada komputer anda mengenai software ini.

Pada kesematan ini saya akan membuat web server yang isinya berupa sebuah web absensi siswa menggunakan bahasa svript php dan fitur SMS Gateway. Berikut langkah-langkahnya.

1. Perangkat Yang Dibutuhkan
Pada pembahasan ini mencoba menguji aplikasi absensi sebelum di implementasikan ke instansi sekolah. Dibutuhkan perangkat keras maupun perangkat lunak tertentu agar aplikasi bisa berjalan dengan baik dan sesuai harapan. Berikut kebutuhan aplisaki absensi terdiri dari: 

1.1 Kebutuhan Perangkat Keras
Perangkat keras yang diuji cobakan dalam sistem absensi real-time ini sebagai berikut:
1.      Modem
Modem dalam hal ini digunakan untuk menghubungkan aplikasi dengan SMS Gateway yang nantinya lewat modem inilah aplikasi absensi realtime akan mengirimkan SMS ke HP orang tua siswa. Adapun modem yang gunakan sebagai berikut :
a.   ZTE MF180AUSB Modem
Bentuk fisik dapat dilihat pada gambar 3.23.
NB : Bisa juga menggunakan modem merek lain.
b.   Operator mobile (SIM Card)
Penggunaan operator mobile bisa menggunakan bermacam-macam SIM Card, saya sarankan menggunakan SIM Card Simpati, XL, atau IM3. Dikarenakan saya menggunakan jenis SIM Card tersebut untuk uji coba aplikasi absensi real-time ini.
2.      Spesifikasi Laptop/Komputer
Adapun spesifikasi komputer atau laptop. Disini saya menggunakan laptop untuk uji coba aplikasi ini, berikut spesifikasinya :
·         Tipe              : Asus A43S.
·         Prosesor        : Intel(R) Core(TM) i7-2570QM CPU @ 2.20 GHz (8 CPUs).
·         VGA             : NVIDIA GeForce GT630M.
·         Memori         : 8 GB.
·         Hardisk         : 240 GB SSD.

          1.2 Kebutuhan Perangkat Lunak
Adapun perangkat lunak yang bertujuan untuk mengendalikan dan mengkoordinasi kegiatan dari sistem komputer. Perangkat lunak yang diguakan dalam pembuatan sistem ini antara lain :
1.            Sistem Operasi Windows 10 64 Bit.
2.            Web Browser Google Chrome
3.            Xampp Versi 1.7.1
4.            Gammu

          1.3 Konfigurasi SMS Gateway
Langkah pertama untuk menjalankan aplikasi absensi ini yaitu dengan memastikan bahwa fitur SMS Gateway sudah berjalan dengan baik. Untuk SMS Gateway ini menggunakan library Gammu. Berikut ini langkah-langkah untuk pengkonfigurasikan Gammu adalah sebagai berikut :
1.     Pastikan modem untuk SMS Gateway sudah terkoneksi atau terhubung dengan PC/Laptop dan sudah ter-install driver. Modem yang bisa digunakan adalah modem yang terdapat fitur pengiriman SMS. Adapun modem yang bisa digunakan untuk SMS Gateway seperti HUWAEI, ZTE Wavecom. Disini sayamenggunakan modem telkomsel dari ZTE.
2.     Kemudian import database gammu kedalam database PHPMyAdmin dengan cara pilih database gammu di folder htdocs\smsku\share\doc\gammu\examples\sql. Pilih file mysql.sql. dan pastikan import database-nya berhasil dengan terlihat tabel-tabel yang berada di bawah database gammu dibagian kiri halaman. 

3.     Setelah itu hubungkan modem ke PC/Laptop. Disini saya menggunakan modem Telkomsel jika lampu modem sudah berwarna kuning maka modem sudah siap dipakai. 

4.     Selanjutnya buka Device Manager di windows untuk memastikan port COM pada modem yang akan digunakan. Disini menggunakan COM4. 
5.    Selanjutnya edit file gammurc yang berada di folder htdocs\smsku\bin. Edit file tersebut menggunakan notepad atau text editor lainya, sesuaikan port COM yang digunakan pada modem. Disini menggunakan COM4.
device = com4:
connection = at
untuk lebih jelasnya lihat pada Gambar dibawah ini.
6.    Kemudian edit juga file smsdrc yang berada di folder htdocs\smsku\bin. Sesuaikan dengan settingan berikut :
·         Pada baris ke - 7 :
Device = com4 :
·         Pada baris ke – 9 :
Connection = at :
7.        Kemudian langkah selanjutnya menjalankan perintah gammu melalui command prompt apakah modem sudah terhubung dengan gammu atau tidak dengan memperlihatkan identifikasi modem yang terhubung, dengan cara buka folder C:\xampp\htdocs\smsku\bin. Kemudian tahan shift + klik kanan pada mouse dan pilih open comand promt here. Lalu ketik perintah gammu –identify
8.         Setelah modem teridentifikasi selanjutnya kita install service GammuSMSD dengan menjalankan perintah gammu-smsd –c smsdrc –i. Jika berhasil maka akan bemberikan informasi “Service GammuSMSD installed sucessfully”. Disini sudah teri-nstall service GammuSMSD sehingga tidak memberikan informasi setelah melakukan perintah install.  
9.       Selanjutnya langkah terakhir adalah mengaktifkan Gammu service pada windows dengan cara, klik tombol start lalu ketikkan service.msc dan tekan tombol enter di keyboard. Maka akan tampil daftar service di windows. Kemudian klik link “Start the service” untuk GammuSMSD Service
10.       Service pada Gammu sudah berjalan dan SMS Gateway siap untuk digunakan.

           1.4   Konfigurasi Kebutuhan Sistem
Langkah pertama adalah install terlebih dahulu XAMPP. untuk lfile bisa diunduk di sini. setelah terinstal di komputer kita selanjutnya yaitu mengaktifkan service XAMPP partikan instalasi berjalan dengan baik di komputer ataupun laptop. Untuk mengecek apakah service XAMPP sudah aktif atau belum dengan cara mengklik tombol Start-Allprograms-Apache Friends-XAMPP-XAMPP Control Panel, pastikan pada bagian Apache dan MySQL dalam keadaan Running dan Modules Scv tercentang keduanya. 

Kemudian letakan folder projek absensi real-time (smsku) ke web server Apache. Jika sudah di-install Apache, maka secara otomatis folder dengan nama htdocs akan terbuat. Copy-kan folder smsku tersebut kedalam htdocs.

2.  Implementasi Dan Uji Coba
Pada pembahasan ini penulis akan menjelaskan bagaimana urutan atau alur program saaat pertama kali digunakan. Berikut ini tahap yang harus dilakukan sebagai berikut :
3.         2.1   Login dengan Komputer Sever
Memulai aplikasi dengan cara membuka browser kemudian ketik http://localhost/smsku. Maka akan tampil halaman form login, isikan Username dan Password-nya adalah “admin”. Setelah itu klik login.  Pertama kali yang akan menggunakan aplikasi ini adalah Administrator atau admin sekolah. Karena user tersebut diberi wewenang untuk mengelola data user lain, dalam hal ini adalah Guru dan Siswa. Apabila login sukses maka akan tampil halaman utama sebagai Administrator pada aplikasi absensi seperti pada Gambar dibawah ini.

Pada gambar 3.39 dan 3.40 merupakan tampilan login dengan home sebagai admin. Terdapat menu dibagian kiri yang berfungsi untuk mengelola atau memanipulasi data guru, siswa, kelas dan sekolah.

1.2   Login Dengan Komputer Client/Siswa
Jika kita sebagai client atau ingin login dengan komputer selain server maka yang harus kita lakukan adalah melihat ip pada komputer server. caranya buka CMD (Comand Promt) pada komputer server, kemudian keti "ipconfig"

Bisa dilihat bahwa ip server adalah 192.168.58.1 kemudian langkah selanjutnya adalah buka browser pada komputer client kemudian agar kita bisa membuka aplikasi absensi di komputer server maka caranya dalah "ip_server/folder_aplikasi". jadi untuk implementasinya adlah ketik pada url "192.168.58.1/smsku". 

1.2   Input Absensi Siswa
Untuk melakukan absensi terlebih dahulu harus login sebagai  guru yang akan mengabsensi siswanya sesuai dengan kelas yang diajarkanya. Dalam hal ini baik guru maupun siswa yang dijadikan sebagai contoh adalah guru dan siswa. dibawah ini login sebagai guru yang akan mengabsen siswa. 
Data login tersebut adalah NIP dan password sesuai dengan yang telah diinputkan sebelumnya pada diatas (user sebagai guru). Disini penulis menggunakan password kosong untuk mempermudah pengujian. Apabila NIP dan password sudah sesuai, maka akan masuk ke halaman guru. 
Pada Gambar diatas terdapat 2 menu utama, yaitu:
a.             Data Absensi digunakan untuk absen siswa yang diajarkan.
b.            Data Guru digunakan untuk melihat profil guru yang bersangkutan.
Pertama kali yang ditampilkan sebelum mengabsensi siswa adalah menampilkan Kelas Dan Tanggal Absensi (waktu sekarang pada saat absensi berlangsung). Lihat Gambar dibawah.
Apabila sudah sesuai dengan Kelas dan Tanggal, selanjutnya bisa simpan dengan cara klik Submit Button, maka akan tampil data siswa yang diajar oleh guru tersebut.

Pada kolom paling kanan (Keterangan) terdapat pilihan kode absensi, intinya jika siswa yang bersangkutan tidak masuk tanpa keterangan, maka akan dipilih kode A kemudian sistem akan mengirimkan pesan ke Nomor Telepon orang tua siswa tersebut yang tidak masuk sesuai dengan nomor orang tua siswa yang sudah dimasukkan kedalam sistem. Jika dia masuk maka akan dipilih kode M gampar diatas. Kemudian jika sudah selesai melakukan absensi, maka guru bisa menekan tombol Simpan Data, selanjutnya akan tampil alert atau informasi seperti pada Gambar dibawah.
Alert/Informasi tersebut digunakan untuk memberitahukan bahwa data absensi sudah masuk dan tersimpan kedalam database sistem. Maka secara otomatis sistem absensi real-time ini akan mengirimkan informasi ke HP orang tua siswa secara langsung.Lihat Gambar dibawah ini.
Dengan catatan jika jaringan BTS (Base Transceiver Station) atau jaringan telekomunikasi tidak ada gangguan. Sekian tutorial saya membuat web server dan SMS Gatewaynya. Untuk yang berminat mencoba aplikasi (file smsku) absensi siswa bisa hub saya via email :royabryanto@yahoo.com. 


Sumber : Roy Abryanto, royabryanto@yahoo.com/djemonicraiyo@gmail.com