Flutter Provider - Advanced Firebase Data Management

Fireship · 148K views · 2019 · 11:08

Open on YouTube

Web developmentSoftware architecture & designtutorialdated

Why Stack Overflow recommends it

Stack Overflow users link it when answering Flutter state management questions, especially for sharing Firebase auth or Firestore stream data across screens with Provider.

Recommended by 5 people across 4 different months, 2019 to 2021.

What it is

A Fireship tutorial showing how to use Flutter's Provider package to pass Firebase data through the widget tree. It covers wrapping an app in StreamProvider so Firestore and auth streams update widgets in real time, with a walkthrough of the pattern in code.

What people said

Recommends Tinus Jackson · 2019-05 · Stack Overflow · on “Flutter state management with Provider”

If you are going to use the FirebaseUser or Logged in user throughout your app, i would suggest that you add the Provider on the highest level of your app. Example void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { MyApp(); @override Widget build(BuildContext context) { return MultiProvider( providers: [ StreamProvider<FirebaseUser>.value( stream: FirebaseAuth.instance.onAuthStateChanged, // Provider here ), ], child: MaterialApp( title: 'My App', debugShowCheckedModeBanner: false, theme: ThemeData( primaryColor: Colors.green, primarySwatch: Colors.green, accentColor: Colors.yellow, ), home: MainPage(), ), ); } } class MainPage extends StatefulWidget { MainPage({Key key,

Recommends Tinus Jackson · 2019-05 · Stack Overflow · on “How to listen to live changes in firestore document in Flutter using scopeModel”

If you are going to use the FirebaseUser and want to keep track of the state or Logged in user throughout your app, i would suggest that you use the Provider on the highest level of your app. For me its the easiest using the Provider Package [LINK] which is basically ScopedModel v2 according to some tutorials/videos Example void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { MyApp(); @override Widget build(BuildContext context) { return MultiProvider( providers: [ StreamProvider<FirebaseUser>.value( stream: FirebaseAuth.instance.onAuthStateChanged, // Provider here ), ], child: MaterialApp( title: 'My App', debugShowCheckedModeBanner: false, theme: ThemeData( primaryColor:

Recommends Gary Montgomery · 2020-06 · Stack Overflow · on “Flutter & Cloud-Firestore: how to read Firestore Documents linked to Flutter FutureBuilder”

check out this video from fireship.io: [this video] He's got some great Flutter videos. IMO the best way to learn is to try to break things then try to understand what's going wrong.

Recommends Omer · 2020-09 · Stack Overflow · on “Flutter - Passing data in PageView”

The Provider package can be very useful for using data transmitted between screens and widgets. The package: [LINK] For example, I use this package to transmit auth and storage data between my screens without the need of passing the same argument for the next screen and the next one so on. I highly recommend reading the docs but if you do struggle with it, I can recommend you several YouTube videos that might help: [this video]

Recommends dotmp3 · 2020-09 · Stack Overflow · on “Flutter, How to save font size options into sharedpreference?”

I would highly recommend watching this video. Flutter Provider [this video] It explains how you would use Provider package with Firebase but the same principles apply when you are using it with Font size. So instead of using a Streamprovider, you would use a FutureProvider where you would call the getFontSize function inside of.

Recommends Adnan · 2021-06 · Stack Overflow · on “Notifying the Parent widget that error happened in loading data in asynchronous, child widgets”

well, the best way to achieve what you are asking for is using a state management method. I'd recommend taking a look at [LINK] this tutorial [this video] explains it very well.

Cites Tinus Jackson · 2019-05 · Stack Overflow · on “how can i pass a variable to a class and call that variable in any other screen without it being reset”

I would suggest that you use the Provider since it is the easiest way for me to manage state throughout the app. Flutter starts with one component on top of the widget tree so i would place my provider here. Example void main() {runApp(MyApp());} class MyApp extends StatelessWidget { MyApp(); @override Widget build(BuildContext context) { return MultiProvider( providers: [ StreamProvider<FirebaseUser>.value( stream: FirebaseAuth.instance.onAuthStateChanged, // Provider to manage user throughout the app. ), ], child: MaterialApp( title: 'My App', debugShowCheckedModeBanner: false, theme: ThemeData( primaryColor: Colors.green, primarySwatch: Colors.green, accentColor: Colors.yellow, ), home: M