PPB C - Pertemuan 12 - Login App (MVVM)

- Mei 18, 2026

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

Login App

Pada tugas kali ini, saya membuat sebuah aplikasi login sederhana menggunakan bahasa pemrograman Kotlin pada Android Studio dengan memanfaatkan Jetpack Compose untuk membangun antarmuka pengguna yang modern dan responsif. Aplikasi ini menerapkan Room Database sebagai media penyimpanan data lokal untuk menyimpan informasi pengguna berupa username dan password, serta menggunakan arsitektur MVVM (Model-View-ViewModel) agar struktur kode lebih terorganisir dan mudah dikembangkan. Fitur utama pada aplikasi meliputi input username dan password, proses autentikasi login, validasi data pengguna, serta pemberian feedback menggunakan Toast. Selain itu, aplikasi juga memanfaatkan coroutine, Flow, dan SharedFlow untuk mendukung pengelolaan data secara asynchronous dan reaktif sehingga proses login dapat berjalan dengan lebih efisien dan terstruktur.

Repository Github: Login App

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. Buat User.kt sebagai entity Room yang merepresentasikan tabel users di database, menggunakan anotasi @Entity dan @PrimaryKey(autoGenerate = true) untuk membuat kolom id yang otomatis bertambah, berisi field id, username, dan password.

6. Buat UserDao.kt sebagai interface DAO dengan anotasi @Dao, berisi fungsi getUserByUsername menggunakan @Query, fungsi insertUser menggunakan @Insert, dan getAllUsers yang mengembalikan Flow<List<User>> untuk data yang reaktif.

7, Buat AppDatabase.kt sebagai konfigurasi database Room menggunakan anotasi @Database, diimplementasikan dengan singleton pattern menggunakan @Volatile dan synchronized agar hanya ada satu instance database yang berjalan di seluruh aplikasi.

8. Buat UserRepository.kt sebagai lapisan abstraksi antara DAO dan ViewModel, membungkus semua fungsi DAO sehingga ViewModel tidak perlu mengetahui sumber data secara langsung dan kode lebih mudah di-maintain.

9. Buat LoginViewModel.kt yang menyimpan state input username dan password menggunakan mutableStateOf, menjalankan logika login di dalam viewModelScope.launch, serta mengirim hasil ke UI menggunakan MutableSharedFlow untuk event seperti login sukses, error, dan status seed user.

10. Buat LoginScreen.kt sebagai tampilan UI menggunakan Jetpack Compose, menampilkan OutlinedTextField untuk input dan tombol aksi, serta menggunakan LaunchedEffect untuk mengumpulkan (collect) SharedFlow dari ViewModel dan menampilkan hasilnya sebagai Toast.

11. Buat MainActivity.kt sebagai entry point aplikasi, menginisialisasi AppDatabase, UserRepository, dan LoginViewModelFactory secara manual di onCreate, kemudian menggunakan viewModel(factory = factory) agar ViewModel menerima dependency yang dibutuhkan sebelum LoginScreen ditampilkan.