Belajar Membuat Aplikasi Android dengan Kotlin Untuk Pemula Bagian 4 : CRUD dengan Firebase Real-Time Database (Part 1 Insert Data)

baytech 30 Januari 2019

  Belajar Membuat Aplikasi Android dengan Kotlin Untuk Pemula Bagian 4 : CRUD dengan Firebase Real-Time Database (Part 1 Insert Data)

Beberapa waktu yang lalu di Codepolitan, kita telah membahas Belajar Membuat Aplikasi Android dengan Kotlin Untuk Pemula Bagian 3 : Login dengan Autentikasi Firebase. Kali ini kita akan melanjutkan seri Android Kotlin kita dengan membuat CRUD (Create,Read,Update,Delete) menggunakan Firebase Real-Time Database. Firebase Realtime Database adalah database yang di-host di cloud. Data disimpan sebagai JSON dan disinkronkan secara realtime ke setiap klien yang terhubung. Ketika Anda membuat aplikasi lintas-platform dengan SDK Android, iOS, dan JavaScript, semua klien akan berbagi sebuah instance Realtime Database dan menerima update data terbaru secara otomatis.

Bagaimana cara kerjanya?

Firebase Realtime Database memungkinkan Anda untuk membuat aplikasi kolaboratif dan kaya fitur dengan menyediakan akses yang aman ke database, langsung dari kode sisi klien. Data disimpan di drive lokal. Bahkan saat offline sekalipun, peristiwa realtime terus berlangsung, sehingga pengguna akhir akan merasakan pengalaman yang responsif. Ketika koneksi perangkat pulih kembali, Realtime Database akan menyinkronkan perubahan data lokal dengan update jarak jauh yang terjadi selama klien offline, sehingga setiap perbedaan akan otomatis digabungkan.

Realtime Database menyediakan bahasa aturan berbasis ekspresi yang fleksibel, atau disebut juga Aturan Keamanan Firebase Realtime Database, untuk menentukan metode strukturisasi data dan kapan data dapat dibaca atau ditulis. Ketika diintegrasikan dengan Firebase Authentication, developer dapat menentukan siapa yang memiliki akses ke data tertentu dan bagaimana mereka dapat mengaksesnya.

Realtime Database adalah database NoSQL, sehingga memiliki pengoptimalan dan fungsionalitas yang berbeda dengan database terkait. API Realtime Database dirancang agar hanya mengizinkan operasi yang dapat dijalankan dengan cepat. Hal ini memungkinkan Anda untuk membangun pengalaman realtime yang luar biasa dan dapat melayani jutaan pengguna tanpa mengorbankan kemampuan respons. Oleh karena itu, perlu dipikirkan bagaimana pengguna mengakses data, kemudian buat struktur data sesuai dengan kebutuhan tersebut.

Oke langsung saja kita mulai membuat CRUD nya langsung aja kita ke langkah yang pertama yaitu:

1. Buatlah project baru

Buatlah sebuah project baru, kemudian desain halaman MainActivity sebagai berikut.

desain tampilan
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">


    <android.support.design.widget.TextInputLayout
            android:layout_width="300dp"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:layout_marginTop="8dp"
            app:layout_constraintBottom_toBottomOf="parent"
            android:layout_marginBottom="199dp"
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox">

        <android.support.design.widget.TextInputEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Nama"
                android:id="@+id/inputNama"
                android:inputType="text"/>
    </android.support.design.widget.TextInputLayout>
    <android.support.design.widget.TextInputLayout
            android:layout_width="300dp"
            android:layout_height="wrap_content"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox" android:id="@+id/textInputLayout">

        <android.support.design.widget.TextInputEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Status"
                android:id="@+id/inputStatus"
                android:inputType="text"/>
    </android.support.design.widget.TextInputLayout>
    <Button
            android:text="Save"
            android:layout_width="250dp"
            android:layout_height="60dp"
            app:layout_constraintStart_toStartOf="parent" 
            app:layout_constraintEnd_toEndOf="parent"
            android:id="@+id/btnSave"
            android:layout_marginBottom="8dp"
            app:layout_constraintBottom_toBottomOf="parent"
            android:layout_marginTop="8dp" 
            app:layout_constraintTop_toBottomOf="@+id/textInputLayout"
            app:layout_constraintVertical_bias="0.32"/>
</android.support.constraint.ConstraintLayout>

kita memiliki 2 EditText dan 1 Button nah berikan ID pada EditText dan Button kita disini saya memberikan nama inputNama dan inputStatus untuk EditText kita dan untuk Button nya saya berinama btnSave.Setelah selesai mendesain tampilan MainActivity kita sekarang kita ke tahap ke dua yaitu:

2. Hubungkan Project Ke Firebase Real-Time Database

connect firebase

Kali ini saya anggap kalian sudah mengerti cara menghubungkan Project ke Firebase karena di Artikel sebelumnya kali ini hanya saja kita akan menggunakan Firebase Real-Time Database bukan Firebase Authentication.Oke jika sudah terhubung kita lanjut ke tahap selanjutnya yaitu :

3. Meyimpan data ke Dalam Databse

Oke sekarang kita akan masuk ke bagian Codingnya yaitu memasukan data kedalam Database.

Pertama kita Deklarasikan dulu Firebase Database pada MainActivity kita

lateinit var ref : DatabaseReference

Lalu tambahkan kedalam method onCreate

ref = FirebaseDatabase.getInstance().getReference("USERS")
override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        ref = FirebaseDatabase.getInstance().getReference("USERS")
    }

Kemudian kita buat function pada btnSaveOnClickListener kedalam method onCreate.

btnSave.setOnClickListener {
            savedata()
        }

menjadi:

override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        ref = FirebaseDatabase.getInstance().getReference("USERS")
        
        btnSave.setOnClickListener {
            savedata()
        }
    }
    private fun savedata() {
        
    }

Setelah itu buatlah sebuah kelas Kotlin baru dan beri nama Users.

Create class

Setelah itu kita masuk kedalam kelas yang baru dibuat dan kita tulis kode dalam kelas tersebut keseluruhannya menjadi seperti ini:

class Users (var nama : String, var status: String) {

    constructor() : this("", "") {

    }
}

Setelah itu kita kembali lagi pada MainActivity dan dan masukan kode berikut kedalam private fun savedata()

val nama = inputNama.text.toString()
        val status = inputStatus.text.toString()
        
        val user = Users(nama,status)
        val userId = ref.push().key.toString()

        ref.child(userId).setValue(user).addOnCompleteListener {
            Toast.makeText(this, "Successs",Toast.LENGTH_SHORT).show()
            inputNama.setText("")
            inputStatus.setText("")
        }

Kurang lebih kode kita akan terlihat seperti ini keseluruhannya:

class MainActivity : AppCompatActivity() {

    lateinit var ref : DatabaseReference

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        
        ref = FirebaseDatabase.getInstance().getReference("USERS")

        btnSave.setOnClickListener {
            savedata()
        }
    }

    private fun savedata() {
        val nama = inputNama.text.toString()
        val status = inputStatus.text.toString()

        val user = Users(nama,status)
        val userId = ref.push().key.toString()

        ref.child(userId).setValue(user).addOnCompleteListener {
            Toast.makeText(this, "Successs",Toast.LENGTH_SHORT).show()
            inputNama.setText("")
            inputStatus.setText("")
        }
    }
}

Sekarang Aplikasi kita siap untuk di jalankan berarti sekarang kalian buka Firebase pada Browser kalian kemudian pilih project yang tadi kalian buat dan pilih Database dan pilih Realtime Database

firebase database

Kemudian Jalankan aplikasi anda kemudian input data dan save lalu data tersebut akan masuk ke Database

data

Penutup

Demikian tutorial CRUD menggunakan Firebase kali ini. Selanjutnya kita akan melanjutkan CRUD untuk membaca/menampilkan data dengan Firebase Realtime Database. Semoga bisa dipahami oleh pembaca sekalian. Jika ada kritik, saran, pertanyaan atau request silahkan melalui kolom komentar saja ya.