Kenalan dengan Firebase(Firebase Android Codelab)

Diterjemahkanoleh

Agus Haryantohttp://agusharyanto.net

1

Daftar IsiPendahuluan......................................................................................................................................... 3Import Project android-start................................................................................................................. 4Buat project di Firebase Console..........................................................................................................6Run Starter Aplikasi............................................................................................................................11Enable Authentication........................................................................................................................ 12Konfigurasi Authentication APIs........................................................................................................13Activate Firebase Realtime Database................................................................................................. 19Send Messages....................................................................................................................................26Receive Reengagement Notifcations..................................................................................................30Remotely Configure Friendly Message Length................................................................................. 36Send Install Invites............................................................................................................................. 43Track User Flows................................................................................................................................45Monetize With Ads............................................................................................................................. 47Report Crashes....................................................................................................................................50Summary.............................................................................................................................................52Referensi.............................................................................................................................................53Lain-lain............................................................................................................................................. 53

2

PendahuluanSalah 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 https://codelabs.developers.google.com/codelabs/firebase-android/#0

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.

Apa yang akan kita pelajari.1. Mengijinkan user untuk Sign in2. Sync data dengan menggunakan Firebase Realtime Database3. Menerima message secara background dengan Firebase Notifictions4. Mengkonfigure config Aplikasi dengan menggunakan Firebase Remote Config5. Track Flow penggunaan aplikasi dengan Firebase Analytics6. Mengijinkan pengguna untuk mengirim undangan untuk menginstall dengan Firebase Invites7. Menampilkan iklan dengan AdMob.8. Menampilkan Laporan Kesalahan Aplikasi dengan Firebase Crash Reporting9. Test Aplikasi mu dengan Firebase Test Lab.

Apa yang kita butuhkan.1. Adroid studio version 2.02. sample code3. A test device dengan Android 2.3 dan Google Play Services 9.0 atau versi yang lebih baru.4. Kabel data.

Sekarang mari kita mulai langkahnyaDapatkan / Download source codelabnya.

Yang pakai linux atau Mac OS bisa langsung ketik melalui terminal$ git clone https://github.com/firebase/friendlychat

Lalu enter maka akan menkloning sourcenya dari github ke komputerkita Aguss-MacBook-Pro:firebase agus$ git clone https://github.com/firebase/friendlychatCloning into 'friendlychat'...remote: Counting objects: 1671, done.remote: Compressing objects: 100% (9/9), done.remote: Total 1671 (delta 0), reused 0 (delta 0), pack-reused 1657

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 https://github.com/firebase/friendlychat klik tombol Clone or DownloadJika berhasil maka akan terlihat direktory friendlychat yang didalamnya ada dua directory khusus android.

android-start Code awal untuk belajar firebase

android Code lengkap hasil belajar firebase

Import Project android-start2. Selanjutnya kita mulai dengan mengopen project android-start dengan android studio.

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.

Klik Create New Project, berinama dengan “FriendlyChat”

6

Klik CREATE PROJECT Maka secara otomatis project akan terbuat

- Klik Add Firebase to your Android app- pada package name “com.google.firebase.codelab.friendlychat”- Isi Sha1 caranya dari terminal ketikkan keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore -list -v

-storepass android

Hasilnya

[Aguss-MacBook-Pro:firebase agus$ keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore -list -v -storepass android

7

Alias name: androiddebugkeyCreation date: Mar 19, 2015Entry type: PrivateKeyEntryCertificate chain length: 1Certificate[1]:Owner: CN=Android Debug, O=Android, C=USIssuer: CN=Android Debug, O=Android, C=USSerial number: 269f9b45Valid from: Thu Mar 19 07:54:20 WIB 2015 until: Sat Mar 11 07:54:20 WIB 2045Certificate 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

- Klik ADD APP

8

- Copy google-services.json yang terdownload otomatis ke project kita letaknya seperti diatas yaitu pada directory app

- Kembali ke jendela console klik continue

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 Aplikasi5. Saatnya untuk me Run App ini. Hasilnya masih belum ada message dalam list.

11

Enable Authentication6. 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 APIsSebelum 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 laluklik 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/build.gradle

app/build.gradlecompile 'com.google.firebase:firebase-auth:9.2.1'

Tapi tenang saja ternyata ini juga sudah ada dicodelab kita jadi tidak perlu menambahkannya.

- Edit class MainActivity lalu tambahkan Auth instance Variables

MainActivity.java (instance variable)// Firebase instance variables

private FirebaseAuth mFirebaseAuth;

15

private FirebaseUser mFirebaseUser;

Check for current user

Masih pada MainActivity.java tambahkan script agar user ke layar sign-in apabila mereka buak aplikasi tetapi belum melakukan autentikasi.

Pada method onCreate setelah mUsername diinisialiasi tambahkan script berikutMainActivity.java// Initialize Firebase Auth

mFirebaseAuth = FirebaseAuth.getInstance();

mFirebaseUser = mFirebaseAuth.getCurrentUser();

if (mFirebaseUser == null) {

// Not signed in, launch the Sign In activity

startActivity(new Intent(this, SignInActivity.class));

finish();

return;

} else {

mUsername = mFirebaseUser.getDisplayName();

if (mFirebaseUser.getPhotoUrl() != null) {

mPhotoUrl = mFirebaseUser.getPhotoUrl().toString();

}

}

Kemudian pada method onOptionsItemSelected() tambahkan case untuk menangani Sign out Button

MainActivity.java @Override

public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case R.id.sign_out_menu:

mFirebaseAuth.signOut();

Auth.GoogleSignInApi.signOut(mGoogleApiClient);

mUsername = ANONYMOUS;

startActivity(new Intent(this, SignInActivity.class));

return true;

default:

return super.onOptionsItemSelected(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

Implement the Sign-In screenBuka file SignInActivity.java . Disini ada sebuah buttin Sign-In yang digunakan untuk menginisialisasi autentikasi, Pada langkah ini kita implement logic sign in ke Firebase dengan Menggunakan Google Acccount.

Tambahkan Auth instance variables pada class SignInActivitySignInActivity.java// Firebase instance variables

private FirebaseAuth mFirebaseAuth;

Kemudian pada method onCreate () tambahkan script untuk inisiliasi FirebaseSignInActivity.java// Initialize FirebaseAuth

mFirebaseAuth = FirebaseAuth.getInstance();

Selanjutnya, Inisialisasi sugning in dengan Google. Update SignInActivity’s onClick method agar terlihat seperti iniSignInActivity.java@Override

public void onClick(View v) {

switch (v.getId()) {

case R.id.sign_in_button:

signIn();

break;

}

}

Tambahkan methid signIn yang akan membuat user sign in dengan Goggle Sign In UI.

SignInActivity.java/private void signIn() {

Intent signInIntent = Auth.GoogleSignInApi.getSignInIntent(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 kefirebase.

SignInActivity.java@Override

17

public void onActivityResult(int requestCode, int resultCode, Intent data) {

super.onActivityResult(requestCode, resultCode, data);

// Result returned from launching the Intent from

GoogleSignInApi.getSignInIntent(...);

if (requestCode == RC_SIGN_IN) {

GoogleSignInResult result =

Auth.GoogleSignInApi.getSignInResultFromIntent(data);

if (result.isSuccess()) {

// Google Sign In was successful, authenticate with Firebase

GoogleSignInAccount account = result.getSignInAccount();

firebaseAuthWithGoogle(account);

} else {

// Google Sign In failed

Log.e(TAG, "Google Sign In failed.");

}

}

}

Tambahkan method firebaseAuthWithGoogle untuk autentikasi dengan Google AccountSignInActivity.javaprivate void firebaseAuthWithGoogle(GoogleSignInAccount acct) {

Log.d(TAG, "firebaseAuthWithGooogle:" + acct.getId());

AuthCredential credential = GoogleAuthProvider.getCredential(acct.getIdToken(),

null);

mFirebaseAuth.signInWithCredential(credential)

.addOnCompleteListener(this, new OnCompleteListener<AuthResult>() {

@Override

public void onComplete(@NonNull Task<AuthResult> task) {

Log.d(TAG, "signInWithCredential:onComplete:" +

task.isSuccessful());

// If sign in fails, display a message to the user. If sign in

succeeds

// the auth state listener will be notified and logic to

handle the

// signed in user can be handled in the listener.

if (!task.isSuccessful()) {

Log.w(TAG, "signInWithCredential", task.getException());

Toast.makeText(SignInActivity.this, "Authentication

failed.",

Toast.LENGTH_SHORT).show();

} else {

18

startActivity(new Intent(SignInActivity.this,

MainActivity.class));

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.

Activate Firebase Realtime Database7.Activate Firebase Realtime DatabaseImport Messages ke database

1. Pada Firebase console pilih database2. Pada menu di database pilih Import JSON3. Browse ke file initial_message.json yang ada root directory FriendlyChat, kli file tersebut4. Click Import

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 dependencyPada blok dependecies di file app/build.gradle tambahkan library untuk firebase database. Tapi tenang saja di sourcecode kita sudah ada jadi tidak perlu menambahkannya.compile 'com.google.firebase:firebase-database:9.2.1'

- Synchronize messagestambagkan 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. tambahkan sebuah Database instance variables pada class MainActivity

MainActivity.java// Firebase instance variables

private DatabaseReference mFirebaseDatabaseReference;

private FirebaseRecyclerAdapter<FriendlyMessage, MessageViewHolder>

22

mFirebaseAdapter;

Pada class MainActivity edit method onCreate, ganti mProgressBar.setVisibility(ProgressBar.INVISIBLE);dengan code dibawah ini. Code ini akan menambahkan semua pesan kemudian memonitor pakah ada message baru pada Firebase Relatime Database. Ini menambahkan semua elemen ke UI untuk setiap message.

MainActivity.java// New child entries

mFirebaseDatabaseReference = FirebaseDatabase.getInstance().getReference();

mFirebaseAdapter = new FirebaseRecyclerAdapter<FriendlyMessage,

MessageViewHolder>(

FriendlyMessage.class,

R.layout.item_message,

MessageViewHolder.class,

mFirebaseDatabaseReference.child(MESSAGES_CHILD)) {

@Override

protected void populateViewHolder(MessageViewHolder viewHolder,

FriendlyMessage friendlyMessage, int position) {

mProgressBar.setVisibility(ProgressBar.INVISIBLE);

viewHolder.messageTextView.setText(friendlyMessage.getText());

viewHolder.messengerTextView.setText(friendlyMessage.getName());

if (friendlyMessage.getPhotoUrl() == null) {

viewHolder.messengerImageView

.setImageDrawable(ContextCompat

.getDrawable(MainActivity.this,

R.drawable.ic_account_circle_black_36dp));

} else {

Glide.with(MainActivity.this)

.load(friendlyMessage.getPhotoUrl())

.into(viewHolder.messengerImageView);

}

}

};

mFirebaseAdapter.registerAdapterDataObserver(new RecyclerView.AdapterDataObserver() {

@Override

public void onItemRangeInserted(int positionStart, int itemCount) {

super.onItemRangeInserted(positionStart, itemCount);

int friendlyMessageCount = mFirebaseAdapter.getItemCount();

23

int lastVisiblePosition =

mLinearLayoutManager.findLastCompletelyVisibleItemPosition();

// 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))) {

mMessageRecyclerView.scrollToPosition(positionStart);

}

}

});

mMessageRecyclerView.setLayoutManager(mLinearLayoutManager);

mMessageRecyclerView.setAdapter(mFirebaseAdapter);

Test message sync1. click Run, Jika semua lancar maka semua message yang ada pada database akan terlihat

24

2. Tambahkan message baru langsung di Firebase Databse Console. Pastikan pesan barunya munculdi Aplikasi kita (Friendly-Chat UI).

Cara menambahkan message baru di database.- Pada bagian Databse di Firebase Console, Data tab, pilih tanda ‘+’ pada elemen messages.- Buat elemen baru dengan nama -ABCD- klik tanda ‘+’ pada elemen -ABCD- Pada elemen baru isi Name dengan name dan Value dengan Marry- klik tanda ‘+’ pada elemen -ABCD- Pada elemen baru isi Name dengan text dan Value dengan hello- klik Add

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 Messages8. Send MessagesImplement 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

MainActivity.javamSendButton = (Button) findViewById(R.id.sendButton);

mSendButton.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

FriendlyMessage friendlyMessage = new

FriendlyMessage(mMessageEditText.getText().toString(),

mUsername,

mPhotoUrl);

mFirebaseDatabaseReference.child(MESSAGES_CHILD)

.push().setValue(friendlyMessage);

mMessageEditText.setText("");

}

});

Test Sending Messages.1. Click Run2. Isi field message dengan ‘Indonesia’ lalu klik button send. Lihat hasilnya

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 Notifcations9. Receive Reengagement NotifcationsKita 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.

Add FCM dependencyAgar bisa menggunakan FCM seperti biasa kita harus menambahkan library FCM ini ke file app/build.gradle. Tetapi ternyata pada source project kita ini sudah ditambahkan. Jadi kita tidak perlu menambahkannya.

app/build.gradlecompile 'com.google.firebase:firebase-messaging:9.2.1'

30

Add FCM Servicesclass 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

MyFirebaseMessagingService.javapublic class MyFirebaseMessagingService extends FirebaseMessagingService {

private static final String TAG = "MyFMService";

@Override

public void onMessageReceived(RemoteMessage remoteMessage) {

// Handle data payload of FCM messages.

Log.d(TAG, "FCM Message Id: " + remoteMessage.getMessageId());

Log.d(TAG, "FCM Notification Message: " +

remoteMessage.getNotification());

Log.d(TAG, "FCM Data Message: " + remoteMessage.getData());

}

}

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 classMyFirebaseInstanceIdService agar terlihat seperti ini

MyInstanceIDListenerServicepublic class MyFirebaseInstanceIdService extends FirebaseInstanceIdService {

private static final String TAG = "MyFirebaseIIDService";

private static final String FRIENDLY_ENGAGE_TOPIC = "friendly_engage";

/**

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 = FirebaseInstanceId.getInstance().getToken();

Log.d(TAG, "FCM Token: " + token);

// Once a token is generated, we subscribe to topic.

FirebaseMessaging.getInstance()

.subscribeToTopic(FRIENDLY_ENGAGE_TOPIC);

}

}

Tambahkan dekalarasi service untuk MyFirebaseListenerService dan MyInstanceIdListenerService. Tambahkan didalame element appclication pada AndroidManifest.xml

AndroidManifest.xml<service

android:name=".MyFirebaseMessagingService"

android:exported="false">

<intent-filter>

<action android:name="com.google.firebase.MESSAGING_EVENT" />

</intent-filter>

</service>

<service

android:name=".MyFirebaseInstanceIdService"

android:exported="false">

<intent-filter>

<action android:name="com.google.firebase.INSTANCE_ID_EVENT" />

</intent-filter>

</service>

Itu saja. Aplikasi kita sudah siap untuk menerima messages.

Test Background Notification1. Run Aplikasi2. Sentuh Home Button device android kita

32

3. Gunakan Firebase Console untuk mengirim notifikasi

- Pada Firebase Console klik Notifications- klik Send Your First Messages- isi text Message dengan “Friendly Chat?”- pilih app yang kita gunakan sebagai App Target- klik Send Message

33

34

4. pastikan message diterima dan notifikasi muncul pada device.

35

Wow keren. Messagenya sampai ke device android kita.

Remotely Configure Friendly Message Length10. Remotely Configure Friendly Message LengthFirebase Remote Config memungkinkan kita utuk melakukan perubahan config aplikasi secara remote. Jada kita tidak perlu merubah source dan membuat apk baru. Disini kita akan coba merubahpanjang maskimal karakter untuk kirim message di aplikasi kita. Dan ini kedepan akan banyak manfaatnya buat kita sebagai developer.Pada code lab kita panjang message dibatasi maksimal 9 karakter dan sekarang kita akan merubahnya melalui Firebase Console.

Add Config Rules in Firebase Console.

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 dependencyUntuk memanfaatkan fitur ini kita perlu menambahkan library firbase-config ke app/build.gradle. Tetapi ternyata ini juga sudah ditambahkan di sorurce code lab kita.

app/build.gradlecompile 'com.google.firebase:firebase-messaging:9.2.1'

Tambahkan Firebase Remote Config instance variable pada class MainActivity.

MainActivity.java (instance variable)// Firebase instance variables

private FirebaseRemoteConfig mFirebaseRemoteConfig;

Request dan Use config

Pada class MainActivity di method onCreate tambahkan code untuk menginisiliasi FirebaseRemoteConfig dan memnggil method fetchConfig. Tambahkan kode berikut dibawah inisiliasi Firebase Realtime Database.

MainActivity.java /// Initialize Firebase Remote Config.

mFirebaseRemoteConfig = FirebaseRemoteConfig.getInstance();

// Define Firebase Remote Config Settings.

FirebaseRemoteConfigSettings firebaseRemoteConfigSettings =

new FirebaseRemoteConfigSettings.Builder()

.setDeveloperModeEnabled(true)

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<>();

defaultConfigMap.put("friendly_msg_length", 10L);

// Apply config settings and default values.

mFirebaseRemoteConfig.setConfigSettings(firebaseRemoteConfigSettings);

mFirebaseRemoteConfig.setDefaults(defaultConfigMap);

// Fetch remote config.

fetchConfig();

Buat method fetchConfig dan applyRetrevedLengthLimit, method ini digunakan untuk mendapatkan data konfigurasi dari RemoteConfigAPI dan mengaktifkannya. Konfigurasi yang didapat akan menentukan panjang karakter maksimal yang dibolehkan pada isian message. Nilai defaultnya adalh 10, dan ini sudah kita set melalui Firebase Console

MainActivity.java // Fetch the config to determine the allowed length of messages.

public void fetchConfig() {

long cacheExpiration = 3600; // 1 hour in seconds

// If developer mode is enabled reduce cacheExpiration to 0 so that

// each fetch goes to the server. This should not be used in release

// builds.

if (mFirebaseRemoteConfig.getInfo().getConfigSettings()

.isDeveloperModeEnabled()) {

cacheExpiration = 0;

}

mFirebaseRemoteConfig.fetch(cacheExpiration)

.addOnSuccessListener(new OnSuccessListener<Void>() {

@Override

public void onSuccess(Void aVoid) {

// Make the fetched config available via

// FirebaseRemoteConfig get<type> calls.

mFirebaseRemoteConfig.activateFetched();

applyRetrievedLengthLimit();

}

})

.addOnFailureListener(new OnFailureListener() {

@Override

39

public void onFailure(@NonNull Exception e) {

// There has been an error fetching the config

Log.w(TAG, "Error fetching config: " +

e.getMessage());

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 =

mFirebaseRemoteConfig.getLong("friendly_msg_length");

mMessageEditText.setFilters(new InputFilter[]{new

InputFilter.LengthFilter(friendly_msg_length.intValue())});

Log.d(TAG, "FML is: " + friendly_msg_length);

}

Tambahkan juga pada method onOptionItemSelected untuk memanggil method fetchConfig

MainActivity.java@Override

public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case R.id.fresh_config_menu:

fetchConfig();

return true;

case R.id.sign_out_menu:

mFirebaseAuth.signOut();

mUsername = ANONYMOUS;

startActivity(new Intent(this, SignInActivity.class));

return true;

default:

return super.onOptionsItemSelected(item);

}

40

}

Test Remote Configure.1. Click Run2. Coba Ketik message seharusnya maksimal masih 10 karakter.3. Update Remote Config value pada Firbase Console rubah 10 jadi 15.4. Coba ketik message lagi seharusnya panjang maksimalnya sudah 15.

41

Luar biasa benar-benar tidak perlu rubah source code dan publish apk baru.

42

Send Install Invites11. Send Install InvitesAppInvite Firebase menyediakan fungsi untuk Menginvite User mendownload aplikasi melalui email dan SMS

Add Firebase AppInvite dependencyUntuk memanfaatkan fitur ini kita perlu menambahkan library firbase-appinvites ke app/build.gradle. Tetapi ternyata ini juga sudah ditambahkan di sorurce code lab kita.

app/build.gradlecompile 'com.google.android.gms:play-services-appinvite:9.2.1'

Setup GoogleApiClientUbah class MainActivity agar mengimplement interface GoogleApiClient.OnConnectionFailedListener rubah seperti dbawah iniMainActivity.java

public class MainActivity extends AppCompatActivity implements

GoogleApiClient.OnConnectionFailedListener {

Kita akan diharuskan mengimpelement method oConnectionFailed.

MainActivity.java

@Override

public void onConnectionFailed(ConnectionResult connectionResult) {

Log.d(TAG, "onConnectionFailed:" + connectionResult);

}

Tambahkan GoogleApiClient instance variable pada class MainActivity:

private GoogleApiClient mGoogleApiClient;

Inisialiasi mGoogleApiClient pada menthod onCreate di class MainActivity. AppInvites diinisialisasi dengan memanggil startActivityForResult, ini mengijinkan AppInvites UI untuk menangani pembuatan invitation kemudian mengembalikan status completenya dengan memanggil activity melalui method onActivityResult. Berikut kode inisialiasainya.

mGoogleApiClient = new GoogleApiClient.Builder(this).enableAutoManage(this, this).addApi(Auth.GOOGLE_SIGN_IN_API).addApi(AppInvite.API).build();

43

Send invitationsTambahkan method sendInvitation lalu buat intent yang bisa digunakn untuk mengirim invitation.

private void sendInvitation() {

Intent intent = new

AppInviteInvitation.IntentBuilder(getString(R.string.invitation_title))

.setMessage(getString(R.string.invitation_message))

.setCallToActionText(getString(R.string.invitation_cta))

.build();

startActivityForResult(intent, REQUEST_INVITE);

}

Tangani kembalian hasilnya apakah invitation terkirim atau sukses pada method onActivityResult

@Overrideprotected void onActivityResult(int requestCode, int resultCode, Intent data) {

super.onActivityResult(requestCode, resultCode, data);

Log.d(TAG, "onActivityResult: requestCode=" + requestCode +

", resultCode=" + resultCode);

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: " + ids.length);

} else {

// Sending failed or it was canceled, show failure message to

// the user

Log.d(TAG, "Failed to send invitation.");

}

}

}

Pada onOptionItemSelected Tambahkan kondisi untuk call ke method sendInvitation.

@Overridepublic boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

44

case R.id.invite_menu:

sendInvitation();

return true;

case R.id.fresh_config_menu:

fetchConfig();

return true;

case R.id.sign_out_menu:

mFirebaseAuth.signOut();

mUsername = ANONYMOUS;

startActivity(new Intent(this, SignInActivity.class));

return true;

default:

return super.onOptionsItemSelected(item);

}

}

Sekarang kita Test AppInvitenya.1. Run Aplikasi2. Dari menu dipojok kanan applikasi pilih Invite3. Anda akan melihat tampilan App Invites yang mengijinkan kita untuk memilih email dan SMS dan mengirim sebuah invitation. Anda harus pilih account penerima yang bisa anda cek apakah iinvitation masuk atau tidak. Ini agar kita dapat melihatnya ketika sebuah invitation terkirim.4. Tap send dan verify invitationnya terkirim ke contact yang sidah dipilih.5. cek pada contact yang kita kirimkan invitation apakah invitationnya terkirim.

Track User Flows12. Track User FlowsFirebase Analytics menyediakan jalan bagi untuk mengetahui tingkah laku user pada aplikasi kita, dimana mereka nyaman atau tidak dengan aplikasi kita. Ini dapat juga digunakan untuk mgetahui bagian aplikasi yang sering digunakan.

Add Firebase Analytics dependencyUntuk memanfaatkan fitur ini kita perlu menambahkan library firbase-analytics ke app/build.gradle.Tetapi ternyata ini juga sudah ditambahkan di sorurce code lab kita.

app/build.gradlecompile 'com.google.firebase:firebase-analytics:9.2.1'

Inisialisasi AnalyticsTambahkan FirebaseAnalytics innstance variable ke class MainActivity

45

MainActivity.java

mFirebaseAnalytics = FirebaseAnalytics.getInstance(this);

Kirim Custom EventsInisialisasi Firebase Analytics menyediakan beberapa standar matrix seperti app installs dan sesi lifecycle, jika kita ingin menambah custom events yang dapat membantu kita mengerti interaksi yang dilakukan user diaplikasi secara lebih detail. Untuk mengirim custom event dapat memanggil mFirebaseAnalytics.logEvent() dengan informasi tentang custome event.

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.

MainActivity.java

@Override

protected void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); Log.d(TAG, "onActivityResult: requestCode=" + requestCode + ", resultCode=" + resultCode);

if (requestCode == REQUEST_INVITE) { if (resultCode == RESULT_OK) { Bundle payload = new Bundle(); payload.putString(FirebaseAnalytics.Param.VALUE, "sent"); mFirebaseAnalytics.logEvent(FirebaseAnalytics.Event.SHARE, payload); // Check how many invitations were sent and log. String[] ids = AppInviteInvitation.getInvitationIds(resultCode, data); Log.d(TAG, "Invitations sent: " + ids.length); } else { Bundle payload = new Bundle(); payload.putString(FirebaseAnalytics.Param.VALUE, "not sent"); mFirebaseAnalytics.logEvent(FirebaseAnalytics.Event.SHARE, 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 Ads13. Monetize with AdsAdmob memberikan kita kemudahan dalam memonetisasi aplikasi kita, kita dapat menggunakan komponen AdView dan Google akan menampilkan iklannya untuk anda.

Add Admob dependencyUntuk memanfaatkan fitur ini kita perlu menambahkan play-services-ads ke app/build.gradle. Tetapi ternyata ini juga sudah ditambahkan di sorurce code lab kita.

app/build.gradlecompile 'com.google.android.gms:play-services-ads:9.2.1'

Tambahkan ads namespacetambahkan ads namespace dalam root tag RelativeLayout dalam activity_main.xml

activity_main.xml<RelativeLayout

xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:ads="http://schemas.android.com/apk/res-auto" 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="com.google.firebase.codelab.friendlychat.MainActivity">

Tambahkan adView ke main layout (acivity_main.xml)Tambahan adView ini akan berisi iklan. Untuk itu tambahkan adview tag pad root RelativeLayout. Sehingga lengkap isi activity_main.xml menjadi seperti ini.

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:ads="http://schemas.android.com/apk/res-auto" 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" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.google.firebase.codelab.friendlychat.MainActivity"> <com.google.android.gms.ads.AdView android:id="@+id/adView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_alignParentTop="true" ads:adSize="BANNER" ads:adUnitId="@string/banner_ad_unit_id"> </com.google.android.gms.ads.AdView> <android.support.v7.widget.RecyclerView android:id="@+id/messageRecyclerView" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@+id/adView" android:layout_above="@+id/linearLayout"/> <LinearLayout android:id="@+id/linearLayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_alignParentStart="true" android:orientation="horizontal"> <EditText android:id="@+id/messageEditText" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_weight="1"/> <Button android:id="@+id/sendButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom" android:enabled="false" android:text="SEND"/> </LinearLayout> <ProgressBar android:id="@+id/progressBar" style="?android:attr/progressBarStyleLarge" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true"/></RelativeLayout>

48

activity_main.xmlcompile 'com.google.android.gms:play-services-ads:9.2.1'

Add AdView variablePada MainActivity tambahk instance varibale untuk adView

MainActivity.javaprivate AdView mAdView;

Request AdPada MainActivity didalam method onCreate permintaan untuk menampilkan iklan di adView.

MainActivity.javamAdView = (AdView) findViewById(R.id.adView);AdRequest adRequest = new AdRequest.Builder().build();mAdView.loadAd(adRequest);

Tangani lifecycle eventsPada MainActivity, Bila diperlukan tambahkan Activity lifecycle event handling pada saat activity activity disembunyikan sementara (onPause), ditampilkan kembali (onResume) dan saat activity di tutup (onDestroy)

MainActivity.java@Override

public void onPause() { if (mAdView != null) { mAdView.pause(); } super.onPause();}

/** Called when returning to the activity */@Overridepublic void onResume() { super.onResume(); if (mAdView != null) { mAdView.resume(); }}

/** Called before the activity is destroyed */@Overridepublic void onDestroy() { if (mAdView != null) { mAdView.destroy(); } super.onDestroy();

49

}

Test AdMob.1. Run Aplikasi2. Lihat Apakah iklannya berhasil ditampilkan.

Report Crashes14. Report Crashes

Firebase Crash mengijinkan aplikasi kita untuk melaporkan ketika terjadi crash dan mencatat event penyebab terjadinya.

50

Tambahkan Firebase Crash dependencyUntuk memanfaatkan fitur ini kita perlu menambahkan firebase-crash ke app/build.gradle. Tetapi ternyata ini juga sudah ditambahkan di sorurce code lab kita.

app/build.gradlecompile 'com.google.firebase:firebase-crash:9.2.1'

Inisialisasi CrashTambahkan handler Untuk Click yang menyebabkan aplikasi crash pada item menu. Rubah method onOptionsItemSelected pada MainActivity sehingga terlihat seperti dibawah ini

MainActivity.java@Override

public boolean onOptionsItemSelected(MenuItem item) { switch (item.getItemId()) { case R.id.crash_menu: FirebaseCrash.logcat(Log.ERROR, TAG, "crash caused"); causeCrash(); return true; case R.id.invite_menu: sendInvitation(); return true; case R.id.fresh_config_menu: fetchConfig(); return true; case R.id.sign_out_menu: mFirebaseAuth.signOut(); mUsername = ANONYMOUS; startActivity(new Intent(this, SignInActivity.class)); return true; default: return super.onOptionsItemSelected(item); }}

Pada MainActivity tambahkan method causeCrash

private void causeCrash() {

throw new NullPointerException("Fake null pointer exception");}

Test Firebase Crash1. Run Aplikasi2. Klik menu item yang membuat aplikasi crash.3. Dari logcat cek apakah crash report sukses terkirim.

51

SummaryFirebase dengan kemampuan yang sudah kita coba berdasarkan tutorial diatas membuat kita sebagaideveloper android optimis bisa membuat aplikasi yang besar, cetar dan membahana. Salah satubeban biaya terbesar untuk infrastruktur mendevelop aplikasi yang besar dalam hal ini bisamenghandle banyak user dan mempunyai preformance yang baik itu adalah pekerjaan disisiBackend. Dan Firebase bisa menjadi salah satu solusi untuk membantu urusan Backend. Firebasejuga tidak hanya android saja, untuk IOS dan Web juga bisa. Untuk tahu lebih jauh bisa berkunjunglangsung ke website https://firebase.google.com/

Dan untuk para pemula developer android bisa belajar di website http://agusharyanto.net punya saya bisa juga ke webhttps://pratamawijaya.com/ punya Pratama Nur Wijayahttp://www.gookkis.com/ punya Heri Kiswanto

Di Indonesia juga sudah ada situs yang bagus untuk para developer yaitu http://dicoding.com disinibanyak materi pelajaran dari android sampai unity dan kawan-kawan bisa mendapatkan point daritantangan (Chalenge) yang ada, dimana pointnya bisa ditukar dengan hadiah yang ada di dicoding.Disini juga banyak acara-acara seminar dan workshop yang bagus.

52

Referensi1. https://firebase.google.com/

Lain-lainTahun 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 bisadownload Aplikasinya disini http://bit.ly/2bZglSY

53