Pertemuan 13 - PPB

Nama               : Amanda Illona Farrel
NRP                : 5025221056
Mata Kuliah    : Pemrograman Perangkat Bergerak (C)

Student Registration App

Dalam artikel kali ini, saya ingin berbagi hasil eksplorasi saya dalam membuat aplikasi Android berbasis CRUD (Create, Read, Update, Delete) menggunakan MVVM Architecture, Jetpack Compose, dan Room Database. Aplikasi ini saya beri nama Student Registration App, sebuah aplikasi pengelolaan data siswa sederhana.

Langkah awal dimulai dengan membuat proyek baru menggunakan template Empty Activity di Android Studio. Saya membuat tampilan utama yang sederhana dari referensi berikut berisi form input nama dan email, tombol tambah, dan daftar siswa yang tersimpan.

Kemudian, saya melakukan eksplorasi dengan memodifikasi dan mengembangkan kode tersebut secara bertahap. Saya menerapkan MVVM Architecture dengan memisahkan layer: UI (Jetpack Compose), ViewModel (state management dengan StateFlow), DAO (Room abstraction), dan Room Database (persistent storage). Untuk reactive data flow, saya menggunakan Kotlin Flow yang otomatis meng-update UI setiap kali data di database berubah.

Adapun fitur-fitur yang saya implementasikan adalah sebagai berikut:
  1. Tambah siswa baru dengan validasi nama dan email
  2. Edit data siswa melalui dialog interaktif yang dapat memperbarui nama dan email
  3. Hapus siswa dengan konfirmasi dialog untuk mencegah penghapusan tidak sengaja
  4. Tampilan daftar siswa secara real-time menggunakan Flow dan StateFlow
  5. Fitur pencarian (search) untuk mencari siswa berdasarkan nama atau email
  6. Fitur sorting A-Z dan Z-A untuk mengurutkan daftar siswa berdasarkan nama
  7. Real-time email validation menggunakan Patterns.EMAIL_ADDRESS dengan visual feedback
  8. Tombol submit yang otomatis disabled ketika form belum valid
  9. Theme toggle dengan tiga pilihan: Mode Terang, Mode Gelap, dan Mengikuti Sistem
  10. Persistensi preferensi theme menggunakan SharedPreferences sehingga tetap tersimpan walaupun aplikasi di-restart
  11. Avatar dengan gradient warna yang berbeda untuk setiap siswa berdasarkan huruf depan nama
  12. Empty state yang informatif ketika belum ada data atau hasil pencarian kosong
  13. Room Database untuk menyimpan data siswa secara persistent di SQLite
  14. MVVM Architecture dengan proper separation of concerns
  15. Modern UI dengan Jetpack Compose dan Material Design 3 lengkap dengan gradient header
Implementasi ini melibatkan pembuatan beberapa file penting:
  • Entity Siswa dengan kolom id (auto-generate), nama, dan email
  • DAO (SiswaDao) dengan query insert, update, delete, dan getAllSiswa yang mengembalikan Flow
  • AppDatabase configuration dengan Singleton pattern dan @Volatile annotation untuk thread safety
  • StudentViewModel untuk mengelola state, business logic, dan operasi CRUD
  • ViewModelProvider.Factory untuk dependency injection DAO ke ViewModel
  • Theme.kt dengan custom color scheme untuk light dan dark mode
  • ThemeMode enum untuk pilihan theme (LIGHT, DARK, SYSTEM)
  • Validation.kt sebagai utility untuk validasi format email
  • Komponen UI yang modular: MainScreen, FormInput, StudentItem, EditDialog, dan DeleteConfirmDialog
  • MainActivity dengan setup ViewModel, SharedPreferences, dan theme state

Untuk testing aplikasi, pengguna dapat langsung menambahkan data siswa melalui form di halaman utama. Setiap data yang ditambahkan akan langsung tersimpan di SQLite database dan muncul di daftar secara real-time berkat Flow yang reactive. Pengguna juga dapat melakukan edit dan delete pada setiap item siswa, mencari siswa berdasarkan nama atau email, serta mengubah tampilan tema sesuai preferensi.

Melalui project Student Registration App ini, saya mempelajari banyak hal penting dalam Android development: bagaimana mengimplementasikan operasi CRUD lengkap dengan Room Database, menggunakan Flow dan StateFlow untuk reactive UI yang otomatis update, menerapkan State Hoisting di Jetpack Compose untuk pengelolaan state yang clean, membuat custom ViewModelProvider.Factory untuk dependency injection, mendesain UI modern dengan Material Design 3 termasuk gradient dan custom color scheme, serta mengelola persistent preferences dengan SharedPreferences. Untuk melihat update database secara real-time, buka App Inspection di Android Studio dan navigasi ke tab Database Inspector, lalu pilih tabel siswa. Setiap perubahan dari aplikasi akan langsung terlihat di tabel database. Berikut demo aplikasi Student Registration App:

Note: data yang ada di dalam video tersebut bukan data sebenarnya

Hasil pembelajaran saya tersebut dapat dilihat pada resource berikut. Demikian hasil eksplorasi saya. Terima kasih sudah menyimak :)

Link:

Komentar

Posting Komentar

Postingan populer dari blog ini

Pertemuan 3 - PPB

Gambar
Nama               : Amanda Illona Farrel NRP                 : 5025221056 Mata Kuliah    : Pemrograman Perangkat Bergerak (C) Membuat Aplikasi Ulang Tahun Pada kesempatan kali ini, saya mendapatkan pengalaman baru untuk mengenal Composable dan Komponen Text dalam mobile programming . Di tugas sebelumnya saya hanya mengikuti panduan dasar untuk membuat teks "Hello Android", sementara di tugas ini terdapat tantangan baru. Berikut langkah-langkah sederhana untuk membuat aplikasi Ulang Tahun menggunakan Android Studio: Pertama, saya membuat project baru di Android Studio dengan memilih template Empty Activity , lalu mengisi konfigurasi project seperti Name , Package name , Save location , Minimum SDK , dan Build configuration language sesuai kebutuhan sebelum menekan tombol Finish .  Kemudian, saya mengatur layar utama aplikasi pada MainActivity dengan menggunakan komponen Surface di...
Baca selengkapnya

ETS - PPB

Gambar
Nama        : Amanda Illona Farrel NRP          : 5025221056 Mata Kuliah : Pemrograman Perangkat Bergerak (C) Mobile Front End - Artharum Dalam artikel kali ini, saya ingin berbagi hasil pengerjaan proyek bersama rekan saya, Ahmad Fadhilah Mappisara , yang ditujukan untuk memenuhi Evaluasi Tengah Semester (ETS). Kami memilih Proyek 4: Aplikasi Catatan Keuangan Pribadi dan bersama-sama mengembangkan aplikasi mobile bernama Artharum . Artharum berasal dari Artha (bekal hidup bermartabat) dan Arum (harum yang membekas) — pengingat bahwa setiap rupiah yang dicatat adalah penghargaan terhadap kehidupan. 1. Deskripsi Aplikasi Sebelum masuk ke detail teknis, izinkan kami memperkenalkan Artharum secara lebih mendalam. Artharum adalah aplikasi catatan keuangan pribadi berbasis Android yang dirancang untuk membantu pengguna merekam, meng...
Baca selengkapnya

Pertemuan 1 - PPB

Nama               : Amanda Illona Farrel NRP                     : 5025221056 Mata Kuliah     : Pemrograman Perangkat Bergerak (C) Eksplorasi Perkembangan Teknologi Perkembangan teknologi perangkat mobile tidak hanya terjadi pada perangkat keras, tetapi juga pada sistem operasi yang digunakan untuk menjalankan berbagai aplikasi. Sistem operasi berfungsi sebagai penghubung antara perangkat keras dengan perangkat lunak sehingga pengguna dapat menjalankan berbagai layanan digital. Saat ini sistem operasi tidak hanya digunakan pada smartphone , tetapi juga pada smartwatch , smart TV , perangkat Internet of Things (IoT), hingga kendaraan pintar. Berikut merupakan contoh-contohnya: Tabel 1. Detail Teknologi No Device OS Dibuat oleh Negara Tahun Fungsi Programming Link Gambar/Video 1 iPhone iOS Apple Amerika Serikat 2007 Smartphone untu...
Baca selengkapnya