BackendLESS Apps - how and why?

Slides of the talk given at AppBuilders CH 2017, in Lausanne, together with Matteo Bonifazi

Transcript

1. BACKENDLESS APPS HOW AND WHY
2. SPEAKERS ROBERTO ORGIU & MATTEO BONIFAZI We are actually there !
3. ENGAGEMENT & CONTENT
4. ENGAGEMENT & CONTENT
5. ENGAGEMENT > Who's your user > Users want new content
6. WHO’S YOUR USER
7. END-TO-END AUTHENTICATION SYSTEM ENGINEERING NIGHTMARE
8. 54% USERS WILL QUIT BEFORE DOING YET-ANOTHER-SIGNUP
9. TEMPORARY ANONYMOUS ACCOUNTS
10. ACCEPT ALL THE SYSTEMS
11. compile 'com.google.firebase:firebase-auth:10.2.1'
12. AUTHENTICATE ANONYMOUSLY mAuth.signInAnonymously() .addOnCompleteListener(this, new OnCompleteListener<AuthResult>() { @Override public void onComplete(@NonNull Task<AuthResult> task) { if (task.isSuccessful()) { // Sign in success, update UI with the signed-in user's information Log.d(TAG, "signInAnonymously:success"); FirebaseUser user = mAuth.getCurrentUser(); updateUI(user); } else { // If sign in fails, display a message to the user. Log.w(TAG, "signInAnonymously:failure", task.getException()); Toast.makeText(AnonymousAuthActivity.this, "Authentication failed.", Toast.LENGTH_SHORT).show(); updateUI(null); } // ... } });
13. EVERY ANONYMOUS USER IS TRACKED
14. LET'S LOGIN BY FACEBOOK PROVIDER // Initialize Facebook Login button mCallbackManager = CallbackManager.Factory.create(); facebookLoginButton.setReadPermissions("email", "public_profile"); facebookLoginButton.registerCallback(mCallbackManager, new FacebookCallback<LoginResult>() { @Override public void onSuccess(LoginResult loginResult) { Log.d(TAG, "facebook:onSuccess:" + loginResult); handleFacebookAccessToken(loginResult.getAccessToken()); } });
15. HANDLE THE TOKEN & SEND TO FIREBASE private void handleFacebookAccessToken(AccessToken token) { AuthCredential credential = FacebookAuthProvider.getCredential(token.getToken()); mAuth.signInWithCredential(credential) .addOnCompleteListener(this, new OnCompleteListener<AuthResult>() { @Override public void onComplete(@NonNull Task<AuthResult> task) { if (task.isSuccessful()) { // Sign in success, update UI with the signed-in user's information Log.d(TAG, "signInWithCredential:success"); FirebaseUser user = mAuth.getCurrentUser(); ... } else { // Signature failed somehow... } } }); }
16. FROM ANONYMOUS TO PERMANENT AuthCredential credential = FacebookAuthProvider.getCredential(token.getToken()); mAuth.getCurrentUser().linkWithCredential(credential) .addOnCompleteListener(this, new OnCompleteListener<AuthResult>() { @Override public void onComplete(@NonNull Task<AuthResult> task) { if (task.isSuccessful()) { FirebaseUser user = task.getResult().getUser(); } else { Log.w(TAG, "linkWithCredential:failure", task.getException()); ... } // ... } });
17. AFTER ALL WE WOULD LIKE TO SIGNOUT public void signOut() { //Signout from Firebase mAuth.signOut(); //Signout from the specif provider - Facebook in this case LoginManager.getInstance().logOut(); ... }
18. FIREBASE IS MORE POWERFUL WITH AUTH
19. USERS WANT NEW CONTENT
20. HOW DO WE RE-ENGAGE THEM?
21. PUSH NOTIFICATIONS
23. compile 'com.google.firebase:firebase-messaging:10.2.1'
24. IT JUST WORKS™ We might want more control
25. IMPLEMENTING PUSH MANAGEMENT Extend FirebaseMessagingService > Notifications in foreground apps > Receive data payload > Send upstream messages
26. IMPLEMENTING PUSH MANAGEMENT <service android:name=".PushService"> <intent-filter> <action android:name="com.google.firebase.MESSAGING_EVENT"/> </intent-filter> </service>
27. IMPLEMENTING PUSH MANAGEMENT class PushService : FirebaseMessagingService() { override fun onMessageReceived(remoteMessage: RemoteMessage) { ... } override fun onDeletedMessages() { ... } }
28. IMPLEMENTING PUSH MANAGEMENT App state Notification Data Both Foreground onMessageRece ived() onMessageRece ived() onMessageRece ived() Background System tray onMessageRece ived() system tray! > Notification in the system tray, Data in extras of the intent.
29. IMPLEMENTING TOKEN MANAGEMENT Extend FirebaseInstanceIdService > Handle token creation and rotation > Needed to target single device or group them
30. IMPLEMENTING TOKEN MANAGEMENT <service android:name=".TokenManagementService"> <intent-filter> <action android:name="com.google.firebase.INSTANCE_ID_EVENT"/> </intent-filter> </service>
31. IMPLEMENTING TOKEN MANAGEMENT class TokenManagementService : FirebaseInstanceIdService() { override fun onTokenRefresh() { val token = FirebaseInstanceId.getInstance().token } }
32. ENGAGEMENT & CONTENT
33. ENGAGEMENT & CONTENT
34. CONTENT > Data > Computation of the data
35. WHERE APPS STORE CONTENT?
36. CLOUD STORAGE
37. CDN IS NOT A PROBLEM ANYMORE
38. compile 'com.google.firebase:firebase-storage:10.2.1'
39. // Create a storage reference from our app StorageReference storageRef = storage.getReference(); // Create a reference to filename StorageReference mountainsRef = storageRef.child("pippo.jpg"); // Create a reference to 'images/pippo.jpg' StorageReference mountainImagesRef = storageRef.child("images/pippo.jpg");
40. UPLOAD THE FILE Uri file = Uri.fromFile(new File("path/to/images/simpaty.jpg")); StorageReference riversRef = storageRef.child("images/"+file.getLastPathSegment()); uploadTask = riversRef.putFile(file); // Register observers to listen for when the download is done or if it fails uploadTask.addOnFailureListener(new OnFailureListener() { @Override public void onFailure(@NonNull Exception exception) { // Handle unsuccessful uploads } }).addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() { @Override public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) { // taskSnapshot.getMetadata() contains file metadata such as size, content-type, and download URL. Uri downloadUrl = taskSnapshot.getDownloadUrl(); } });
41. DOWNLOAD THE FILE fileRef = storageRef.child("images/local.jpg"); File localFile = File.createTempFile("images", "jpg"); fileRef.getFile(localFile).addOnSuccessListener(new OnSuccessListener<FileDownloadTask.TaskSnapshot>() { @Override public void onSuccess(FileDownloadTask.TaskSnapshot taskSnapshot) { // Local temp file has been created } }).addOnFailureListener(new OnFailureListener() { @Override public void onFailure(@NonNull Exception exception) { // Handle any errors } });
42. MONITOR UPLOAD/DOWNLOAD TASK Task state Task action Listener Type Pause pause() OnPausedListener Failure/Cancel cancel() OnFailureListener Resume resume() OnProgressListener Success -- OnSuccessListener
43. BUT WHERE IS MY BACK END?
44. REALTIME IS EVERYTHING
45. compile 'com.google.firebase:firebase-database:10.2.1'
46. WRITE TO YOUR DATABASE // Write a message to the database FirebaseDatabase database = FirebaseDatabase.getInstance(); DatabaseReference myRef = database.getReference("node_XX"); myRef.setValue("Hello, World!");
47. LISTEN AND READ FOR ANY VALUE EVENTS // Read from the database myRef.addValueEventListener(new ValueEventListener() { @Override public void onDataChange(DataSnapshot dataSnapshot) { // This method is called once with the initial value and again // whenever data at this location is updated. String value = dataSnapshot.getValue(String.class); Log.d(TAG, "Value is: " + value); } @Override public void onCancelled(DatabaseError error) { // Failed to read value Log.w(TAG, "Failed to read value.", error.toException()); } });
48. AUTOMAGIC SYNCHRONIZATION
49. DISK PERSISTENCE FirebaseDatabase.getInstance().setPersistenceEnabled(true);
50. COMPUTATION OF THE DATA
51. CLOUD FUNCTIONS > Run without a backend > No maintenance > Automatic scaling > Detached from the client > Based on triggers
52. BUT THERE IS A CATCH
54. JAVASCRIPT ACTUALLY, NODE.JS BUT STILL...
55. WAIT...
56. KOTLIN TO THE RESCUE
57. GETTING STARTED npm install -g firebase-tools firebase login firebase init functions
58. GETTING STARTED npm install -g firebase-tools firebase login firebase init functions npm install kotlin --save
59. myproject +- .firebaserc # Hidden file that helps you quickly switch between | # projects with `firebase use` | +- firebase.json # Describes properties for your project | +- functions/ # Directory containing all your functions code | +- package.json # npm package file describing your Cloud Functions code | +- index.js # main source file for your Cloud Functions code | +- node_modules/ # directory where your dependencies (declared in # package.json) are installed
60. myproject +- .firebaserc | +- firebase.json | +- functions/ | +- src/ | +- main/ | +- kotlin/ # we put our code here
61. Index.kt external fun require(module: String): dynamic external val exports: dynamic
62. Index.kt fun main(args: Array<String>) { var functions = require('firebase-functions'); exports.myFunc = functions.https.onRequest {req, res -> res .status(200) .type("application/json") .send(json) } }
63. BUILD & DEPLOY ./gradlew build $ firebase deploy --only functions
64. TRIGGERS > Realtime database > Authentication > Analytics > Cloud Storage > HTTP
65. AND...
66. UNIT TESTS
67. THANKS @mbonifazi | @_tiwiz