Firebase Auth bersama React - Reflux

Halo, pada kali saya akan membahas tenang firebase authentication untuk website dan kita akan integrasikan ke ReactJS dengan Reflux sebagai Functional Programming Architecture adaptasi dari Flux.

Authentication adalah bagian penting dari setiap aplikasi SaaS, dan melakukan otentikasi pada Single App Page menambahkan beberapa kompleksitas tersendiri. Di sini saya akan membahas bagaiman aplikasi bisa terintegrasi dengan firebase Authentication, berikut gambaran umum alur authentication-nya:

ReactComponents

• Setiap component akan listen AuthStore jika membutuhkan akses API yang membutuhkan otorisasi. Ini diperlukan karena fireabase Auth berjalan secara Async untuk menghindari getToken() === null.
  

AuthActions

• AuthActions list of Actions cara kerjanya sesuai standard Reflux-Actions

AuthStores

• AuthStore berfungsi untuk berkomunikasi ke Firebase SDK. 
  
  
  

Kesimpulan

1. Dengan pendekatan ini aplikasi kita jadi mudah di maintain dan lebih agile jika ada perubahan UI. Dan tidak perlu implementasi Firebase.Auth disetiap React komponen. Ingat React itu Library for Building User Interface bukan untuk maintain state auth :D (baca: https://en.wikipedia.org/wiki/Single_responsibility_principle)  
2. Mostly Firebase SDK berjalan secara async ini menjadi sulit di maintain dan diprediksi dengan React Lifecycle. Jadi dibutuhkan data flow seperti ini :D
3. Apakah Reflux Architecture terbaik untuk React & Firebase ? Menurut saya tidak, saya tetap mengalami kesulitan dalam maintain state aplikasi. please use Redux for better apps & performance.