8:52 Keep in mind that in Provider 3.0.0 (the latest) the "notifier" have been changed to "value", eg: ChangeNotifierProvider.value(value: CounterBloc())
@@paulhalliday You could also use: ChangeNotifierProvider(builder: (context) => CounterBloc()), This will avoid version problems for now, or it might be better to have a version lock into your pubspec.yaml file for future tutorials, so people who watch will dive into the package and see the changes for themselves. (Just trying to be helpful)
Thank you for the short article. However - I would just like to point out : a. This has nothing to do with BLOC. What you have shown is basically MVVM. I would be inclined to therefore rename your components and drop the BLOC annotations as this may become confusing to dev's who are just starting Flutter and believe they have now learnt Bloc. Bloc is reactive and Stream-based. Provider is simply inherited widget on steroids. b. For simple applications - using a provider at the root of the app is okay. For more complex apps with very large widget trees - I would not recommend adding every single provider at the root of your app, both for performance & manageability reasons. Additionally as of v3 of provider , ProxyProvider was introduced which may lead to lots of proxyprovider stringing when we try and inject into objects within the widget tree that do not contain a build context. Thus, in my experience , it is best to not provide a global Provider at the root of the app but to instead inject Provider on a per-case basis, use sparingly where it is needed , remember Provider.of(context) in your Build() methods is not a cheap operation - especially if your widget tree is very large. FWIW my apps are reactive, I use RxDart and Bloc throughout and a hand rolled Provider class..
why not show us practically how you do it? Paul Halliday is trying his best to show us all he knows, u claim to know but you not showing us anything!!!
> remember Provider.of(context) in your Build() methods is not a cheap operation It's because you're probably not using it correctly. Provider.of() is indeed not cheap, because you rebuild the whole widget tree. Use it with (listen: false) parameter, to dispatch actions without subscribing to changes. Use Consumer() for optimization which has a 'child' parameter to exclude child from rebuild. You can optimize even more, using Selector() to subscribe selectively only to those store changes you want to watch. I hope this helps.
@@sergey_molchanovsky say I have a widget which has 3 children. But only one of those 3 widgets needs the value from my ChangeNotifierProvider. So if I use final abc = Provider.of(context) in my parent widget's build function, will it cause all 3 children widgets to be rebuilt or only the one where I'm using the provider?
@@ad9633 yes, it will. That's why as a mentioned before, you should use Consumer and wrap only 1 child you need to rebuild. Or use Provider.of inside of this child instead of parent.
Wow this is simply the best video of state management in Flutter. I can now clearly understand the concept of Provider. A tiny question: is it a good approach to wrap the whole app with the multiprovider and insert providers into provider=[ ] as you did in the video? Of course, this way I can simply call any bloc from anywhere of the app since it’s all covered. Also I can add new blocs to the list and they will also be available immediately for the whole app. Does that have a disadvantage?
It more likely depends on your project structure, but it's not a very optimized approach since the blocs will occupy RAM whether they are needed or not. I myself use both approaches in my app. I have some blocs which are needed to access globally, and some will be injected where they are necessary, And this will be found out during implementation mostly.
Wow, that's amazing! Clear explanation and perfect code organization into different packages and classes. Thanks million! By the way, I couldn't find the article. Please update the link.
Yeah this is a bit confusing to me as well. The bloc pattern is all about being observable, so you only input and extract info through streams afaik. The provider removes that stream complexity by introducing the 'notifyListeners' calls. So I think the CounterBloc actually has nothing to do with the actual BloC architecture in this case. Maybe CounterViewModel or CounterProvider would be more appropriate names here? Other than that still a nice video :)
BLoC is a design pattern, Provider is a dependency injection library. They can be used together, one is not an alternative to the other, provider makes providing and injecting the bloc easier. BLoC is just what the name says, a component that handles BL, with streams/futures/getters.
some say bloc is better than provider. some prefer provider. what you think? which one is better? easy to learn? easy to handle/apply? good for long run?
how to avoid unnecessary rebuilds? example: Widget A. Widget B. Widget C. Here when I update a state in Widget A with provider, the Widgets B and C rebuilds too. So how to avoid unnecessary rebuilds in B and C ?
how to get initial data without onpress button, like as soon as screen loaded i want to fetch users from server, i can not add userBloc.getUsers() into initalState(), it says => inheritFromWidgetOfExactType(_Provider) or inheritFromElement() was called before _MyAppState.initState() completed.
@Paul Halliday Hello, GETX would be a nice package to discuss.. State simple/reactive management(without codegen), route Management and Dependencies management in an one only place.. I have been using that, and Really, this is a wonderfull tool. High productivity + Huge simplicity. Could please make some content about that? thx a lot
How can i call increment function in initstate() to increase counter one in first run? I try to use Provider.of(context, listen: false).increment(); but show an error when call notify listeners?
Hi Paul. Thanks for this. Its appalling that most flutter tutorials are pretty basic and old (10 months plus old!). I would love to see an example app using bloc pattern, provider or even mobx with some crud functionality over an API. Sharedpreferences and Login functionality before performing these crud would be awesome. I cant seem to find anything meaningful to guide me on this. Makes me start to wonder whether flutter is really as popular as Google claims!! Paul @paulhalliday, would you please show us something on this front? Thanks in advance...
In every tech video, there is always one person who ask this question- "what is the vs code (*replace with other editors) theme that you are using ?" :)
As we changed to from modifying _counter and manually calling notifyListeners to instead using counter (the setter), notifyListeners was called from within the setter itself.
@@JonasDeVrient oh oh oh i see i guess it went over my head cause i did not see "this.counter" . Thanks for clarifying that. I think i will try flutter out. Hopefully Paul gets on top of it with a Udemy course soon.
Why to use the word bloc when there is no bloc ,It's just provider. And Bloc arc is my worst nightmare. Provider is the best and the most understandable, BTW Great video
I'm confused. Is this tutorial saying BLOC and Provider are the the same thing? I thought BLOC and Provider were two different state management techniques.
Really nice video man! I'm starting this flutter path and this video helped me a lot! and just in case someone is thinking about optimizations for their widget tree i would recommend to check their docs related to state managment: flutter.dev/docs/development/data-and-backend/state-mgmt/simple keep it up!
@@Abhishvek thanks, there is awesome tutorial on bloc patterns and mvvm... Provider is handy for small apps, but when it comes to more complex things it makes a mess. 😇
Hey friend, Provider is a sort of HOC with a centralized state thats being provided to all consuming widgets. BLOC is a whole different thing thats all about Reactive Programming and Observables , in dart case - Streams. Sorry to say but with this video and the article , you are making confusion among the community. To clear things more, there are few state managments in flutter. Bloc(Reactive programming), Provider(HOC) & Scoped_Model(HOC) and Redux.
Agree, just about to post a comment about the same. The video is great but it is not about the Bloc pattern. provider is mostly syntax sugar for InheritedWidget (as per provider page in pub.dev)
Use this ChangeNotifierProvider.value( value:CounterBloc() ) Instead of this ChangeNotifierProvider.value( notifier:CounterBloc() ) The Provider have been updated.
8:52 Keep in mind that in Provider 3.0.0 (the latest) the "notifier" have been changed to "value", eg: ChangeNotifierProvider.value(value: CounterBloc())
Thanks for this. I’ll keep it in mind for an updated video.
You also don't need to use "new" to implement any widget in the tree.
I recently learned that too, cheers!
@@paulhalliday You could also use: ChangeNotifierProvider(builder: (context) => CounterBloc()), This will avoid version problems for now, or it might be better to have a version lock into your pubspec.yaml file for future tutorials, so people who watch will dive into the package and see the changes for themselves. (Just trying to be helpful)
hey u nerdy can u explain me what's the difference between consumer and provider.of() ?
I always like random people who teach like this. Straight forward explanation and examples,
The best video I have ever seen on flutter State management using Provider package. Thanks a lot.
Definitely the best guide I've watched so far on Flutter's Provider. It's well explained and straight to the point. Thanks Paul!
Simply the best to understand what is provider and how it's working in flutter.
Excellent tutorial. The main principles is explained for a rapid understanding of the pattern.
hey paul, saved my day. Best explanations are often simple and yours is one of them. keep it up.
Very well written and recorded explanation. Good job! You should definitely pursue this path.
Yes thank you for this bro. Because I am a RN dev but I want to switch to flutter world and finding the best state management nice one
Thank you for the short article. However - I would just like to point out :
a. This has nothing to do with BLOC. What you have shown is basically MVVM. I would be inclined to therefore rename your components and drop the BLOC annotations as this may become confusing to dev's who are just starting Flutter and believe they have now learnt Bloc. Bloc is reactive and Stream-based. Provider is simply inherited widget on steroids.
b. For simple applications - using a provider at the root of the app is okay. For more complex apps with very large widget trees - I would not recommend adding every single provider at the root of your app, both for performance & manageability reasons. Additionally as of v3 of provider , ProxyProvider was introduced which may lead to lots of proxyprovider stringing when we try and inject into objects within the widget tree that do not contain a build context. Thus, in my experience , it is best to not provide a global Provider at the root of the app but to instead inject Provider on a per-case basis, use sparingly where it is needed , remember Provider.of(context) in your Build() methods is not a cheap operation - especially if your widget tree is very large. FWIW my apps are reactive, I use RxDart and Bloc throughout and a hand rolled Provider class..
Just another copy and paste tutorial....
why not show us practically how you do it? Paul Halliday is trying his best to show us all he knows, u claim to know but you not showing us anything!!!
> remember Provider.of(context) in your Build() methods is not a cheap operation
It's because you're probably not using it correctly. Provider.of() is indeed not cheap, because you rebuild the whole widget tree.
Use it with (listen: false) parameter, to dispatch actions without subscribing to changes.
Use Consumer() for optimization which has a 'child' parameter to exclude child from rebuild.
You can optimize even more, using Selector() to subscribe selectively only to those store changes you want to watch.
I hope this helps.
@@sergey_molchanovsky say I have a widget which has 3 children. But only one of those 3 widgets needs the value from my ChangeNotifierProvider. So if I use
final abc = Provider.of(context) in my parent widget's build function, will it cause all 3 children widgets to be rebuilt or only the one where I'm using the provider?
@@ad9633 yes, it will. That's why as a mentioned before, you should use Consumer and wrap only 1 child you need to rebuild. Or use Provider.of inside of this child instead of parent.
I had to watch this twice but I've got my head around it now. Thank you!
Nice & simple explanation. Thanks Paul!
Best video on flutter provider.
well explained, easy to understand. do you have video of implementing bloc for login state management?
Amazing tutorial, thank you! Keep this videos coming Paul!, you got a new subscriber
Thanks for watching! I'm excited to bring more Flutter videos as I continue to learn. 🙌🙌🙌
Wow this is simply the best video of state management in Flutter. I can now clearly understand the concept of Provider.
A tiny question: is it a good approach to wrap the whole app with the multiprovider and insert providers into provider=[ ] as you did in the video?
Of course, this way I can simply call any bloc from anywhere of the app since it’s all covered. Also I can add new blocs to the list and they will also be available immediately for the whole app.
Does that have a disadvantage?
Would be interesting to get an answer on this.
+1
+1
It more likely depends on your project structure, but it's not a very optimized approach since the blocs will occupy RAM whether they are needed or not.
I myself use both approaches in my app. I have some blocs which are needed to access globally, and some will be injected where they are necessary, And this will be found out during implementation mostly.
good question
thanks, keep up the good work. You explain very well
Thanks a lot Paul! Have been following you since Ionic 3 times.
Hi Paul , do you have some reccomended architecture of Flutter project that i can learn into ?
Wow, that's amazing! Clear explanation and perfect code organization into different packages and classes. Thanks million!
By the way, I couldn't find the article. Please update the link.
The article link points to a "Not found" webpage, does this mean you've pulled it out cause it's not up to date or something ?
Thanks for the video. Unfortunately however, the article link appears to be broken?
1:05 flutter create flutter_bloc && cd $_
Underscore variable save last param of your last command.
Btw, great explanation.
Thank you!
Thanks Mustofa! I’ll keep that in mind for the future.
A new follower successfully earned :D
Keep it up, amazing content.
awesome tutorial . May I ask, what theme are you using for VS Code?
Great video! Thanks! Just one question: is not necessary call 'dispose'?
I was wondering if this is a good approach for authentication as well?
Could you make a video about http calls using the Provider + Bloc Pattern?
12:37 minutes well spent, thanks :)
Great video! Noticed the link to the article was broken, would be great if you could put that back up. Cheers!
Link has been fixed. :)
@@paulhalliday No it hasn't
Clean , on point and straight up to the code !
Well done mate .
+1 sub .
What is the font that you are using?
As I know provider is alternative to BLoC ehy you're combining them? , but your short vid is amazing and you did good job in explaining
Yeah this is a bit confusing to me as well. The bloc pattern is all about being observable, so you only input and extract info through streams afaik. The provider removes that stream complexity by introducing the 'notifyListeners' calls. So I think the CounterBloc actually has nothing to do with the actual BloC architecture in this case. Maybe CounterViewModel or CounterProvider would be more appropriate names here? Other than that still a nice video :)
@@cuberob i agree, using the term bloc is confusing
BLoC is a design pattern, Provider is a dependency injection library. They can be used together, one is not an alternative to the other, provider makes providing and injecting the bloc easier. BLoC is just what the name says, a component that handles BL, with streams/futures/getters.
What is this font, you are using ?
The link to the article results in a 404... couldn't find it on that page. Any chance for a proper link? Thank you!
the article link has broken please fix that
Hi, I like the font of the code in this video , which font do you use？
Hey Hao! I made a video on my font choice: ua-cam.com/video/NoPe1KXYOtg/v-deo.html
Is it the convention to use the Bloc word after the class name when only using the Provider package without the actualy Bloc package involved?
No
@@kuldeepsharma7499 I named mine instead with a Provider in the end like CounterProvider
Awesome Video , i was waiting for you to make videos on flutter.
Flutter is on the way!
Pls what is the job market like in flutter development these days?
Great explanation!
Thanks for the video. Could you create one using Provider StreamProvider?
Hey! The link is broken! Is there a fix coming for it?
straight forward explanation at the right speed, you just saved my neck from a client
Nice walkthrough. I don't see how this has to do with BLoC
Indeed, Provider and Bloc are two different things. Thats a bit confusing here.
Good job man, that was simple and useful.
some say bloc is better than provider. some prefer provider.
what you think?
which one is better?
easy to learn?
easy to handle/apply?
good for long run?
I'll make a video about this! :)
how to avoid unnecessary rebuilds? example:
Widget A.
Widget B.
Widget C.
Here when I update a state in Widget A with provider, the Widgets B and C rebuilds too.
So how to avoid unnecessary rebuilds in B and C ?
Hi, is this what I have to do when fetching json?
Provider allows you to easily access state across multiple widgets.
Read the documentation. 🤗
is this a BLoC tutorial or Provider?
Provider.
Good video! What theme and font are you using? I like it.
Here's my dev setup: ua-cam.com/video/x7kzlz6loRo/v-deo.html
how if i have some routes, and i want to pass the provider to them??
so on destination route i just call the Provider.of(context)
How to use one provider on multiple pages?
I tried but showing an error to me. can u help me?
Link to article is down
Thank u so much for this video!
Great explanation, thanks!
how to get initial data without onpress button, like as soon as screen loaded i want to fetch users from server, i can not add userBloc.getUsers() into initalState(), it says => inheritFromWidgetOfExactType(_Provider) or inheritFromElement() was called before _MyAppState.initState() completed.
I'll see about making a video on this.
please give code download link...
the link is not working
@Paul Halliday Hello, GETX would be a nice package to discuss.. State simple/reactive management(without codegen), route Management and Dependencies management in an one only place.. I have been using that, and Really, this is a wonderfull tool. High productivity + Huge simplicity. Could please make some content about that? thx a lot
Article page is 404?
Awesome explanation.
Thanks! 🙌🙌
How can i call increment function in initstate() to increase counter one in first run? I try to use Provider.of(context, listen: false).increment(); but show an error when call notify listeners?
pub.dev/packages/provider#faq
is your answer.
nice work !! Thanks for this lesson
Hi Paul. Thanks for this. Its appalling that most flutter tutorials are pretty basic and old (10 months plus old!). I would love to see an example app using bloc pattern, provider or even mobx with some crud functionality over an API. Sharedpreferences and Login functionality before performing these crud would be awesome. I cant seem to find anything meaningful to guide me on this. Makes me start to wonder whether flutter is really as popular as Google claims!! Paul @paulhalliday, would you please show us something on this front? Thanks in advance...
Thank you!!! Now it's Very clearly to me =)
this video was great
awesome video thanks paul so much
That was quite useful. Thanks!
really good one
oh that was a nice video ! Thanks !
Thanks a lot! More Flutter videos on the way. 🙌🙌
I am getting more confused right now about bloc using rxdart or provider like in this video
I’m working on some examples with RxDart, still learning Flutter myself. Hoping to share as I continue to learn more.
@@paulhalliday that would be great. I am waiting for that
What theme are you using?
Amazing Video buddy!! I watched a number of tutorials on provider before coming to this one, and this is by far the best!
Really clean, thank you
finally tutorial i can understand
Thank you!
Amazing e easy video thanks!
In every tech video, there is always one person who ask this question- "what is the vs code (*replace with other editors) theme that you are using ?" :)
And how that offends or hurt you?
i got confused to how was setter called inside the inc and dec functions
As we changed to from modifying _counter and manually calling notifyListeners to instead using counter (the setter), notifyListeners was called from within the setter itself.
I see.... i guess I was expecting to see set counter being used like this for instance -> counter(number); If that makes sense.
@@g-luu Yes, like in Java, but it in Dart we use it directly because of the 'set' keyword in front of counter.
@@JonasDeVrient oh oh oh i see i guess it went over my head cause i did not see "this.counter" . Thanks for clarifying that. I think i will try flutter out. Hopefully Paul gets on top of it with a Udemy course soon.
thank you so much
Great video thank you for sharing.
tnx for this!
Why to use the word bloc when there is no bloc ,It's just provider. And Bloc arc is my worst nightmare. Provider is the best and the most understandable, BTW Great video
What's with the icon / foreground on that fab?? :)
P.S great video, thanks
That would most likely be my channel's profile image and is an overlay on UA-cam? :P
I'm confused. Is this tutorial saying BLOC and Provider are the the same thing?
I thought BLOC and Provider were two different state management techniques.
good one
Why are you using the term "bloc" here??
Really nice video man! I'm starting this flutter path and this video helped me a lot! and just in case someone is thinking about optimizations for their widget tree i would recommend to check their docs related to state managment: flutter.dev/docs/development/data-and-backend/state-mgmt/simple keep it up!
This is more like mvvm rather than bloc pattern.
Yes it is like the mvvm, Well you should check this video too over provider!ua-cam.com/video/hRStAmkTcJY/v-deo.html
@@Abhishvek thanks, there is awesome tutorial on bloc patterns and mvvm... Provider is handy for small apps, but when it comes to more complex things it makes a mess. 😇
Hey friend, Provider is a sort of HOC with a centralized state thats being provided to all consuming widgets. BLOC is a whole different thing thats all about Reactive Programming and Observables , in dart case - Streams. Sorry to say but with this video and the article , you are making confusion among the community. To clear things more, there are few state managments in flutter. Bloc(Reactive programming), Provider(HOC) & Scoped_Model(HOC) and Redux.
Agree, just about to post a comment about the same. The video is great but it is not about the Bloc pattern. provider is mostly syntax sugar for InheritedWidget (as per provider page in pub.dev)
Use this ChangeNotifierProvider.value(
value:CounterBloc()
)
Instead of this
ChangeNotifierProvider.value(
notifier:CounterBloc()
)
The Provider have been updated.
Getting 404 at the website article
If this would have been a react native tutorial it would have ended at 1:11
If only your website had a search...
So it's basically just another class made specifically to store the function 🤔 something like that I guess
street to point it's an amazing content ma friend ,, keep learning and uploading video
Eureca!
Bloc and Provider are different state mangement tools. You're mixing things up.
tq ew
............
🌹🌹