loading...

Cara Membuat System Aplikasi Antrian versi berga dengan suara berbasis web Gratis Source Code + Script

Cara Pembuatan Aplikasi Manajemen Antrian  (AMA)


Aplikasi ini kami dapatkan dari https://pusatbimbinganskripsi.wordpress.com/ kamu bisa mengeditnya dan modifikasi aplikasi ini memang diterapkan di kantor-kantor layanan publik, seperti Kantor pembiayaan, Bank, Kantor Pos, pelayanan pajak, Puskesmas dan lain-lain, yang membutuhkan banyak antrian agar dapat tertata dengan rapi dan terkontrol.

aplikasi ini tidak hanya dapat menampilkan nomor antrian dengan suara panggilan, namun juga dapat menampilkan informasi dan gambar secara terpadu.

Untuk back end/Panel (admin)


Sebelum kita membuat aplikasi untuk front end, terlebih dulu kita buat bagian back end dari aplikasi. Aplikasi back end adalah halaman yang diakses oleh admin yaitu di: localhost/ama/panel.



Cara pembuatan backend (panel) adalah dengan teknik CRUD (Create, Read Update dan Delate), baca teknik CRUD di file terpisah. Namun  disini saya jelaskan cara membuat editor tiny MCPUK yang berguna untuk melakukan penambahan konten informasi bentuk HTML tanpa perlu menghapal kode langsung HTML degenerate.

Download file tinymcpuk, copy kan ke root selanjutnya membuat form tambah informasi di tambahinfo.php, kemudian tambahkan kode Javascript pada bagian tag <head> untuk menampilkan editor tinyMCPUK, berikut script nya:

Cara Membuat System Aplikasi Antrian versi berga dengan suara berbasis web Gratis Source Code + Script


Editor tinyMCPUK juga diterapkan pada form-form lainnya, seperti ubahinfo.php, tambahticker.php dan ubahticker.php.

Pembuatan Front End

Aplikasi Manajemen Antrian Berbasis Web

Setelah membuat aplikasi untuk backend, maka selanjutnya membuat aplikasi untuk front end. Caranya adalah membuat dulu tampilan (layout) front end dengan dreamweaver, notepad atau editor html lainnya untuk merancang tata letak tampilan pada front end, kemudian simpan ke dalam file index.php.

Skrip index.php :

Apabila anda perhatikan penamaan id pada skrip index.php, setiap bagiannya (div) akan mengacu pada layout yang telah dirancang. Seperti biasa setelah membuat pondasi atau tampilan yang akan dibangun, selanjutnya untuk memperindah dan mempercantik tampilan dan pemformatan lebih mudah, maka kita bisa menggunakan file css baru dengan nama file style.css

Skrip style.css :

Selanjutnya gunakan plug-in untuk menampilkan jam analog di sebelah kiri atas halaman. Untuk itu download file plug-in moreskin.js dan coolclock.js ke dalam root, lalu tambahkan kode pada bagian tag <head> di skrip index.php berikut:

Selanjutnya masih di skrip index.php, tambahkan kode berikut di dalam tag div dengan id=”jam”, berikut :

Maka, setelah dijalankan melalui browser, di localhost/ama, maka hasilnya akan terlihat berikut :

Sedangkan nomor dan suara antrian dapat  disisipkan di bagian tag <body> masih di skrip index.php, dengan skrip HTML 5 berikut  ini :

Dan untuk menampilkan nomor panggilan dan tombol panggil, sisipkan file css, pada <div class=”kontainer”> dan <div class=”kontainer2”> , seperti skrip index.php berikut:

Setelah dijalankan di browser akan tampak berikut.

Untuk menampilkan informasi data dari tabel informasi yang akan ditampilkan dalam beberapa waktu dan mengambil informasi setiap beberapa detik sekali menggunakan jQuery, ini diatur di file response.php.

Skrip response.php

Maka setelah dijalankan di browser, akan menampilkan informasi secara bergantian (refresh) secara otomatis pada isi (div badan) dalam interval waktu tertentu, sesuai dengan “lama”/durasi waktunya. Jika “lama” diisi =5000, maka waktu lama durasinya = 5 detik.

Ticker

Pada bagian akhir adalah membuat bagian ticker, yaitu informasi teks berjalan di bagian bawah halaman web (footer), yaitu dengan menambahkan kode berikut di bagian tag div “ticker” di skrip index.php,

DEMO VIDEO


Program bisa dicustom sesuai dengan kebutuhan anda
Link Scipt Program + Database

2 Responses to "Cara Membuat System Aplikasi Antrian versi berga dengan suara berbasis web Gratis Source Code + Script "

Kunjungi Fasnpage Kami