PPB C - Pertemuan 11 - Marketplace Siswa

5025221103 | Hilmi Fawwaz Sa'ad | Pertemuan 11 | PPB C

Marketplace Siswa

Pada tugas kali ini, saya membuat sebuah aplikasi manajemen produk marketplace siswa sederhana bernama MarketKu menggunakan bahasa pemrograman Kotlin pada aplikasi Android Studio dengan memanfaatkan Jetpack Compose untuk membangun tampilan antarmuka pengguna. Aplikasi ini dirancang untuk membantu pengelolaan produk secara digital, yang mencakup fitur splash screen dengan animasi, onboarding tiga halaman, serta halaman utama yang memungkinkan pengguna untuk menambah, mengubah, menghapus, mencari, dan memfilter produk berdasarkan kategori. Data produk disimpan secara lokal menggunakan Room Database, sementara status onboarding disimpan menggunakan DataStore Preferences agar aplikasi mengingat apakah pengguna sudah melewati onboarding sebelumnya.

Repository Github: Marketplace Siswa

1. Buka Android Studio

2. Pilih "Project Baru"

3. Pilih "Empty Activity" dan pilih "Next"

4. Isi konfigurasi sesuai dengan project yang dikerjakan dan pilih "Finish"

5. Konfigurasi yang dibuat akan menghasilkan file MainActivity yang berfungsi sebagai tempat utama untuk menjalankan aplikasi serta mengatur tampilan awal yang akan ditampilkan kepada pengguna

6. Buat beberapa folder untuk arsitektur MVVM agar mudah untuk di maintenance dan mudah secara alur programnya. Folder data, folder ui, dan juga utils. Untuk membuat folder caranya dengan klik kanan > New > Package > namapackageanda

7. Buat file ProductEntity.kt di data/entities. File ini adalah representasi tabel database. Setiap field di data class Product akan menjadi kolom di tabel SQLite. Anotasi @Entity(tableName = "product") mendaftarkan class ini sebagai tabel

8. Buat file ProductDao.kt di data/dao. File ini digunakan untuk operasi database. Semua query SQL ditulis di sini menggunakan anotasi Room seperti @Query, @Insert, @Update, @Delete. Fungsi yang mengembalikan Flow akan otomatis update UI saat data berubah, sedangkan yang pakai suspend dijalankan secara async (coroutine)

9. Buat file MarketplaceSiswaDatabase.kt di data/. File ini adalah konfigurasi utama Room Database. Class ini bersifat abstract dan menyediakan akses ke ProductDao. Dibuat dengan pola Singleton (@Volatile + synchronized) agar hanya ada satu instance database di seluruh aplikasi

10. Buat file ProductRepository.kt di data/repositories. File ini berfungsi sebagai lapisan perantara antara DAO dan ViewModel. ViewModel tidak boleh langsung memanggil DAO, melainkan lewat Repository

11. Buat file MarketplaceSiswaApp.kt di root package. File ini adalah Application class yang diinisialisasi saat app pertama kali dijalankan. Database dibuat di sini menggunakan lazy yang artinya baru dibuat saat pertama kali diakses, bukan langsung saat app start

12. Buat file FormatterUtils.kt di utils/. File ini berisi satu fungsi formatCurrency() untuk mengubah angka Double menjadi format Rupiah (Rp) menggunakan NumberFormat dengan locale Indonesia

13. Buat file OnboardingViewModel.kt di ui/viewmodels/. File ini mengelola status onboarding dengan menyimpan satu nilai boolean onboarding_completed, yang artinya apakah user sudah pernah melewati onboarding atau belum

14. Buat file ProductViewModel.kt di ui/viewmodels/. File ini digunakan untuk menginisialisasi database dan repository, lalu mengekspos data ke UI via uiState

15. Buat file Navigation.kt di ui/navigation. File ini mendefinisikan semua rute navigasi aplikasi menggunakan sealed class Screen

16. Buat file SplashScreen.kt di ui/screens. Screen ini akan menampilkan logo, nama app "MarketKu". Setelah 2 detik, otomatis berpindah ke Onboarding atau Home tergantung status onboarding yang dibaca dari OnboardingViewModel

17. Buat file OnboardingScreen.kt di ui/screens. Layar onboarding berisi 3 halaman yang bisa digeser menggunakan HorizontalPager. Setiap halaman punya icon, judul, dan deskripsi berbeda. Setelah selesai, memanggil setOnboardingCompleted() agar onboarding tidak muncul lagi di buka berikutnya

18. Buat file AddEditProduct.kt di ui/screens/. Layar form untuk tambah dan edit produk, Jika productId null berarti mode tambah, jika ada berarti mode edit (data produk lama otomatis dimuat ke field).

19. Buat file HomeScreen.kt di ui/screens/. Layar utama aplikasi yang menampilkan seluruh daftar produk

20. Edit file MainActivity,kt yang ada di root package. File entry point aplikasi di mana NavHost dikonfigurasi untuk mendaftarkan semua rute (Splash, Onboarding, Home, AddProduct, EditProduct) beserta composable screen masing-masing. ProductViewModel dan OnboardingViewModel diinisialisasi di sini dan diteruskan ke composable yang membutuhkan