Tweet
Tweet

Slide 1

Slide 1 text

Firebase & Jetpack: fit like a glove Doug Stevenson @CodingDoug Get the code: Get the app: bit.ly/2NtAuQP bit.ly/2NtGedo

Slide 2

Slide 2 text

@CodingDoug @CodingDoug

Slide 3

Slide 3 text

@CodingDoug @CodingDoug Cloud hosted, realtime, NoSQL

Slide 4

Slide 4 text

@CodingDoug @CodingDoug

Slide 5

Slide 5 text

@CodingDoug A simple example … or is it? val firestore = FirebaseFirestore.getInstance() val ref = firestore.collection("coll").document("id") ref.get() .addOnSuccessListener { snapshot -> // We have data! Now what? } .addOnFailureListener { exception -> // Oh, snap } How should I do async programming? Do I directly update my views here? What manages this singleton?

Slide 6

Slide 6 text

@CodingDoug Your Arch WW D?

Slide 7

Slide 7 text

@CodingDoug Data Binding Lifecycles LiveData Navigation Paging Room ViewModel WorkManager

Slide 8

Slide 8 text

@CodingDoug LiveData ViewModel Notify views when underlying database changes Manage UI-related data in a lifecycle-conscious way

Slide 9

Slide 9 text

@CodingDoug @CodingDoug

Slide 10

Slide 10 text

@CodingDoug @CodingDoug

Slide 11

Slide 11 text

@CodingDoug @CodingDoug

Slide 12

Slide 12 text

@CodingDoug @CodingDoug

Slide 13

Slide 13 text

@CodingDoug Handle stock price changes from a document in Firestore

Slide 14

Slide 14 text

@CodingDoug Handle stock price changes from a document in Firestore val firestore = FirebaseFirestore.getInstance()

Slide 15

Slide 15 text

@CodingDoug Handle stock price changes from a document in Firestore val firestore = FirebaseFirestore.getInstance() val ref = firestore.collection("stocks-live").document("HSTK")

Slide 16

Slide 16 text

@CodingDoug Handle stock price changes from a document in Firestore val firestore = FirebaseFirestore.getInstance() val ref = firestore.collection("stocks-live").document("HSTK") ref.addSnapshotListener { snapshot, exception -> if (snapshot != null) { } else if (exception != null) { } }

Slide 17

Slide 17 text

@CodingDoug Handle stock price changes from a document in Firestore val firestore = FirebaseFirestore.getInstance() val ref = firestore.collection("stocks-live").document("HSTK") ref.addSnapshotListener { snapshot, exception -> if (snapshot != null) { val model = StockPrice( ticker = snapshot.id, price = snapshot.getDouble("price")!!.toFloat() ) } else if (exception != null) { } }

Slide 18

Slide 18 text

@CodingDoug Handle stock price changes from a document in Firestore val firestore = FirebaseFirestore.getInstance() val ref = firestore.collection("stocks-live").document("HSTK") ref.addSnapshotListener { snapshot, exception -> if (snapshot != null) { val model = StockPrice( ticker = snapshot.id, price = snapshot.getDouble("price")!!.toFloat() ) } else if (exception != null) { TODO("This is just a simple code sample, ain't got time for this.") } }

Slide 19

Slide 19 text

@CodingDoug Handle stock price changes from a document in Firestore val firestore = FirebaseFirestore.getInstance() val ref = firestore.collection("stocks-live").document("HSTK") ref.addSnapshotListener { snapshot, exception -> if (snapshot != null) { val model = StockPrice( ticker = snapshot.id, price = snapshot.getDouble("price")!!.toFloat() ) someTextView.text = model.ticker } else if (exception != null) { TODO("This is just a simple code sample, ain't got time for this.") } }

Slide 20

Slide 20 text

@CodingDoug Handle stock price changes from a document in Firestore val firestore = FirebaseFirestore.getInstance() val ref = firestore.collection("stocks-live").document("HSTK") ref.addSnapshotListener { snapshot, exception -> if (snapshot != null) { val model = StockPrice( ticker = snapshot.id, price = snapshot.getDouble("price")!!.toFloat() ) someTextView.text = model.ticker throw PoorArchitectureException("let's rethink mixing data store and views”) } else if (exception != null) { TODO("This is just a simple code sample, ain't got time for this.") } }

Slide 21

Slide 21 text

@CodingDoug LiveData

Slide 22

Slide 22 text

@CodingDoug @CodingDoug LiveData Observable Code can register observers to receive updates. Genericized Subclasses must specify a type of object containing updates. Lifecycle-aware Handles component start, stop, and destroy states automatically.

Slide 23

Slide 23 text

@CodingDoug Keep views up to date with LiveData class MyActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.stuff) val tickerTextView = findViewById(R.id.tv_ticker) val priceTextView = findViewById(R.id.tv_price) } }

Slide 24

Slide 24 text

@CodingDoug Keep views up to date with LiveData class MyActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.stuff) val tickerTextView = findViewById(R.id.tv_ticker) val priceTextView = findViewById(R.id.tv_price) val liveData: LiveData = getLiveDataForMyTicker("HSTK") } }

Slide 25

Slide 25 text

@CodingDoug Keep views up to date with LiveData class MyActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.stuff) val tickerTextView = findViewById(R.id.tv_ticker) val priceTextView = findViewById(R.id.tv_price) val liveData: LiveData = getLiveDataForMyTicker("HSTK") liveData.observe(this@MyActivity, Observer { stockPrice -> }) } }

Slide 26

Slide 26 text

@CodingDoug Keep views up to date with LiveData class MyActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.stuff) val tickerTextView = findViewById(R.id.tv_ticker) val priceTextView = findViewById(R.id.tv_price) val liveData: LiveData = getLiveDataForMyTicker("HSTK") liveData.observe(this@MyActivity, Observer { stockPrice -> if (stockPrice != null) { tickerTextView.text = stockPrice.ticker priceTextView.text = stockPrice.price.toString() } }) } }

Slide 27

Slide 27 text

@CodingDoug LiveData is aware of the Android Activity lifecycle

Slide 28

Slide 28 text

@CodingDoug LiveData is aware of the Android Activity lifecycle override fun onStop() { super.onStop() // LivaData becomes inactive, doesn't notify observers }

Slide 29

Slide 29 text

@CodingDoug LiveData is aware of the Android Activity lifecycle override fun onStop() { super.onStop() // LivaData becomes inactive, doesn't notify observers } override fun onStart() { super.onStart() // LivaData becomes active again, notifies observers with latest data }

Slide 30

Slide 30 text

@CodingDoug LiveData is aware of the Android Activity lifecycle override fun onStop() { super.onStop() // LivaData becomes inactive, doesn't notify observers } override fun onStart() { super.onStart() // LivaData becomes active again, notifies observers with latest data } override fun onDestroy() { super.onDestroy() // LiveData removes all activity-scoped observers - no leaks! }

Slide 31

Slide 31 text

@CodingDoug Implement LiveData with Firestore document updates class StockPriceLiveData() { }

Slide 32

Slide 32 text

@CodingDoug Implement LiveData with Firestore document updates class StockPriceLiveData() : LiveData() { }

Slide 33

Slide 33 text

@CodingDoug Implement LiveData with Firestore document updates class StockPriceLiveData(private val documentReference: DocumentReference) : LiveData() { }

Slide 34

Slide 34 text

@CodingDoug Implement LiveData with Firestore document updates class StockPriceLiveData(private val documentReference: DocumentReference) : LiveData() { override fun onActive() { // # observers 0 -> 1 woo-hoo! someone cares! } }

Slide 35

Slide 35 text

@CodingDoug Implement LiveData with Firestore document updates class StockPriceLiveData(private val documentReference: DocumentReference) : LiveData() { private var listenerRegistration: ListenerRegistration? = null override fun onActive() { // # observers 0 -> 1 woo-hoo! someone cares! listenerRegistration = documentReference.addSnapshotListener(....) } }

Slide 36

Slide 36 text

@CodingDoug Implement LiveData with Firestore document updates class StockPriceLiveData(private val documentReference: DocumentReference) : LiveData() { private var listenerRegistration: ListenerRegistration? = null override fun onActive() { // # observers 0 -> 1 woo-hoo! someone cares! listenerRegistration = documentReference.addSnapshotListener(....) } override fun onInactive() { // # observers 1 -> 0 awww, everyone left... } }

Slide 37

Slide 37 text

@CodingDoug Implement LiveData with Firestore document updates class StockPriceLiveData(private val documentReference: DocumentReference) : LiveData() { private var listenerRegistration: ListenerRegistration? = null override fun onActive() { // # observers 0 -> 1 woo-hoo! someone cares! listenerRegistration = documentReference.addSnapshotListener(....) } override fun onInactive() { // # observers 1 -> 0 awww, everyone left... listenerRegistration!!.remove() } }

Slide 38

Slide 38 text

@CodingDoug Implement LiveData with Firestore document updates class StockPriceLiveData(private val documentReference: DocumentReference) : LiveData(), EventListener { private var listenerRegistration: ListenerRegistration? = null override fun onActive() { // # observers 0 -> 1 woo-hoo! someone cares! listenerRegistration = documentReference.addSnapshotListener(this) } override fun onInactive() { // # observers 1 -> 0 awww, everyone left... listenerRegistration!!.remove() } override fun onEvent(snap: DocumentSnapshot?, e: FirebaseFirestoreException?) {} }

Slide 39

Slide 39 text

@CodingDoug Implement LiveData with Firestore document updates override fun onEvent(snap: DocumentSnapshot?, e: FirebaseFirestoreException?) { }

Slide 40

Slide 40 text

@CodingDoug Implement LiveData with Firestore document updates override fun onEvent(snap: DocumentSnapshot?, e: FirebaseFirestoreException?) { if (snap != null && snap.exists()) { val model = StockPrice( snap.id, snap.getDouble("price")!!.toFloat() ) } }

Slide 41

Slide 41 text

@CodingDoug Implement LiveData with Firestore document updates override fun onEvent(snap: DocumentSnapshot?, e: FirebaseFirestoreException?) { if (snap != null && snap.exists()) { val model = StockPrice( snap.id, snap.getDouble("price")!!.toFloat() ) // Here you go, all my admiring observers! Go update your UI! setValue(model) } }

Slide 42

Slide 42 text

@CodingDoug Implement LiveData with Firestore document updates override fun onEvent(snap: DocumentSnapshot?, e: FirebaseFirestoreException?) { if (snap != null && snap.exists()) { val model = StockPrice( snap.id, snap.getDouble("price")!!.toFloat() ) // Here you go, all my admiring observers! Go update your UI! setValue(model) } else if (e != null) { TODO("You should handle errors. Do as I say, not as I do.") } }

Slide 43

Slide 43 text

@CodingDoug ● Who creates the instance of LiveData? ○ StockPriceLiveData constructor exposes Firestore implementation details. ○ Remember: views should know nothing of data store. ● LiveData loses its data on configuration change. ○ Would rather have immediate LiveData results after configuration change. Two problems to resolve

Slide 44

Slide 44 text

@CodingDoug @CodingDoug ViewModel Survives configuration changes Same ViewModel instance appears in reconfigured activities Shared & Managed System manages the scope of instances, may be shared Lifecycle-aware Automatically cleaned up on final destroy

Slide 45

Slide 45 text

@CodingDoug ViewModel

Slide 46

Slide 46 text

@CodingDoug Implement a ViewModel that yields a LiveData class StocksViewModel : ViewModel() { }

Slide 47

Slide 47 text

@CodingDoug Implement a ViewModel that yields a LiveData class StocksViewModel : ViewModel() { fun getStockPriceLiveData(ticker: String): StockPriceLiveData { } }

Slide 48

Slide 48 text

@CodingDoug Implement a ViewModel that yields a LiveData class StocksViewModel : ViewModel() { // Find a repository object using dependency injection private val repository: StockDataRepository = ... fun getStockPriceLiveData(ticker: String): StockPriceLiveData { } }

Slide 49

Slide 49 text

@CodingDoug Implement a ViewModel that yields a LiveData class StocksViewModel : ViewModel() { // Find a repository object using dependency injection private val repository: StockDataRepository = ... fun getStockPriceLiveData(ticker: String): StockPriceLiveData { } } // StockDataRepository knows where the data actually comes from interface StockDataRepository { fun getStockPriceLiveData(ticker: String): StockPriceLiveData }

Slide 50

Slide 50 text

@CodingDoug Implement a ViewModel that yields a LiveData class StocksViewModel : ViewModel() { // Find a repository object using dependency injection private val repository: StockDataRepository = ... fun getStockPriceLiveData(ticker: String): StockPriceLiveData { return repository.getStockPriceLiveData(ticker) } } // StockDataRepository knows where the data actually comes from interface StockDataRepository { fun getStockPriceLiveData(ticker: String): StockPriceLiveData }

Slide 51

Slide 51 text

@CodingDoug Implement a repository backed by Firestore interface StockDataRepository { fun getStockPriceLiveData(ticker: String): StockPriceLiveData }

Slide 52

Slide 52 text

@CodingDoug Implement a repository backed by Firestore interface StockDataRepository { fun getStockPriceLiveData(ticker: String): StockPriceLiveData } class FirestoreStockDataRepository : StockDataRepository { override fun getStockPriceLiveData(ticker: String): StockPriceLiveData { } }

Slide 53

Slide 53 text

@CodingDoug Implement a repository backed by Firestore interface StockDataRepository { fun getStockPriceLiveData(ticker: String): StockPriceLiveData } class FirestoreStockDataRepository : StockDataRepository { // Should use DI for this too private val firestore = FirebaseFirestore.getInstance() override fun getStockPriceLiveData(ticker: String): StockPriceLiveData { } }

Slide 54

Slide 54 text

@CodingDoug Implement a repository backed by Firestore interface StockDataRepository { fun getStockPriceLiveData(ticker: String): StockPriceLiveData } class FirestoreStockDataRepository : StockDataRepository { // Should use DI for this too private val firestore = FirebaseFirestore.getInstance() override fun getStockPriceLiveData(ticker: String): StockPriceLiveData { val ref = firestore.collection("stocks-live").document(ticker) return StockPriceLiveData(ref) } }

Slide 55

Slide 55 text

@CodingDoug LiveData & ViewModel & Repository & Firebase

Slide 56

Slide 56 text

@CodingDoug Use ViewModel and LiveData in an activity class MyActivity : AppCompatActivity() { private lateinit var tickerTextView: TextView private lateinit var priceTextView: TextView override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) // Redacted: inflate and initialize views... } }

Slide 57

Slide 57 text

@CodingDoug Use ViewModel and LiveData in an activity class MyActivity : AppCompatActivity() { private lateinit var tickerTextView: TextView private lateinit var priceTextView: TextView override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) // Inflate and initialize views... val viewModel = ViewModelProviders.of(this).get(StocksViewModel::class.java) } }

Slide 58

Slide 58 text

@CodingDoug Use ViewModel and LiveData in an activity class MyActivity : AppCompatActivity() { private lateinit var tickerTextView: TextView private lateinit var priceTextView: TextView override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) // Inflate and initialize views... val viewModel = ViewModelProviders.of(this).get(StocksViewModel::class.java) val liveData = viewModel.getStockPriceLiveData("HSTK") } }

Slide 59

Slide 59 text

@CodingDoug Use ViewModel and LiveData in an activity class MyActivity : AppCompatActivity() { private lateinit var tickerTextView: TextView private lateinit var priceTextView: TextView override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) // Inflate and initialize views... val viewModel = ViewModelProviders.of(this).get(StocksViewModel::class.java) val liveData = viewModel.getStockPriceLiveData("HSTK") liveData.observe(this, Observer { stockPrice -> }) } }

Slide 60

Slide 60 text

@CodingDoug Use ViewModel and LiveData in an activity class MyActivity : AppCompatActivity() { private lateinit var tickerTextView: TextView private lateinit var priceTextView: TextView override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) // Inflate and initialize views... val viewModel = ViewModelProviders.of(this).get(StocksViewModel::class.java) val liveData = viewModel.getStockPriceLiveData("HSTK") liveData.observe(this, Observer { stockPrice -> if (stockPrice != null) { tickerTextView.text = stockPrice.ticker priceTextView.text = stockPrice.price.toString() } }) } }

Slide 61

Slide 61 text

@CodingDoug

Slide 62

Slide 62 text

@CodingDoug ● LiveData doesn’t propagate errors ● Errors need to bubble up to the UI 
 class DataOrException(val data: T?, val exception: E?) typealias StockPriceOrException = DataOrException LiveData => LiveData What about errors?

Slide 63

Slide 63 text

@CodingDoug ● https://github.com/CodingDoug/firebase-jetpack ● Sync individual documents/nodes, and queries ○ Query → RecyclerView support is inefficient and still needs work ● Implementations for both Realtime Database and Firestore ● Background sync with WorkManager ● Backend implemented with TypeScript for node and Cloud Functions ● Stay tuned for more! Lots more in the repo

Slide 64

Slide 64 text

Thank you! @CodingDoug firebase.google.com Get the code: Get the app: bit.ly/2NtAuQP bit.ly/2NtGedo