Artikel kali ini membahas tentang tutorial dalam memasukkan data yang diambil dari MySQL dengan PHP di dalam Kodular. Ada kemungkinan kamu belum mengetahui cara memasukkan data yang diambil dari MySQL ke dalam Spinner pada aplikasi Android melalui bantuan PHP (backend) dan JSON (penampilan data seperti REST API) di dalam Kodular.
Tutorial kali ini ada beberapa step by step dalam memasukkan data yang diambil dari beberapa field atau kolom pada MySQL seperti Kode Mata Kuliah, NISN, Kode Akun, dan sebagainya dengan bantuan PHP dan JSON di Kodular. Untuk server, penulis menggunakan server lokal dari XAMPP. Apabila kamu masih belum bisa atau terbiasa menggunakan XAMPP, bisa menggunakan hosting gratis (untuk no budget) atau hosting biasa / VPS.
MEMBUAT DATABASE, TABEL, dan ISI DATA
Pada poin ini, penulis akan memberikan database, tabel, beserta isi data dengan menggunakan PHPMyAdmin, MySQL Workbench, CMD / Terminal, dan sebagainya dengan sesuai kemampuan kamu. Penulis telah memberikan beberapa data yang akan dibuat sistem database MySQL dengan sebagai berikut:
Nama Database : dbase_toko
Nama Tabel : tb_barang
Isi dari field pada tabel :
- create table tb_barang (id int(11) varchar primary key auto_increment,
- kode_barang varchar(20) varchar,
- nama_barang varchar(40) varchar,
- kategori varchar(20),
- satuan varchar(20),
- keterangan text);
Isi data di dalam tabel “tb_barang” :
- insert into tb_barang values (null, ‘KD-0001’, ‘Sabun Lifebuoy’, ‘Sabun’, ‘Buah’, ‘Membunuh kuman 99 persen.’);
- insert into tb_barang values (null, ‘KD-0002’, ‘Beras Ramos’, ‘Sembako’, ‘Kg’, ‘Beras yang terbaik di Indonesia.’);
- insert into tb_barang values (null, ‘KD-0003’, ‘Kursi Livi’, ‘Alat dan Perabotan’, ‘Unit’, ‘Kursi kayu ini kokoh.’);
- insert into tb_barang values (null, ‘KD-0004’, ‘Tisu Basah Kodomo’, ‘Pembersih Makanan’, ‘Unit’, ‘Tisu ini lembut sekali.’);
Berikut hasil dari pengisian data ke dalam tabel barang (tb_barang) dengan sebagai berikut:
Setelah kamu telah membuat sistem database seperti yang diatas, maka kamu bisa mulai ngoding dengan menggunakan bahasa pemrograman PHP untuk membuat tampilan seluruh data yang ada di dalam tabel barang dengan gaya REST API dengan bantuan JSON.
MEMBUAT PROGRAM BACKEND UNTUK MENAMPILKAN SELURUH ISI DATA DENGAN PHP DAN JSON
Pada poin ini, kamu bisa memulai dalam melakukan ngoding untuk menampilkan seluruh isi data yang diambil dari tabel barang yang terdapat pada database toko dengan menggunakan bahasa pemrograman PHP sebagai backend dan JSON sebagai bentuk tampilan isi seluruh data dengan gaya REST API. Penulis akan membuat semua itu dengan menggunakan server lokal dari XAMPP dan Text Editor yang menggunakan Visual Studio Code atau kamu bisa menggunakan Text Editor dan server yang berasal dari Control Panel yang terdapat di hosting atau VPS.
Kode perintah untuk menampilkan data dengan PHP dan JSON:
<?php //Koneksi database MySQL - PHP $host = "localhost"; //Nama Host Server (localhost sebagai default) $user = "root"; // Nama Pengguna $pass = ""; // Kata Sandi $dbase = "dbase_toko"; // Nama Database $koneksi = mysqli_connect($host,$user,$pass,$dbase); //Menampilkan data dari tabel barang dalam bentuk REST API $query = "SELECT * FROM tb_barang"; $data = mysqli_query($koneksi, $query) or die(mysqli_error($koneksi)); $ResultData = mysqli_num_rows($data); if ($ResultData > 0) { $getdata = array(); while($row =mysqli_fetch_assoc($data)) { $getdata[] = $row; } echo json_encode($getdata); } else { echo "0"; } mysqli_close($koneksi); ?>
Setelah dibuat program backend untuk menampilkan data barang ke dalam bentuk REST API (JSON), maka kamu bisa menyimpan file dengan memberikan nama “tampil_listdata.php” di Text Editor. Misalkan, server lokal XAMPP, maka simpanlah file tersebut ke dalam folder “htdocs” pada XAMPP atau mengikuti aturan hosting dalam menyimpan file teks.
Berikut hasil dari program backend PHP untuk menampilkan seluruh isi data dari tabel Barang yang terdapat di database Barang pada MySQL dengan gaya REST API.
MEMBUAT APLIKASI ANDROID UNTUK MEMASUKKAN DATA BARANG KE DALAM SPINNER DI KODULAR
Pada poin ini, kamu bisa mulai dalam membuat aplikasi Android yang dikhususkan untuk memasukkan data-data yang diambil dari MySQL ke dalam komponen Spinner sehingga kamu tidak perlu memasukkan banyak pilihan item data ke dalam Spinner secara manual.
1. Bukalah kembali web browser di laptop atau PC kamu.
2. Kunjungi situs Kodular App Creator (c.kodular.io).
3. Buatlah project baru yang dikhususkan untuk menampung item data yang diambil dari database MySQL ke dalam Spinner.
4. Rancanglah tampilan aplikasi seperti ini.
5. Klik Blocks.
6. Buatlah blok program untuk mengakses situs untuk menampilkan data dari tabel tersebut dengan gaya REST API.
7. Buatlah blok program dalam bentuk variabel untuk menampung isi data yang telah diconvert dari JSON ke List.
8. Buatlah blok program dalam bentuk variabel untuk menampung item data ke dalam Spinner.
9. Buatlah blok program untuk menampung item data tersebut ke dalam Spinner.
Pada langkah ini, kamu bisa melakukan untuk menampung item data yang diambil dari database MySQL ke dalam Spinner dengan sesuka hati kamu.
10. Klik Test >>> Connect to Companion.
11. Masukkan kode Companion ke dalam Aplikasi Kodular Companion yang terpasang di Android.
TESTING APLIKASI ANDROID
Pada poin ini, penulis memberikan tampilan gambar dari hasil pengujian aplikasi Android yang dikhususkan untuk memasukkan beberapa item data yang diambil dari MySQL atau database server ke dalam Spinner di Kodular dengan sebagai berikut:
1. Tampilan Awal.
2. Tampilan pada saat memilih item data di Spinner.
3. Tampilan pada setelah memilih item data dari Spinner.
Selesai.
Kamu telah menyelesaikan dalam membuat aplikasi Android yang dikhususkan untuk menampung atau menambah item data yang diambil dari database MySQL ke dalam Spinner pada Kodular dengan bantuan bahasa pemrograman PHP sebagai backend dan JSON sebagai gaya tampilan REST API.
FILE PROJECT APLIKASI
Kamu bisa mengunduh file project aplikasi ini dengan klik disini. Dengan adanya file project yang telah dibuatkan oleh penulis, diharapkan bisa dimanfaatkan dengan sebaik-baiknya dalam membuat aplikasi Android sendiri dengan Kodular.
PENUTUP
Komponen Spinner merupakan salah satu komponen UI yang terdapat di pallete Kodular yang berfungsi untuk memasukkan beberapa pilihan item data yang akan ditentukan dalam memilih salah satu item data oleh pengguna aplikasi. Nah, kamu bisa menampung banyak item data ke dalam Spinner dengan mudah dan cepat yaitu menggunakan database yang salah satunya MySQL sehingga tidak perlu memasukkan item data secara manual lagi.
Untuk membuat pengambilan data tersebut, maka menggunakan bahasa pemrograman PHP sebagai backend dan bentuk tampilan data itu gaya REST API (JSON) agar memudahkan memasukkan item data ke dalam Spinner yang berdasarkan field yang ditentukan.