Panduan Firebase untuk Android Studio
Panduan Firebase untuk Android Studio
Diterjemahkan
oleh
Agus Haryanto
[Link]
1
Daftar Isi
Pendahuluan......................................................................................................................................... 3
Import Project android-start................................................................................................................. 4
Buat project di Firebase Console..........................................................................................................6
Run Starter Aplikasi............................................................................................................................11
Enable Authentication........................................................................................................................ 12
Konfigurasi Authentication APIs........................................................................................................13
Activate Firebase Realtime Database................................................................................................. 19
Send Messages....................................................................................................................................26
Receive Reengagement Notifcations..................................................................................................30
Remotely Configure Friendly Message Length................................................................................. 36
Send Install Invites............................................................................................................................. 43
Track User Flows................................................................................................................................45
Monetize With Ads............................................................................................................................. 47
Report Crashes....................................................................................................................................50
Summary.............................................................................................................................................52
Referensi.............................................................................................................................................53
Lain-lain............................................................................................................................................. 53
2
Pendahuluan
Salah satu yang lagi trend di mata developer android adalah firebase, yah firebase memang
istimewa dengan segala kelebihan yang dipunyai. Disini Google tampak tidak mau kalah dalam era
dimana developer dalam membangun aplikasi tidak perlu lagi memikirkan infrastruktur
backendnya.
Untuk mempelajarinya tidak sulit di web firebasenya sendiri sudah ada petunjuknya dan menurut
saya cukup mudah untuk diikuti. Jika tertarik bisa ke link ini
[Link]
Tapi kalau masih kesulitan juga mengikuti petunjuknya. Saya coba buatkan versi bahasa
indonesianya yang semoga dapat membantu kita dalam mengenal firebase karena berawal dari
perkenalanlah rasa suka dan cinta itu akan datang (Disini saya hanya berusaha menterjemahkan
kedalam bahasa indonesia dan menambahkan beberapa gambar screen shoot untuk lebih
memperjelas). Mari kita mulai.
Pada project kali ini kita akan buat aplikasi Friendly Chat. Tenang saja kita sudah sedikan code
labnya jadi dari code lab ini kita akan kembangkan dengan menggunakan fitur-fitur yang ada di
firebase. Disini kita akan mengimplementasikan aplikasi chat client dan dapat digunakan untuk
memonitor performance menggunakan firebase.
Yang pakai linux atau Mac OS bisa langsung ketik melalui terminal
$ git clone [Link]
3
Receiving objects: 100% (1671/1671), 843.56 KiB | 140.00 KiB/s, done.
Resolving deltas: 100% (765/765), done.
Checking connectivity... done.
Aguss-MacBook-Pro:firebase agus$
Kalau belum install git. Bisa download langung disini [Link] klik
tombol Clone or Download
Jika berhasil maka akan terlihat direktory friendlychat yang didalamnya ada dua directory khusus
android.
4
Pilih Klik Don’t remind me again for this project dan Add root maka projectnya akan terbuka
5
Buat project di Firebase Console
4. Buat project di Firebase Console untuk itu anda harus login dengan email gmail.
6
Klik CREATE PROJECT Maka secara otomatis project akan terbuat
Hasilnya
7
Alias name: androiddebugkey
Creation date: Mar 19, 2015
Entry type: PrivateKeyEntry
Certificate chain length: 1
Certificate[1]:
Owner: CN=Android Debug, O=Android, C=US
Issuer: CN=Android Debug, O=Android, C=US
Serial number: 269f9b45
Valid from: Thu Mar 19 07:54:20 WIB 2015 until: Sat Mar 11 07:54:20 WIB 2045
Certificate fingerprints:
MD5: 2A:19:B3:B8:09:F1:10:EC:D2:71:CD:DB:D1:2A:D1:41
SHA1: 4F:64:87:92:16:74:B5:7D:70:D1:F0:DE:70:12:48:5E:7A:22:94:32
SHA256: 7E:3E:45:AE:78:B8:E3:E9:75:F1:A6:20:0F:9D:D5:36:AB:18:63:00:43:98:44:57:8E:B4:04:51:62:F1:73:E1
Signature algorithm name: SHA256withRSA
Version: 3
8
- Copy [Link] yang terdownload otomatis ke project kita letaknya seperti diatas yaitu
pada directory app
9
Kita harus tambahkan konfigurasi diatas pada script gradle kita. Tapi tenang di source codelab ini
sudah ditambahkan jadi kita tidak perlu menambahkannya lagi. Silahkan dilihat di codenya
10
Run Starter Aplikasi
5. Saatnya untuk me Run App ini. Hasilnya masih belum ada message dalam list.
11
Enable Authentication
6. Enable Authentication.
Mari kita haruskan user untuk sign in agar dapat membaca atau mempost message di Friendly Chat
Akses Firebase Database lalu atur rulesnya dengan menggunakan format JSON.
Masuk ke Firebase Console, pilih Database lalu piih tab Rules maka akan terlihat seperti ini.
12
Konfigurasi Authentication APIs
Sebelum aplikasimu dapat mengakses Firebase Authentication APIs berdasarkan usermu, kamu
harus mengenablenya.
Caranya Masuk ke Firebase Console lalu pilih Auth lalu pilih Sign In Method lalu Set Enable
pada baris Google dengan cara klik baris tersebut lalu pada Jendela dialog Google pilih Enable lalu
klik Save
13
14
Add Firebase Auth dependency
Untuk menambahkan kode firebase-auth ke project kita terlebih dulu kita harus menambahkan
library firebase auth ke dependency pada file app/[Link]
app/[Link]
compile '[Link]:firebase-auth:9.2.1'
Tapi tenang saja ternyata ini juga sudah ada dicodelab kita jadi tidak perlu menambahkannya.
15
private FirebaseUser mFirebaseUser;
Masih pada [Link] tambahkan script agar user ke layar sign-in apabila mereka buak
aplikasi tetapi belum melakukan autentikasi.
Kemudian pada method onOptionsItemSelected() tambahkan case untuk menangani Sign out
Button
[Link]
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch ([Link]()) {
case [Link].sign_out_menu:
[Link]();
[Link](mGoogleApiClient);
mUsername = ANONYMOUS;
startActivity(new Intent(this, [Link]));
return true;
default:
return [Link](item);
}
}
16
Sekarang kita sudah punya semua logika yang tepat untuk mengirim user ke Layar Sign-In ketika
diperlukan. Selanjutnya kita harus menambahkan script untuk autetukasi user di layar Sign-In
Selanjutnya, Inisialisasi sugning in dengan Google. Update SignInActivity’s onClick method agar
terlihat seperti ini
[Link]
@Override
public void onClick(View v) {
switch ([Link]()) {
case [Link].sign_in_button:
signIn();
break;
}
}
Tambahkan methid signIn yang akan membuat user sign in dengan Goggle Sign In UI.
[Link]
/private void signIn() {
Intent signInIntent = [Link](mGoogleApiClient);
startActivityForResult(signInIntent, RC_SIGN_IN);
}
Selanjutnya, tangani hasil kembalian dari Google Sign In, tambahkan method onActivityResult
untuk menangani hasil signin. Ketika hasilnya sukses, maka account digunakan untuk autentikasi ke
firebase.
[Link]
@Override
17
public void onActivityResult(int requestCode, int resultCode, Intent data) {
[Link](requestCode, resultCode, data);
18
startActivity(new Intent([Link],
[Link]));
finish();
}
}
});
}
Itu saja ! Kita telah megimplementasikan autentikasi ke firebase dengan menggunakan Google
Account tanpa harus menangani konfigurasi di sisi server
Test Aplikasi.
Run aplikasinya. Maka kita akan langsung ke layar SignIn. Sentuh button Google Sign In. jika
sukses maka kita akan pindah ke layar chat message.
19
20
Note: Aksi Import ini akan mereplace semua data yang ada pada database
Setelah berhasil diimport maka datanya pada database akan sepeti ini.
21
- Add Firebase Realtime Database dependency
Pada blok dependecies di file app/[Link] tambahkan library untuk firebase database. Tapi
tenang saja di sourcecode kita sudah ada jadi tidak perlu menambahkannya.
compile '[Link]:firebase-database:9.2.1'
- Synchronize messages
tambagkan code untuk synkronisasi messages yang baru ditambahkan ke Applikasi.
Inisialisasi Firebase Realtime Database dan tambahkan sebuah listener untuk menangani perubahan
data. Update RecyclerView adapter untuk menampilkan pesan baru.
[Link]
// Firebase instance variables
22
mFirebaseAdapter;
[Link]
// New child entries
mFirebaseDatabaseReference = [Link]().getReference();
mFirebaseAdapter = new FirebaseRecyclerAdapter<FriendlyMessage,
MessageViewHolder>(
[Link],
[Link].item_message,
[Link],
[Link](MESSAGES_CHILD)) {
@Override
protected void populateViewHolder(MessageViewHolder viewHolder,
FriendlyMessage friendlyMessage, int position) {
[Link]([Link]);
[Link]([Link]());
[Link]([Link]());
if ([Link]() == null) {
[Link]
.setImageDrawable(ContextCompat
.getDrawable([Link],
[Link].ic_account_circle_black_36dp));
} else {
[Link]([Link])
.load([Link]())
.into([Link]);
}
}
};
[Link](new [Link]() {
@Override
public void onItemRangeInserted(int positionStart, int itemCount) {
[Link](positionStart, itemCount);
int friendlyMessageCount = [Link]();
23
int lastVisiblePosition =
[Link]();
// If the recycler view is initially being loaded or the
// user is at the bottom of the list, scroll to the bottom
// of the list to show the newly added message.
if (lastVisiblePosition == -1 ||
(positionStart >= (friendlyMessageCount - 1) &&
lastVisiblePosition == (positionStart - 1))) {
[Link](positionStart);
}
}
});
[Link](mLinearLayoutManager);
[Link](mFirebaseAdapter);
24
2. Tambahkan message baru langsung di Firebase Databse Console. Pastikan pesan barunya muncul
di Aplikasi kita (Friendly-Chat UI).
25
Keren Datanya langsung tampil di Aplikasi. Amazing. Coba kalau kita coding sendiri untuk sisi
servernya apakah bisa sesimple ini. Inilah salah satu kedahsyatan Firebase.
Send Messages
8. Send Messages
Implement message sending
Pada bagian ini, kita kan menambahkan kemampuan aplikasi kita agar user bisa kirim message dari
aplikasinya. Code snipped dibawah ini dipasang listener untuk events klik pada button send, yang
membuat objek FriendlyMessage baru dengan isi yang ada pada field message, dan mendorong
message ke database. push() method menambahkan sebuah ID yang digenerate secara otomatis
untuk disimpan pada bagian objek. ID ini sifatnya sequential yang mana menjamin bahwa message
baru akan ditambahkan pada bagian akhir dari list.
Update method onClick pada mSendButton didalam method onCreate class MainActivity.
26
[Link]
mSendButton = (Button) findViewById([Link]);
[Link](new [Link]() {
@Override
public void onClick(View view) {
FriendlyMessage friendlyMessage = new
FriendlyMessage([Link]().toString(),
mUsername,
mPhotoUrl);
[Link](MESSAGES_CHILD)
.push().setValue(friendlyMessage);
[Link]("");
}
});
27
Wow amazing langsung tampil messagenya dengan nama saya.
Sekarang mari kita lihat didatabasenya. Di database juga langsung ada datanya tanpa merefresh
browser, benar-benar Real Time
28
29
Receive Reengagement Notifcations
9. Receive Reengagement Notifcations
Kita dapat menggunakan Firebase Cloud Messaging (FCM) untuk mengirim notifikasi ke user
aplikasi kita. Pada bagian ini kita akan mengkonfigurasi aplikasi agar dapt menerima notifikasi
yang dikirim dari Firebase Console.
app/[Link]
compile '[Link]:firebase-messaging:9.2.1'
30
Add FCM Services
class RegistrationIntentService adalah background services yang digunakan untuk mendapatkan
token instanceID yang merupakan identifikasi aplikasi ke FCM server. Juga subscribes ke topic
yang digunakan untuk mengirim notifikasi re-engagement (via topic messaging )
class MyFirebaseMessagingService akan menjadi backkground service yang menangani incoming
FCM messages
Update untuk extend FirebaseMessagingService yang disediakan oleh library firebase-fcm yang
sudah kita tambahkan sebelumnya. Ini secara otomatis menangani notifikasi messages, yang mana
messagges server itu secara spesisk seharusnya menghasilkan notifikasi. Untuk menangani data
messages (yang dilewatkan secara diam-diam ke aplikasi tanpa membuat notifikasi) kia bisa meng
override method onMessageReceived dari class FirebaseMessagingService
[Link]
public class MyFirebaseMessagingService extends FirebaseMessagingService {
@Override
public void onMessageReceived(RemoteMessage remoteMessage) {
// Handle data payload of FCM messages.
Log.d(TAG, "FCM Message Id: " + [Link]());
Log.d(TAG, "FCM Notification Message: " +
[Link]());
Log.d(TAG, "FCM Data Message: " + [Link]());
}
}
class MyFirebaseIntentServices akan menjadi service yang digunakan untuk mengani FCM logic.
Service ini digunakan untuk mengalert aplikasi ketika sebuah InstanceID token baru tergenerate.
Rubah class tersebut untuk extend FirebaseInstanceIdService dan overrid method onTokenRefresh
untuk subscribe ke topic. Gunakan kode berikut untuk mengupdtae method onTokenRefresh di class
MyFirebaseInstanceIdService agar terlihat seperti ini
MyInstanceIDListenerService
public class MyFirebaseInstanceIdService extends FirebaseInstanceIdService {
/**
31
* The Application's current Instance ID token is no longer valid
* and thus a new one must be requested.
*/
@Override
public void onTokenRefresh() {
// If you need to handle the generation of a token, initially or
// after a refresh this is where you should do that.
String token = [Link]().getToken();
Log.d(TAG, "FCM Token: " + token);
[Link]
<service
android:name=".MyFirebaseMessagingService"
android:exported="false">
<intent-filter>
<action android:name="[Link].MESSAGING_EVENT" />
</intent-filter>
</service>
<service
android:name=".MyFirebaseInstanceIdService"
android:exported="false">
<intent-filter>
<action android:name="[Link].INSTANCE_ID_EVENT" />
</intent-filter>
</service>
32
3. Gunakan Firebase Console untuk mengirim notifikasi
33
34
4. pastikan message diterima dan notifikasi muncul pada device.
35
Wow keren. Messagenya sampai ke device android kita.
36
Pada bagian Remote Config klik Add Parameter. Set Parameter key dengan friendly_msg_length
dan Default Value dengan 10. lalu klik ADD PARAMETER selanjutnya klik PUBLISH
CHANGES
37
Add Firebase Remote Config dependency
Untuk memanfaatkan fitur ini kita perlu menambahkan library firbase-config ke app/[Link].
Tetapi ternyata ini juga sudah ditambahkan di sorurce code lab kita.
app/[Link]
compile '[Link]:firebase-messaging:9.2.1'
[Link]
/// Initialize Firebase Remote Config.
mFirebaseRemoteConfig = [Link]();
38
.build();
// Define default config values. Defaults are used when fetched config values are not
// available. Eg: if an error occurred fetching values from the server.
Map<String, Object> defaultConfigMap = new HashMap<>();
[Link]("friendly_msg_length", 10L);
[Link]
// Fetch the config to determine the allowed length of messages.
39
public void onFailure(@NonNull Exception e) {
// There has been an error fetching the config
Log.w(TAG, "Error fetching config: " +
[Link]());
applyRetrievedLengthLimit();
}
});
}
/**
* Apply retrieved length limit to edit text field.
* This result may be fresh from the server or it may be from cached
* values.
*/
private void applyRetrievedLengthLimit() {
Long friendly_msg_length =
[Link]("friendly_msg_length");
[Link](new InputFilter[]{new
[Link](friendly_msg_length.intValue())});
Log.d(TAG, "FML is: " + friendly_msg_length);
}
[Link]
@Override
switch ([Link]()) {
case [Link].fresh_config_menu:
fetchConfig();
return true;
case [Link].sign_out_menu:
[Link]();
mUsername = ANONYMOUS;
startActivity(new Intent(this, [Link]));
return true;
default:
return [Link](item);
}
40
}
41
Luar biasa benar-benar tidak perlu rubah source code dan publish apk baru.
42
Send Install Invites
11. Send Install Invites
AppInvite Firebase menyediakan fungsi untuk Menginvite User mendownload aplikasi melalui
email dan SMS
app/[Link]
compile '[Link]:play-services-appinvite:9.2.1'
Setup GoogleApiClient
Ubah class MainActivity agar mengimplement interface
[Link] rubah seperti dbawah ini
[Link]
[Link]
@Override
public void onConnectionFailed(ConnectionResult connectionResult) {
Log.d(TAG, "onConnectionFailed:" + connectionResult);
}
43
Send invitations
Tambahkan method sendInvitation lalu buat intent yang bisa digunakn untuk mengirim invitation.
Tangani kembalian hasilnya apakah invitation terkirim atau sukses pada method onActivityResult
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
if (requestCode == REQUEST_INVITE) {
if (resultCode == RESULT_OK) {
// Check how many invitations were sent.
String[] ids = AppInviteInvitation
.getInvitationIds(resultCode, data);
Log.d(TAG, "Invitations sent: " + [Link]);
} else {
// Sending failed or it was canceled, show failure message to
// the user
Log.d(TAG, "Failed to send invitation.");
}
}
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch ([Link]()) {
44
case [Link].invite_menu:
sendInvitation();
return true;
case [Link].fresh_config_menu:
fetchConfig();
return true;
case [Link].sign_out_menu:
[Link]();
mUsername = ANONYMOUS;
startActivity(new Intent(this, [Link]));
return true;
default:
return [Link](item);
}
}
app/[Link]
compile '[Link]:firebase-analytics:9.2.1'
Inisialisasi Analytics
Tambahkan FirebaseAnalytics innstance variable ke class MainActivity
45
[Link]
mFirebaseAnalytics = [Link](this);
Pada MainActivity log inviting events pada callback onActivityResult. Rubahlah isi dalam method
onActivityResult menjadi seperti dibawah ini. Kita dapat melihat dalam setiap kasus kita kirim
sebuah SHARE event tetapi dengan parameter yang berbeda untuk sukses dan gagal.
[Link]
@Override
if (requestCode == REQUEST_INVITE) {
if (resultCode == RESULT_OK) {
Bundle payload = new Bundle();
[Link]([Link], "sent");
[Link]([Link],
payload);
// Check how many invitations were sent and log.
String[] ids = [Link](resultCode,
data);
Log.d(TAG, "Invitations sent: " + [Link]);
} else {
Bundle payload = new Bundle();
[Link]([Link], "not sent");
[Link]([Link],
payload);
// Sending failed or it was canceled, show failure message to
// the user
Log.d(TAG, "Failed to send invitation.");
}
}
}
Setiap events yang kita log ke Firebase Analytics akan disummarykan dan akan terlihat pada
Firebase console dalam 24 jam.
46
Monetize With Ads
13. Monetize with Ads
Admob memberikan kita kemudahan dalam memonetisasi aplikasi kita, kita dapat menggunakan
komponen AdView dan Google akan menampilkan iklannya untuk anda.
app/[Link]
compile '[Link]:play-services-ads:9.2.1'
activity_main.xml
<RelativeLayout
xmlns:android="[Link]
xmlns:tools="[Link]
xmlns:ads="[Link]
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
47
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="[Link]">
48
activity_main.xml
compile '[Link]:play-services-ads:9.2.1'
[Link]
private AdView mAdView;
Request Ad
Pada MainActivity didalam method onCreate permintaan untuk menampilkan iklan di adView.
[Link]
mAdView = (AdView) findViewById([Link]);
AdRequest adRequest = new [Link]().build();
[Link](adRequest);
[Link]
@Override
49
}
Test AdMob.
1. Run Aplikasi
2. Lihat Apakah iklannya berhasil ditampilkan.
Report Crashes
14. Report Crashes
Firebase Crash mengijinkan aplikasi kita untuk melaporkan ketika terjadi crash dan mencatat event
penyebab terjadinya.
50
Tambahkan Firebase Crash dependency
Untuk memanfaatkan fitur ini kita perlu menambahkan firebase-crash ke app/[Link]. Tetapi
ternyata ini juga sudah ditambahkan di sorurce code lab kita.
app/[Link]
compile '[Link]:firebase-crash:9.2.1'
Inisialisasi Crash
Tambahkan handler Untuk Click yang menyebabkan aplikasi crash pada item menu. Rubah method
onOptionsItemSelected pada MainActivity sehingga terlihat seperti dibawah ini
[Link]
@Override
51
Summary
Firebase dengan kemampuan yang sudah kita coba berdasarkan tutorial diatas membuat kita sebagai
developer android optimis bisa membuat aplikasi yang besar, cetar dan membahana. Salah satu
beban biaya terbesar untuk infrastruktur mendevelop aplikasi yang besar dalam hal ini bisa
menghandle banyak user dan mempunyai preformance yang baik itu adalah pekerjaan disisi
Backend. Dan Firebase bisa menjadi salah satu solusi untuk membantu urusan Backend. Firebase
juga tidak hanya android saja, untuk IOS dan Web juga bisa. Untuk tahu lebih jauh bisa berkunjung
langsung ke website [Link]
Di Indonesia juga sudah ada situs yang bagus untuk para developer yaitu [Link] disini
banyak materi pelajaran dari android sampai unity dan kawan-kawan bisa mendapatkan point dari
tantangan (Chalenge) yang ada, dimana pointnya bisa ditukar dengan hadiah yang ada di dicoding.
Disini juga banyak acara-acara seminar dan workshop yang bagus.
52
Referensi
1. [Link]
Lain-lain
Tahun 2017 sudah tinggal sebentar lagi dan Pemerintah Indonesia juga sudah mengeluarkan libur
resmi dan cuti bersama tahun 2017.
Tidak perlu tunggu bulan desember Anda bisa mendapatkan Kalender Indonesia lengkap dengan
hari libur dan cuti bersama tahun 2017 dan bonus jadwal liga sepak bola top eropa. Anda bisa
download Aplikasinya disini [Link]
53