Riverpod Simplified | Easy State Management
Вставка
- Опубліковано 22 лип 2024
- Riverpod State Management has a lot of features. In this video we break it down to the simplest parts, with which you can achieve all your state management goals.
I Built a Site to Learn Flutter: hungrimind.com
Link To Code: github.com/tadaspetra/riverpo...
0:00 Introductions
1:13 Riverpod Packages
2:00 Consumer & Provider
3:35 Simple Providers
7:10 StateNotifierProvider
9:09 AsyncValue
12:30 Riverpod Modifiers
Connect With Me
✦ My Website: tadaspetra.com/#/
✦ Live Coding: / tadaspetra
✦ Twitter: / tadaspetra
✦ Chat on Discord: / discord
✦ Instagram: / tadaspetra
UA-cam Gear
✦ MacBook Pro 16 inch: amzn.to/3qe4MeF
✦ MX Master 3 Mouse: amzn.to/2VlkZQS
✦ Canon Rebel SL3: amzn.to/2ViIfPv
✦ Hiearcool USB Hub: amzn.to/3llsIsP
✦ iPad Pro 12.9 (3rd Generation): amzn.to/36kaVy0
✦ Apple Pencil (2nd Generation): amzn.to/2JoHy4y
✦ Yeti Microphone: amzn.to/37oRNOq
✦ Rode Boom Arm: amzn.to/3lnEKCb
✦ Blue Radius II Shock Mount: amzn.to/2JoIfea
✦ Blue RPop Filter: amzn.to/39rQSiZ
✦ Sony WH1000XM3: amzn.to/3moWgHh
My Top 5 Books:
✦ Brave New World - Aldous Huxley: amzn.to/2JyaK96
✦ 1984 - George Orwell: amzn.to/3lmLzUk
✦ The Millionaire Fastlane - MJ Demarco: amzn.to/2ViGthn
✦ The 4-Hour Workweek - Timothy Ferriss: amzn.to/3mnypYD
✦ Homo Deus - Yuval Noah Harari: amzn.to/2VlFRYe
Thank you for watching!
#Flutter #StateManagement #Riverpod
I'm getting confused since riverpod changed its syntax. Instead of 'watch(counterController.state)' it's gonna be 'ref.watch(counterController)' and instead of 'context.read(counterController).add();' will be 'ref.read(counterController.notifier).add();'
Maybe you should make a STATEment (hehe) in the description that syntax in the video is a bit outdated. Anyway thanks for the tutorial, it was helpful!
I will pin your comment so people can see it :)
I have a problem that I can not pass a reader to a class. Can you help me with this
@@congtoannguyen1940 You can pass ref.read as an argument to your provider's constructor
final authRepository = ChangeNotifier((ref) => AuthRepository(ref.read));
class AuthRepository extends ChangeNotifier {
AuthRepository(this.reader);
final Reader reader;
// the rest of your code
}
thank you so much i love how you dont use complicated english words that i struggle to learn, others dont really care and use them
Thank you! That's what I am going for :)
This is one of the best Riverpod examples I have seen.
Best breakdown of riverpod providers I have seen on youtube. Thank you Tadas!
Whenever I want to learn a new aspect of flutter, your channel is the first go to for me. Really great and comprehensible explanation!
Thank you so much! That means a lot 🥲
Excellent, concise, good subject coverage. Thank you!
Thank you so much!
Thank you for simplifying Riverpod, Tadas! I was overwhelmed by all the providers, but your video helped me understand how everything fits together. Do you have plans to make a video about using Riverpod with an API? That would be really helpful.
only tutorial i understood. simple and clean well done man. Thanks alot
Thank you so much!
You deserve more likes man, you are very well paced and a good explainer
Thank you! I really appreciate it 😊
Thank you, that was very simple
Excelente video, gracias desde Costa Rica,
Excellent video, thanks from Costa Rica
Thank you Tadas, great video and very good explanation to Riverpod management. I better understand that... very help me in riverpod dev. strongly other subjects on riverpod I hope ! good job
Thank you so much!
Your videos are very nice and informative. I have used many things that you have taught. Especially getx. But this was a little too fast. Please do a video comparing these two state management tools. 😘
Thank you so much man! I like your explanation.
love your Self-Deprecating Sense of Humor 😂 1,2,3,4 3:12
nice! please do more riverpod videos!
Great video. Thanks
Short and snappy. Just how I like 'em!
Thank you!
i loved this tutorial. he is so chill.
Thank you 😊
nice job. great example.
Thanks 🙏 great video. Riverpod is realy nice and not to hard for New coders. Complemented with hooks. Its soooo flexible.
I think there’s a little bit of learning curve at the beginning, but then you start picking up pieces here and there and it starts to really connect and make sense 😊
Yes ))) You made a great job. Thank you!!!
Thank you 😊
Great tutorial, thanks. I have a list view displaying documents from a firestore collection. I would like to tap on a document to navigate to a details page with more information from the document that I tapped. Do you know how to do this with Riverpod? Maybe something to do with .family passing in the list view index?
Thanks much better then just using provider
So there are plenty of State management in flutter but till now I felt that getx is one of the easiest than any other but will follow you along to learn riverpod
GetX is the easiest in my opinion as well. It’s a great starting point, but as you saw there’s a lot of safety brought into your codebase with Riverpod. While it’s a little more complex I think it’s safer.
End of the day though the solution that works well for you is the best one for you 😊
Are there strong reasons against using getx? Some people "in the know" don't like it, but I did not hear substantial reason..
@@leoingson I hope not lol I use it for everything.
@@leoingson if you want to learn State management the getx is best to get started and easier to understand. But again it varies from people to people and what they need.
Awesome video! Say if you want to get a SharedPreferences string on init, how would you do this? Do you still use Stateful Widgets with flutter_riverpod and can call init?
Thanks for that
Thank you so much for that tutorial! You're doing a great job
Thank you Silas. Really appreciate it 😊
Really nice video, I tried using both Provider and flutter_bloc. Provider was very simple but lacked some features, Bloc is good, but has a lot of boilerplate code, for every small thing writing states and events.
As of now, Riverpod seems to be right in between.
For me it solves those exact issues very well :)
Hi nice 👍🏽, love if you could do a video on using riverpod and firebase the right way
I have an example on my GitHub repos for patrons if that’s something you’re interested in. But also i have videos on Firebase with other state management and it’s a very similar concept
we want updated video on riverpod❤️❤️
Burrapaadu 🔥
cool show!
Content is good in the video , but I found it speedy. You could elaborate in slow simple steps so that beginners can also understand it better.
How is this different than Provider in the sense of complexity, use cases, and features?
Would like to see how to do a full stack app for flutter with MySQL for all platforms is it possible?
Can you make a video of riverpod where you are using models and calling an API (like Firebase). i want to see the structure and organization of files
This is a great tutorial, but for people who are watching this now, there are some slight changes. These are the ones that I found:
In Consumer builder:
'builder: (BuildContext context, WidgetRef ref, Widget? child) {
return ref.watch(userProvider).when( ...'
'StackTrace? stackTrace'
StateNotifierProvider:
'final counterController = StateNotifierProvider((ref) => CounterNotifier());'
'return Text("Basic: ${ref.watch(counterController)}");'
For the buttons, it’s changed to ‘ref.read(counterController.notifier).add();’, but you also have to change from ‘class Home extends StatelessWidget’ to ‘class Home extends ConsumerWidget’ change the build function to include ‘Widget build(BuildContext context, WidgetRef ref)’
Async:
'final counterAsyncController = StateNotifierProvider((ref) => CounterAsyncNotifier(ref.read));'
I think that covers the changes I found, but I loved the tutorial! Thank you so much! And thanks to Richard Winter for pointing out some of these and helping me figure all this out.
Can you make one video on Firestore, riverpod, stream provider for fetch one time at login and use it every were including change detection. Thanks a lot in advance.
Best basic riverpod tutorial ever!! Well done
Thank you! There’s a lot of good complex ones but I was hoping to make the entry barrier lower 😊
I am a beginner so I am still stuck in making api fetch and post call with state management riverpod
please make a video on Rest api services with riverpod. Thanks in advance.
Thanks
love your tutorials... keep the channel going
Thanks you 🙌
helpful
Thanks for simplifying Riverpod.
Glad I could help !
Please do a video on GetX VS Riverpod pros & cons of each
I have been thinking a lot about doing a general video about which one you should use
Please make a video 🙏
thank you Tedas from Jordan
Thank you for watching!
thanks for the video I enjoyed it
can you tell us what software you use for the handwriting that shows in the video?
Microsoft OneNote :)
And one more doubt can we use the data recived from futureprovider outside build method. I don't want the state to be rebuild just want to make an api call and fetch the data. How to implement that in riverpod.Should I use StateNotifier just the way you showed or is there another way ? Thank you
I think this would be the case for a ProviderListener. You would listen to a FutureProvider, and retrieve the data, but not rebuild
@@tadaspetra Thank You I will try to implement it
After doing the async part, the buttons arent doing anything. Im pretty sure I followed exactly except for counterController and counterAsyncController because what you did wasnt working
He provided a link to the code. I suggest trying that first and then comparing to your own.
Hello when i'm following the tutorial the line "final counterController = StateNotifierProvider((ref) => CounterNotifier());" is giving me the error. " The type 'StateNotifierProvider' is declared with 2 type parameters, but 1 type arguments were given.
Try adjusting the number of type arguments to match the number of type parameters."
same
I figured it out, do this instead
in providers.dart:
final counterController = StateNotifierProvider((ref) => CounterNotifier());
To get the count in main.dart:
watch(counterController).toString()
yeeees thanks for thiiis!
Thanks for watching!
Please make videos about riverpod 2.0 pleaseee
Coming from alot of GetX use, would it be possible to create a controller class and then provide that class instead of something specific like a counter class ? So, let's say i have a HomeScreenController for homescreen where i have a bunch of methods and variables , could i provide the whole class and use that for only home screen and then the same for different screens? Like If i have more than one state i want to "observe" in the controller ? Dunno if i make any Sense 😅
Yes, that is definitely possible. You can configure the controllers however you want. Personally I like do it by feature, but if you want to do it by page that’s definitely possible
@@tadaspetra cool! Thanks ! 😁
this is the exact question I have! did you figure it out on how to structure that?
Good explainer, thanks. I'm sticking with GetX. I do appreciate the safety and other aspects of Riverpod, obviously Remy did a great job engineering it. I guess I've just gotten comfortable with GetX, and the the simplicity of a getbuilder passing in the "state" variable, then referencing it in your widget tree. If the controller changes the state, update the widget tree. Do you think it's a Imperative vs Declarative thing? After decades programming in other languages I think my mind is imperative biased lol
Yea, nothing wrong with sticking to the thing you are comfortable with. And to be honest, I am not really sure, I feel like there isn't a very clearly defined line for what is imperative vs declarative. Maybe I am wrong on this point though
@@tadaspetra I'm usually wrong about this, so I've spent a bit of time thinking it through, and I think that if you use getbuilder, manage your "state" in your controller, then call update when you want to update your widgets it would be imperative, if it changes, it doesn't change until the program tells you it changed. If you connect with listeners, or obs, streams... you are being more declarative. If it changes, it changes, things happen.
Thank you for the good explanation!
Thank you for watching 😊
Wooow !
Great job bro!
Thank you!
I am using hooks_riverpod, am I fancy?
You are the most fancy :)
Is it combination of both hooks and riverpod?
I've used StateProvider when you can use "==" for deciding a state is updated, and the value is simply dependent on a value for the initial state. You can do the same thing with StateNotifierProvider, but it's a bit more typing. :)
Yes, there are definitely some scenarios where StateProvider makes sense. But I think it’s a more rare case then the other ones
omg ! Thank you so much!! please create more about Riverpod + Firebase !
authentication etc. please I really love your tutorial
Thank you. And I will look into it
linux phone app?
Awesome video!!! Thanks for sharing, and please teach and example with firebase
I will look into it. But it would be very similar to the FutureProvider except instead of calling a fake one, call a real one :)
Looks nice but after over a year of commercial flutter development, I see most of the methods in riverpod are a little overkill. What I mean is that I can't figure out where riverpod would be better than my current solution xD Usually, we are working with REST API which mostly fetches data once at the beginning(per view/tab/widget) and if you properly divide your widget tree, then you can maintain a good state o your app - Just follow the rule of moving the state up in a tree when it's needed. Your video is great! Sometimes I feel like we are creating state management solutions to solve problem that 90% of people doesn't have ;) Cheers!
I couldn't agree with this comment any more! I think setState is a looot more powerful and useful than people think. I would agree 90% of the time it is enough, but I think when you get to bigger apps with lots of state, then state management really makes sense. But it is also definitely not necessary, with a clean codebase and InheritedWidget, you can achieve all of this
thankuuuuuu great video!!
Thanks for watching!
Great video, nice to have a Flutter channel to follow :D
Welcome aboard :)
In one of my flutter app, I need to develop a custom camera. Can you please create a video tutorial on that. Thank you
I'll take a look
Bloc is best will stick to it.
no problem there! If it works well for you, then keep with it 😊
You are the best!!
No, you!
@@tadaspetra 🤪
What Provider should I use if want to pass the data returned by the FutureProvider to other Provider, and how donI actually do it? This is where im stuck now :)
Depends what your end goal with the new provider is. But you can watch and read other providers within the providers. If you want some more in depth Riverpod tutorials check the Fun With Flutter channel, he has a really good series
I ended up reading my future provider inside my statenotifier just like what you did with Async one. And thank you very much simplifying Riverpod. your explanation is crystal clear!
Hey Tadas, can you make a new video for states_rebuilder? The author just released v4.0 (can be found in the null_safety branch). I think not too much changed but since v3.0 the way to inject states changed and made it much simpler, which is not covered in your previous video.
Yea I’ve gotten some other comments about it. I might take a look eventually. But i kind of want to make more non state management videos lol. The only reason I made this one is because I was currently working with it
Great tutorial but a small doubt accroding to riverpod documentation it is a bad idea to read another provider inside the body of Provider. Why is it so?
I don't think it is a bad idea. I think the documentation even says that you can do this. riverpod.dev/docs/concepts/reading#reading-a-provider-inside-another-provider
riverpod.dev/docs/concepts/combining_providers
Here there's a red dialog indicating not to read inside the body of a provider. Can you explain it a bit. Thank You
@@SIDDARTHBHURA I think it is less a "error" type of dialog and more of a "it doesn't make sense to do it". Using read wouldn't really break the code, it just makes the provider not responsive, and defeats the purpose. I think people have a lot of issues when using read, so that's why it's emphasized
@@tadaspetra Thank you for the explanation.
0 1 2 3 haha technically you are right.
Much better and easier than flutter bloc
If possible please make a complete app tutorial where a flutter_riverpod state management is used!
#thankyouforthistutorial #thankyou #happycoding
I will see
3:10 😆
I know how to count I promise!
Too much boiler plate comme on... I still prefer GetX
hi can we get the source code
it is in the description :)
Also your very dark android studio window, with very bright android emulator window's contrast hurt the eyes man. why not use Theme.Dark().
Three ways to provide the data :):)
Hahaha yea I messed up a bit 😂
@@tadaspetra love your explanation anw! Keep going, Tadas.
Tom Cruise
when 2023 video?
I’m building up a nice doc for it on hungrimind.com
I don't really feel it... I think GetX is way much better than this.