Mengembangkan Chat dengan Python Firebase
Pada artikel kali ini saya akan menulis tentang bagaimana membuat realtime chat menggunakan Python Firebase. Namun, sebelum ke intinya, mari kita kenali dulu apa itu Firebase.
Apa Itu Firebase ?
Firebase adalah suatu layanan dari Google yang digunakan untuk mempermudah para developer dalam mengembangkan aplikasi. Khusus untuk membuat chat, kita akan menggunakan salah satu fitur Firebase yaitu Realtime 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 mem-build aplikasi lintas platform dengan SDK iOS, Android, dan JavaScript, semua klien akan berbagi sebuah instance Realtime Database dan menerima update data terbaru secara otomatis.
Untuk hasilnya, silakan melihat gambar di bawah ini.
Memulai Proyek di Firebase
Pertama-tama siapkan terlebih dahulu database di Firebase. Anda bisa mengunjungi Firebase untuk memulai pembuatan database dan sekaligus aplikasinya. Berikut ini tampilan di halaman Firebase. Klik Get started untuk memulai membuat project.
Masukkan nama project yang akan dibuat. Sebagai contoh, lihatlah gambar di bawah ini. Selanjutnya aktifkan Google Analytic jika diperlukan dan klik continue.
Pilih akun untuk Google Analytic dan klik create porject.
Setelah selesai membuat project, langkah selanjutnya adalah menambahkan platform seperti gambar di bawah ini. Klik add app, pilih platform yang ingin digunakan (iOS, Android, Web). Pada kasus ini, pilih web karena platform yang akan digunakan adalah untuk web.
Setelah mendaftarkan app, Anda akan mendapatkan konfigurasi Firebase, salin dan simpan terlebih dahulu agar nanti dapat digunakan.
Membuat dan Mengkonfigurasi Database
Setelah selesai menyiapkan project app, buatlah Realtime Ratabase untuk menyimpan data. Masuk ke menu Realtime Database dan klik Create Database. Seperti gambar di bawah ini.
Set up database location dan klik next.
Lalu, set up security rules menjadi locked mode dan klik enable.
Selanjutnya Anda perlu mengubah rules untuk read menjadi true.
{
"rules": {
".read": true,
".write": false
}
}Sementara itu, structure database-nya akan terlihat seperti gambar di bawah ini. Pada gambar di bawah ini terdapat url database-nya https://simple-chat-py-default-rtdb.firebaseio.com
Selanjutnya masuk ke project setting > service account, dan pilih config untuk Python dan klik generate new private key. Nantinya Anda akan mendapatkan file dalam bentuk .json yang akan digunakan pada config credentials Python.
Memulai Membuat Aplikasi Chat dengan Pyhton
Setelah selesai konfigurasi Firebase, selanjutnya Anda dapat membuat aplikasi chat di Python. Install terlebih dahulu flask dan Firebase-admin dengan cara seperti dibawah ini.
pip install flask
pip install firebase-adminBuatlah folder project chat, dan sesuaikan structure folder-nya seperti.
Pada folder configs, buat file dengan nama __init__.py. Isikan code yang didapat dari service account di Firebase dan tambahkan database url Firebase.
Untuk file json yang didapat dari generate private key, pindahkan ke folder creds dan sesuaikan nama file. Selanjutnya Anda dapat membuat file app.py untuk membuat routing dan menjalankan aplikasi-nya nanti dengan flask.
Yang perlu diperhatikan disini adalah import package firebase-admin db dan config credentials-nya. .
Pada route index digunakan untuk mengarahkan ke halaman interface chat dan route send_message untuk menyimpan pesan atau data ke Firebase Database.
Konfigurasi Frontend
Selanjutnya Anda harus mempersiapkan interface. Untuk interface, Anda bisa mengunduh source code nya di tautan GitHub.
Setelah diunduh, ada sedikit konfigurasi Firebase di javscript. Buka file chat.js dan isikan Firebase configs yang sebelumnya diperoleh pada pembuatan aplikasi.
Tentunya kita harus import Javascript Firebase aplikasi dan Firebase Database di index.html.
Setelah semua konfigurasi selesai, Anda dapat menjalankan aplikasi chat dengan menjalankan perintah flask run yang bisa diakses di http://127.0.0.1:5000/
Selamat mencoba!
