The document outlines a project for real-time image sharing where users can sign in, upload images, and manage them while others can like these images. It suggests using Firebase tools to handle server requests, store images, and provide real-time notifications to users. The proposed steps include adding Firebase to the app, enabling authentication, building a basic UI, and implementing image upload and live updates.

1. Senior System Architect, Google
Developer Expert, Authorised Trainer
REAL-TIME IMAGE
SHARING
JERRY JALAVA
JERRY@QVIK.FI | @W_I

2. CLIENT ASKS FOR POC…
‣ Users should be able to easily sign-in
(which is required)
‣ Users should be able to upload images
from their camera
‣ Other users should see these images
immediately
‣ Users should be able to manage their
own images
‣ Users should be able to like images of
others
@QVIKJERRY@QVIK.FI | @W_I

3. DEADLINE IS SET FOR
YESTERDAY
@QVIKJERRY@QVIK.FI | @W_I

4. SO WHAT DO WE NEED TO DO
‣ Some server to handle our uploads and
other api requests
‣ Scalable storage system for storing the
images
‣ A mechanism to notify all users at once
about new images, and fetch them
‣ Build the Authentication and Listing
views to Android client
@QVIKJERRY@QVIK.FI | @W_I

5. BUT ALL THAT WILL TAKE
AT LEAST DAYS
@QVIKJERRY@QVIK.FI | @W_I

6. NOT NECESSARILY
WHAT IF I TOLD YOU,
@QVIKJERRY@QVIK.FI | @W_I

7. @QVIK
https://firebase.google.comJERRY@QVIK.FI | @W_I

8. LETS JUST USE FOLLOWING
‣ Firebase Auth
‣ Firebase Storage
‣ Firebase Realtime Database
‣ FirebaseUI
(https://github.com/firebase/firebaseui)
@QVIKJERRY@QVIK.FI | @W_I

9. NOW WE HAVE SOLVED
‣ Some server to handle our uploads and
other api requests
‣ Scalable storage system for storing the
images
‣ A mechanism to notify all users at once
about new images, and fetch them
‣ For UI, we will use ready components as
much as possible
@QVIKJERRY@QVIK.FI | @W_I

10. BUILDING
LETS START
@QVIKJERRY@QVIK.FI | @W_I

11. 1. LETS ADD FIREBASE TO OUR APP
@QVIK
We head to https://console.firebase.google.com/ and create new project
JERRY@QVIK.FI | @W_I

12. 1. LETS ADD FIREBASE TO OUR APP
@QVIK
Next we create and download Firebase configuration for our app
JERRY@QVIK.FI | @W_I

13. 2. LETS ENABLE AUTHENTICATION
@QVIK
We head to Authentication / Sign-In method config and enable Anonymous auth
JERRY@QVIK.FI | @W_I

14. 3. LETS BUILD THE BASIC UI
@QVIK
(Create some amazing UI by writing layout XML)
JERRY@QVIK.FI | @W_I

15. 4. FETCH THE ADDED IMAGES WITH LIVE CHANGES
@QVIK
Here is just one simple way of listening for changes in our images collection
JERRY@QVIK.FI | @W_I

16. 5. UPLOAD IMAGE TO STORAGE
@QVIK
Here is just one simple way of uploading a file to Firebase storage
JERRY@QVIK.FI | @W_I

17. AND WE ARE DONEWELL, ALMOST
@QVIKJERRY@QVIK.FI | @W_I

18. SCAN THE QR CODE TO INSTALL
HTTPS://GITHUB.COM/JERRYJJ/FIREBASE-STORAGE-
DEMO-ANDROID
LIVE DEMO
@QVIKJERRY@QVIK.FI | @W_I

20. THANK YOU
www.qvik.fi