Pada kesempatan kali ini, saya akan membuat aplikasi yang dapat menyimpan data ke spreadsheet airtable Kodular. Spreadsheet adalah jenis database atau penyimpanan data yang paling sering digunakan oleh banyak pengembang aplikasi untuk menyimpan data-data aplikasi secara gratis. Jenis data yang dapat disimpan di spreadsheet bisa berupa text, angka, ataupun tautan.
Pada airtable menyediakan paket gratis untuk membuat database spreadsheet dengan penggunaan base yang tidak terbatas, maksimal records per base 1,200 dan juga Attachment space per base 2GB. Fitur ini sudah cukup bagus bagi pengembang aplikasi yang ingin mempunyai penyimpanan data gratis.
Cara membuat aplikasi yang dapat menyimpan data ke Spreadsheet Airtable Kodular
Table of Contents
Aplikasi yang dibuat akan menyimpan data-data item yang ada di dalam gudang supermarket, yang nantinya akan berguna untuk memantau jumlah stok dari suatu barang yang ada di dalam gudang. Aplikasi ini juga menggunakan konsep CRUD yang dapat menyimpan data, merubah data, menghapus data, dan menampilkan data yang tersimpan di database.
Baca juga : CRUD Firebase App Inventor Kodular
Buat Database di Airtable
Hal pertama yang dilakukan yaitu membuat database untuk menyimpan data aplikasi, kamu dapat membuat database spreadsheet di Airtable. Masuk ke Airtable lalu login menggunakan email google dan jangan lupa setelah itu masukkan nama workspace.
Klik “Add base” untuk membuat database baru, kemudian pilih “Start from scratch” dan kamu akan disuruh untuk memasukkan nama database dan juga diberikan pilihan warna serta logo untuk database yang sedang kamu buat. Setelah itu kamu harus masuk ke halaman database untuk membuat tabel dengan cara klik pada kotak database yang sudah kamu buat, dan nanti kamu akan masuk ke halaman serperti dibawah ini.
Setelah kamu masuk ke halaman seperti gambar diatas, kamu harus mengatur tabel yang nantinya digunakan untuk menyimpan data. Rubah nama tabel sesuai dengan keinginan kamu dan juga jangan lupa untuk merubah nama field heading pada tabel dan ganti jenis inputannya menjadi “single line text”.
Kemudian hapus record yang kosong dengan cara seperti dibawah ini.
Tujuan menghapus record yang kosong ini supaya data yang di input pertama kali dari aplikasi, dapat disimpan di record paling pertama. Hapus semua record yang kosong hingga tersisa field heading-nya saja.
Buat Desain Aplikasi di Kodular
Untuk membuat aplikasi ini, saya membuatnya di Kodular karena Kodular sudah menyediakan komponen spreadsheet yang bisa langsung di tambahkan ke aplikasi yang akan dibuat. Pada desain yang saya buat kali ini sederhana, kamu dapat mendesain ulang tampilan aplikasinya agar lebih menarik.
pada desain kali ini saya menggunakan komponen “TextBox”, komponen in digunakan untuk form input data dan juga untuk input pencarian data. Selanjutnya komponen “Button” yang berjumlah 6 masing-masing memiliki fungsi program untuk menyimpan, menghapus, merubah, mencari, dan menampilkan data.
Adapun komponen “Notifier” yang berguna sebagai notifikasi dari setiap aksi yang telah dilakukan. Komponen “ListView” berguna untuk menampilkan data dari database ke dalam bentuk list. Dan yang terakhir yaitu komponen paling utama “Spreadsheet” dimana komponen ini dapat menghubungkan aplikasi dengan database dengan menggunakan API key, Base ID dan nama tabel.
Jangan lupa masukkan API key, Base ID dan juga nama tabel pada komponen Spreadsheet di bagian properties pada saat kamu masih masuk di halaman desain aplikasi. Untuk mengetahui API key, Base ID dan nama tabel, kamu dapat masuk ke halaman database Airtable.
Untuk mencari API Key kamu dapat klik “Account” lalu ketika sudah masuk ke halaman akun, scroll ke bawah kamu akan melihat API key milikmu. Kemudian untuk mendapatkan base id kamu dapat klik “API documentation” setelah masuk ke halaman dokumentasi API kamu bisa salin kode Base ID di url nya lihat seperti gambar diatas.
Baca juga : CRUD MySQL App Inventor Kodular
Kode program aplikasi menyimpan data ke spreadsheet airtable
Setelah proses desain selesai maka tahap selanjutnya adalah membuat kode programnya agar aplikasi dapat menjalankan tugasnya sesuai dengan harapan.
Kode program awalan
Berikut adalah penjelasan dari program diatas, pada kode program awalan diatas hal pertama yang dilakukan yaitu dapatkan data dari database terlebih dahulu, kemudian dilakukan ekstrasi data agar data yang didapat dari database spreadsheet airtable dapat di tampilkan di ListView. Karena data yang diambil langsung dari Spreadsheet airtable ini masih kotor, banyak karakter yang perlu di hapus agar mendapatkan data yang bersih.
Prosedur “clear” digunakan untuk membersihkan data yang ada di TextBox ketika selesai menginput data, selanjutnya yaitu variabel “database” yang mana akan menyimpan data yang sudah didapatkan dari database kemudian data tersebut akan digunakan untuk proses pencarian data.
Variabel “index” digunakan untuk menampung nilai index dan variabel “row” untuk menampung nilai baris yang ada di tabel database. Untuk Button “Cancel” digunakan untuk membatalkan aksi pada saat akan merubah data ataupun menghapus data. Button “GetAllData” berfungsi untuk menampilkan semua data.
Kode program save, update, delete data Spreadsheet Airtable
kode program pada button “save” berfungsi untuk menyimpan data ke spreadsheet airtable, dengan memasukkan data berupa id, nama, dan stok. Selanjutnya kode progam pada komponen button “update” berfungsi untuk merubah data apabila data yang sudah dimasukkan ke database terdapat kesalahan dan juga kode program pada komponen button “delete” berfungsi untuk menghapus data.
Kode program mencari data dan menampilkan data listview ke TexBox
Build Project
Setelah selesai membuat kode program aplikasi maka selanjutnya adalah merubah projectnya dalam bentuk aplikasi untuk menguji apakah aplikasi yang dibuat dapat berjalan sesuai harapan pengembang atau tidak.
Kesimpulan
Disini saya akan mencoba untuk menarik kesimpulan, untuk menyimpan data ke spreadsheet airtable dengan kodular ini memang sangat cocok bagi pengembang aplikasi yang tidak ingin mengeluarkan banyak modal, karena pada Airtable menyediakan paket gratis untuk menyimpan data aplikasi.
Perlu diketahui bahwa spreadsheet aritable hanya bisa menyimpan data dalam bentuk string atau text, jadi kamu tidak dapat menginput gambar secara langsung ke spreadsheet airtable melalui aplikasi, kamu bisa memberi tautan jika ingin menginput gambar.
Untuk proses pengambilan data dari spreadsheet airtable cukup rumit ketika menampilkan datanya ke listview, karena banyak sekali karakter yang perlu dihapus, data yang diambil dari spreadsheet airtable perlu dilakukan banyak preprocessing.
Tentunya proses pengambilan datanya tidak semudah dengan menggunakanan database MySQL, TinyDB ataupun Firebase. Karena 3 jenis database tersebut tidak terlalu banyak melakukan preprocessing ketika ingin menampilkan datanya.
Sekian dari postingan kali ini, semoga bermanfaat dan apabila ada yang ingin di tanyakan dapat memberikan komentar dibawah. Terima kasih…
Kok begitu saya runing langsung belum ada data dan loading mohon tunggu ya
coba di hapus component notifiernya dibagian when screen1 initialize, trus coba ditunggu datanya keluar apa enggak.
Itu call “clear” dari mana ya?
agar blok program call “clear” muncul, harus membuat blok fungsi program “clear” terlebih dahulu, silahkan lihat diatas sudah ada contohnya.
Assalamualaikum wr wb. Mas saya mau tanya, punya saya Airtablenya belum bisa terhubung dengan kodularnya, padahal saya sduah masuka API key, Mase ID, dan table, dan mengikuti block kode diatas tapi tetap tidak bisa menampilkan data dr Airtable, kira2 kesalahannya dr mana ya? Terima kasih
Mungkin ada yg salah pas copy API Key atau Base ID nya
mas saya itu punya kendala untuk upload gambar dan memasukan gambar hasil tangkapan kamera kedalam airtabel..kira-kiri ada perunjuknya beserta ilustrasinya. ini salah satu tugas kelompok saya. moohn arahannya mas. terima kasih