Hi BDx-ian!
Tutorial pada kali ini kita akan belajar cara nak setup aplikasi Android menggunakan Kodular.io dan Firebase. Kita akan membina aplikasi menggunakan komponen button pada Kodular untuk mengawal LED dan output akan dipaparkan pada skrin telefon Android anda.
Apa itu Kodular?
Kodular membolehkan anda membuat aplikasi Android dengan mudah dengan editor block-type. Anda boleh membangunkan aplikasi Android dengan cara hanya drag-and-drop komponen dan tiada coding diperlukan apabila menggunakan platform percuma ini.
1. Firebase
Bagi yang belum pernah mencuba projek menggunakan Firebase, anda boleh melayari tutorial kami yang lepas (https://app.bdxtronix.com/blog/hantar-data-dari-nodemcu-esp8266-ke-firebase) untuk mengetahui lebih lanjut cara mencipta akaun dan setup Firebase anda.
Setelah anda selesai setup untuk projek baru anda, pergi ke Build -> Tekan Realtime Database -> Create Database.
Pilih region United States -> Tekan Next
Pilih test mode -> Tekan Enable
Setup Realtime Database
Tambah data Key dan Value seperti dalam rajah berikut. Kemudian, tekan Add
Setup Firebase Authentication
Untuk mendapatkan WEB API key anda, tekan Build -> tekan Authentication -> tekan Get Started
Pergi ke Authentication -> Tekan Sign-in method -> Tekan Email/Password
Pilih Enable -> Tekan Save
2. Kodular
Setup Kodular
Cipta akaun Kodular
Pergi ke link https://www.kodular.io/ -> Tekan Create Apps -> Cipta akaun Kodular -> Tekan “I Accept The Terms Of Service.
Cipta Projek
Tekan Create Project -> Isi nama projek anda -> Tekan Next.
Lengkapkan configure projek anda -> Tekan Finish.
-Pastikan anda meletakkan "com." pada Package Name
Pergi ke Palette User Interface -> Drag dan drop komponen Button dan Text Box ke dalam Screen1.
Skroll Palette -> Tekan Google -> Drag dan drop Firebase Database ke dalam Screen1.
Edit komponen
Anda boleh edit komponen yang berada dalam Screen dengan cara edit Properties komponen yang berada pada belah kanan.
Komponen Firebase Database.
Pergi ke projek Firebase yang anda telah cipta tadi.
a. Firebase URL
Copy link URL projek Firebase anda -> Paste URL pada Firebase URL
b. Firebase Token
Pergi ke Project Settings -> Copy WEB API key anda -> Paste pada Firebase Token
Project Bucket
Copy data Firebase -> Paste nama data pada Project Bucket
Block Code
Tekan Block -> Drag dan block code komponen anda.
Anda boleh rujuk block code dibawah untuk membina aplikasi anda.
Test Kodular
Anda perlu install aplikasi Kodular ke dalam telefon Android anda melalui Play Store.
Untuk sambungkan telefon anda kepada browser Kodular, anda perlu tekan Test -> Pilih Connect to Companion.
Buka aplikasi Kodular dalam telefon anda -> Scan QR code atau masukkan teks code.
Output
Setelah anda berjaya connect pada telefon anda, screen anda akan memaparkan projek anda bina.
Tekan LED ON, text akan menunjukkan LED ON. Value ledStatus tukar kepada 1.
Tekan LED OFF, text akan menunjukkan LED OFF. Value ledStatus tukar kepada 0.
Jika anda suka dengan perkongsian tutorial dalam blog kami ni, jangan lupa untuk follow Facebook dan Instagram kami, kat situ ada bermacam info dan update terkini yang akan kami kongsikan kepada anda. Itu sahaja untuk tutorial kami. Stay update dan selamat mencuba!
