Flutter State Management - The Grand Tour

Поділитися
Вставка
  • Опубліковано 21 лип 2024
  • Take a tour of ten awesome state management techniques in Flutter. Learn how to control the flow of data when building complex large-scale mobile apps with RxDart, BLoC, and more fireship.io/lessons/flutter-s...
    1. StatefulWidget
    2. StatefulBuilder
    3. InheritedWidget
    4. RxDart + BehaviorSubject
    5. BLoC
    6. Redux
    7. Mobx
    8. Scoped Model
    9. Flutter Hooks
    10. Firebase
    Flutter State Mgmt Guide flutter.dev/docs/development/...
    Bloc pub.dartlang.org/packages/flu...
    RxDart pub.dartlang.org/packages/rxdart
  • Наука та технологія

КОМЕНТАРІ • 346

  • @hasansalim1868
    @hasansalim1868 3 роки тому +259

    After two years, this very important video starts getting old. With libraries being updated may be it is time for Fireship to revisit this topic. Thanks for your hardwork. A very nice channel indeed.

  • @friebetill
    @friebetill 5 років тому +202

    1. StatefulWidget 1:25
    2. StatefulBuilder 2:43
    3. InheritedWidget 4:16
    4. RxDart + BehaviorSubject 6:12
    5. BLoC 8:50
    6. Redux 11:34
    7. Mobx 11:57
    8. Scoped Model 12:27
    9. Flutter Hooks 12:58
    10. Firebase 13:22

    • @sadhlife
      @sadhlife 4 роки тому +11

      Should've mentioned Provider. it's simple and solid, and much like the scoped_model library but much more popular

    • @friebetill
      @friebetill 4 роки тому +8

      @@sadhlife Yes, I agree, although at the time the video was released, Provider was introduced by the Flutter Team at the Google IO 2019. ua-cam.com/video/d_m5csmrf7I/v-deo.html
      Therefore one cannot blame Fireship for not presenting providers then. However, by now Provider should be mentioned via an overlay, because Provider is the standard way to manage the state in Flutter.

    • @sadhlife
      @sadhlife 4 роки тому

      @@friebetill i see, didn't know, and yeah!

    • @mehraanakbarii
      @mehraanakbarii 3 роки тому

      Should we know all of them?

    • @friebetill
      @friebetill 3 роки тому +1

      @@mehraanakbarii Definitely not, start with a simple one e.g. provider and then you can still upgrade to more powerful systems if necessary.

  • @sadabwasim9850
    @sadabwasim9850 5 років тому +168

    Fireship is becoming one of the best tech channel, It's content are simply amazing.

    • @Fireship
      @Fireship  5 років тому +6

      Thank you Sadab!

    • @johanemerson307
      @johanemerson307 2 роки тому

      sorry to be so off topic but does any of you know a method to log back into an Instagram account??
      I somehow lost the login password. I appreciate any assistance you can give me

    • @londonsonny6112
      @londonsonny6112 2 роки тому

      @Johan Emerson instablaster ;)

    • @johanemerson307
      @johanemerson307 2 роки тому

      @London Sonny I really appreciate your reply. I found the site on google and I'm in the hacking process atm.
      Takes a while so I will reply here later when my account password hopefully is recovered.

    • @johanemerson307
      @johanemerson307 2 роки тому

      @London Sonny It did the trick and I finally got access to my account again. I am so happy:D
      Thank you so much, you saved my ass!

  • @Fanaro
    @Fanaro 4 роки тому +1

    Thank you for stating that the web benchmarked way of handling state, i.e. rx with basic streams, is your favorite way. It gives me confidence that I can handle Flutter state management with what other fields already use and don't have to reinvent the wheel over again.
    And stating that Firebase is already a huge solution for 99% of state management is also very important, and something most purists frown upon.

  • @rubensdemelo
    @rubensdemelo 5 років тому +89

    Best video about state management with flutter. Congratulations !!🎊

  • @Quintusvw
    @Quintusvw 5 років тому +1

    A very useful overview of state management for developers on a time-constraint budget. Thanks for the introduction!

  • @nagas_dev
    @nagas_dev 5 років тому +2

    One of the best videos, demonstrating most of the ways for state management. You got my attention with firestore as a state management option and I really want to watch a video about it, explaining how can be used.

  • @alithejumbo
    @alithejumbo 4 роки тому +1

    Dude your way of teaching is the BEST I have ever seen. Fast, clean, simple and straight to the point. Why don't you make Udemy courses? If you do please tell me about them.

  • @CaiCruz
    @CaiCruz 5 років тому +1

    State management is a fairly new subject for me, but from first impressions of using redux in angular, I'd say is very complicated to try to mitigate issues that could be solve in different and simpler ways. Thanks for the video. Your channel has some great info! :)

  • @JonWood
    @JonWood 5 років тому +3

    Never knew there were so many ways to handle state management. Thanks for explaining each of these techniques!

  • @AndreaGiacon
    @AndreaGiacon 5 років тому +45

    Finally: a clear explanation of states management.
    Thank you

  • @nikhi1
    @nikhi1 5 років тому

    Behave responsibly with the state!! Awesome intro to all the patterns for flutter. 😀😀

  • @remoteportal
    @remoteportal 4 роки тому

    You are the BEST!
    quick, to the point, not discussing your vacation to Florida and wasting everyone's time

  • @dhiyaaulauliyaa3988
    @dhiyaaulauliyaa3988 5 років тому

    Good video! This video uploaded at just right time for me when struggling to understand flutter. Flutter hook looks promising for me btw. Love the flutter t-shirt 😄

  • @yeakleang
    @yeakleang 3 роки тому

    Finally! I've trying to understand the state management in flutter for a few days. Thank you.

  • @TheBadFred
    @TheBadFred 5 років тому

    Very good for an overview of state management in flutter. Flutter hooks and scoped model was new to me. It is good to have the choice.

  • @mrbbot
    @mrbbot 5 років тому

    Wow! Great video, nice to have all the different methods concisely explained in one place.

  • @emmanuelogbewe2334
    @emmanuelogbewe2334 5 років тому

    Man I’ve been waiting for this. Has to be one of the best vids on state management. Thank you!!

  • @stevenzhang7582
    @stevenzhang7582 5 років тому +1

    I'm confused by state by I think I'm getting the hang of things!! Thanks for the tutorial and love that flutter t shirt!

  • @abhishekdewadiga1113
    @abhishekdewadiga1113 5 років тому

    Nicely done!!! All the possible state management approaches for a flutter app. 👍

  • @andreujuanc
    @andreujuanc 5 років тому

    Just getting started with flutter. This helps a lot to clarify issues. Thanks!

  • @mmsergi
    @mmsergi 4 роки тому +82

    What about Provider approach? Is the one that Im using, what's your opinion about it?

    • @MrHimanshun
      @MrHimanshun 3 роки тому +1

      @Ruwen Höltge I am very new other SM , could please tell me what is a service locator??

    • @TimothyNazar
      @TimothyNazar 3 роки тому +3

      @@MrHimanshun The service locator pattern is a design pattern used in software development to encapsulate the processes involved in obtaining a service with a strong abstraction layer. This pattern uses a central registry [that's what you typically see in main.dart file in a form of MultiProvider([service1, service2])] known as the "service locator", which on request returns the information necessary to perform a certain task. en.wikipedia.org/wiki/Service_locator_pattern

    • @bobthebuilder6715
      @bobthebuilder6715 3 роки тому +1

      @Ruwen Höltge I wish I read your comment 1 year ago

    • @SeriesTube01
      @SeriesTube01 3 роки тому +1

      I use Provider too. 👍

    • @SeriesTube01
      @SeriesTube01 3 роки тому +2

      @Ruwen Höltge We know what it is. He is asking why wasn't even mentioned in the video since it is, by far, the most used library for state managemente in Flutter. I'm surprised about that too.

  • @beratsulimani9823
    @beratsulimani9823 5 років тому

    State managemet is a data workflow of your application. Love this T-shirt

  • @madhankumar5231
    @madhankumar5231 5 років тому

    Clarified my doubts about the state management in Flutter. Thanks a lot.

  • @VictorKun
    @VictorKun 5 років тому +16

    I'm amazed by the fact that you know so much, I keep wondering about the effort it took for you to reach there. :) Great video and work. Cliche...

  • @MichaelRichins
    @MichaelRichins 5 років тому +1

    I for one am a huge fan of Behavior Subjects. Both in Angular and now in my new love of Flutter.

    • @Fireship
      @Fireship  5 років тому

      BehaviorSubjects FTW!

  • @darshangowda309
    @darshangowda309 5 років тому

    Thanks for making a list of every solution at one place! BehaviourSubject & RxDart looks super neat and pretty much solves every problem :P

    • @Fireship
      @Fireship  5 років тому +1

      BehaviorSubjects are amazing :)

  • @alexandrsmith6909
    @alexandrsmith6909 5 років тому +1

    Thanks for one more amazingly useful video during my learning stage 👍🏻 keep it up 🖐🏻

  • @lvl4ul2i
    @lvl4ul2i 5 років тому +1

    I love your channel you are very concise and you talk about what really matters

  • @RobertBrunhage
    @RobertBrunhage 5 років тому +16

    Wasn't aware of the get_it package, will definitely check it out. Great video!
    Wished I had this video when I started haha

    • @happynewyearw
      @happynewyearw 5 років тому +3

      Check out this blog about get_it + rxdart/rxcommand: www.burkharts.net/apps/blog/rxvms-foundations-rxcommand-and-getit/
      Looking forward for more awesome videos of practicle demonstration base on these tools from you too! Great job, Thanks!

  • @willysvarela1254
    @willysvarela1254 5 років тому +1

    Awesome video

  • @milindgour2526
    @milindgour2526 3 роки тому

    I am lucky to find this channel ...😅😅👌👌👍👍 , really good content , I was Soo confused before , but this videos are really helpful , please keep uploading

  • @kishansampat4632
    @kishansampat4632 4 роки тому

    By the way thank you for your videos I went to your website and started learning too It helped us a lot in building our first app deliverable within weeks

  • @MarkVolkmann
    @MarkVolkmann 2 роки тому +27

    For simplicity, consider using provider which has been recomended by the Flutter team for a while now.

  • @NatiTessema
    @NatiTessema 5 років тому +4

    Glad I found this video before starting. You da man

  • @TheRedDaren
    @TheRedDaren 5 років тому +2

    Just when I got into Flutter. Perfect timing.

  • @DanielTubul
    @DanielTubul 3 роки тому

    such a long video but passed so fast = A really good one!!!
    thanks for that

  • @TurtleWargaming
    @TurtleWargaming 5 років тому

    What state management strategy would you recommend for the scenario described at 4:12? I'm currently stuck on a project trying to figure out a good solution. The siblings are a list of users, and when tapping one of the users in that widget, it should somehow give that user object to its sibling "form" widget, to prepopulate and edit.

  • @veda_dom
    @veda_dom 5 років тому

    Thank for this video, you helped to realize the others. Thanks for fireship too.

  • @Carlos_Carrascosa
    @Carlos_Carrascosa 3 роки тому +3

    I just came across this video, it explains the fundamentals really good. I've ended up using riverpod after doing my research, but it is not mentioned in this video, maybe you could do a new one!! Great channel

  • @kamranbashir4842
    @kamranbashir4842 4 роки тому +9

    01:57 I can't stop myself to press ctrl+s to remove that round ball with main.dat indicating that file is not saved.

  • @merthyr1831
    @merthyr1831 Рік тому +17

    Great video, but a 2022 version would be awesome! Almost everything after the starter app/stateful widget are mostly unused now :)

  • @Orbicalaz
    @Orbicalaz 5 років тому

    Hey will there be an update for Angular NGRX with service, effects firebase hookup? Cheers

  • @sushantnp
    @sushantnp 4 роки тому

    I am new to flutter and have experience with React and Redux. So, what should I use for state management tool for my projects.
    I know redux pretty enough.

  • @dharmang
    @dharmang 4 роки тому

    Wow i only knew the 1st one. But dang loved the RxDart method!! 💖

  • @emmanuelogbewe2334
    @emmanuelogbewe2334 5 років тому

    Great video!! When we have multiple classes like Counter and we are using GetIt do we call registerSingleton for all of them ?

  • @harry356
    @harry356 2 роки тому

    I just use the getstorage package the flush the state to disk every time the window is closed or going to the background. And read it in on initstate. I do this per page. Is this considered bad design?

  • @leonardoventocilla3275
    @leonardoventocilla3275 5 років тому

    Awesome video and explanations!! This is the best I´ve seened about this topic hard topic.
    My option is with RxDart. Great flexibility. The video made it clear for me because I thought that RxDart and Bloc was the same thing.
    I didn't know about the flutter hooks, I´m going to find out about it.

  • @user-fh4xo2pc2d
    @user-fh4xo2pc2d 5 років тому

    Hi! Which state management solution are you going to use for your course?

  • @blank-vw2sb
    @blank-vw2sb 4 роки тому +8

    Fireship is sailing in flutter!
    it's Awesome

  • @juliancorredor1128
    @juliancorredor1128 5 років тому +4

    I think state management makes easier the development of reactive uis, it helps a lot with dealing things like setState or manually re rendering the hole or widget when you may only need to render a specific small portion of it. On the other hand, helps sharing information across a wide component or widget tree which is a huge advantage

    • @Fireship
      @Fireship  5 років тому +2

      Sharing data easily has always been a big one for me, makes prototyping way faster imo.

  • @st0len729
    @st0len729 3 роки тому

    Why is the Stream in the RxDart section called stream$? Is it a convention? If yes, what does the dollar sign mean and when should I add it?

  • @VivekMore1
    @VivekMore1 5 років тому

    I love your small and succinct videos

  • @deriegle
    @deriegle 5 років тому +2

    Thanks a lot for the video. I loved the explanation. I think I want to try out the Bloc pattern. I use redux in my current react native project, but honestly I try to avoid putting anything in redux if possible, because of the boilerplate. I definitely like the look of Bloc pattern in Flutter and the T-shirt! Hope I win it. Thanks for the awesome video.

  • @huzefatunkiwala5414
    @huzefatunkiwala5414 5 років тому

    very good information, very helpful , even i don't know 10 state management things , i learn lot

  • @raghav.bhardwaj
    @raghav.bhardwaj 4 роки тому

    Thank you for his Video. What is your opinion on Flutter provider package?

  • @danielsolomon6227
    @danielsolomon6227 Місяць тому

    I think it's time to revisit this topic because I waiting to learn about Provider and Riverpod.

  • @aviad4
    @aviad4 5 років тому

    Like your videos, short and informative.

  • @junhuh8940
    @junhuh8940 4 роки тому

    Good compact well explained about alternatives available for flutter state.

  • @maxwellnderitu
    @maxwellnderitu 3 роки тому

    Great content as usual. Still relevant in 2021 👍

  • @andrewgoeden103
    @andrewgoeden103 5 років тому

    I am a personal fan of Firebase because of its adaptability and the ease of integrations. It is definitely a little buggy since I last used Firestore in Flutter (February 2019) but a great POC item.

  • @tannermeade
    @tannermeade 5 років тому

    Is the difference between the rxdart method he is using and the scoped model method that the scoped model would trigger a rebuild on all the listeners of the model, where as the rxdart method will only trigger a rebuild on the widgets that subscribe to the specific stream of the "model" they are subscribed to? That difference would make the rxdart method much easier.

  • @kirill4531
    @kirill4531 5 років тому

    Could you please say a few words about Provider? Is it better than BLoC for starting?

  • @DevKhalilKhalil
    @DevKhalilKhalil 5 років тому

    Thank you very much for this nice created video, it was really helpful.

  • @cedvdb6473
    @cedvdb6473 3 роки тому

    whats the problem of declaring a list of the services instances in the global scope ? Or even make them singleton if that's the potential issue?

  • @mohamedzakria2975
    @mohamedzakria2975 4 роки тому

    WOW, super simple, great compression

  • @lokeshar6649
    @lokeshar6649 5 років тому +1

    Simply superb... Almost you covered everything.

  • @lutaseb
    @lutaseb 5 років тому

    Only used NgRx and it believe there s a lot of boilerplate especially with the effects. Plus the state tends to grow in size as you use the app

  • @laxmikantswain2568
    @laxmikantswain2568 4 роки тому

    Awesome content about State management!!!

  • @lunargixx6867
    @lunargixx6867 5 років тому

    Fantastic video about state management

  • @gvcallen
    @gvcallen 4 роки тому

    Just a question - what's so bad about your counterService object being in the global namespace? I honestly thought it would be a perfect candiate

  • @rshirkhanov
    @rshirkhanov 4 роки тому

    How can I pass some arguments, using Flutter Hooks' useReducer?

  • @PaulBrassington_flutter_expert
    @PaulBrassington_flutter_expert 4 роки тому

    Very good, I bought a video course, it used Provider, as an ex Java developer it seems like so many options, yet linked to the event aspect rather than sharing data, why not use static classes for data and the event model for events?

  • @faaf42
    @faaf42 4 роки тому +2

    In case you wonder syntax "stream$" at 7:13 it's medium.com/@benlesh/observables-and-finnish-notation-df8356ed1c9b (observable - convention for naming it)

  • @hasanimam82
    @hasanimam82 4 роки тому +4

    Great video, almost covered everything about state management, Thanks!
    My thoughts:
    - I've never heard about StateBuilder and that it can be used with StatelessWidget, which can really be helpful sometimes.
    - i didn't know that we should use SetState function inside the Inherited Widget, is that necessary?
    - you probably didn't mention the Provider and ChangeNotifier classes because they came after this video, but they're quite an extension for ScopeModel class.
    - My favourite approaches for state management are: Provider, Bloc and get_it, or maybe a mix between two of them.

    • @benjieming7232
      @benjieming7232 3 роки тому +1

      The provider is maybe the best solution for state management for me.

  • @happynewyearw
    @happynewyearw 5 років тому +3

    Thx for the great videos as always! Hope to get more videos on RxDart + RxCommand + GetIt + Firebase (simple tut or some example app using these packages will be awesome!), this set of packages is the best state management techniques in Flutter based on what I've read and understand, if I'm wrong please tell me, I'm pretty new to all of these, so I would like to learn more!
    btw, really thanks to Frank Pepermans, Brian Egan and Thomas Burkhart , these Flutter/Dart packages really makes me exited and joyful to build app in Flutter!

    • @Fireship
      @Fireship  5 років тому +1

      Very thankful for their contributions! Have not used RxCommand yet, but looks interesting :)

    • @happynewyearw
      @happynewyearw 5 років тому +1

      @@Fireship Cool! definitely take a look if you can, check out the author's article here: www.burkharts.net/apps/blog/rxvms-foundations-rxcommand-and-getit/
      I've been looking for more videos or article about RxDart + GetIt + Firebase, but no luck for now, look forward to see more people start to use and showcase these combination of packages!

  • @pranjalgoyal6747
    @pranjalgoyal6747 3 роки тому

    Hey what about Provider I think google recommends to use Provider ??

  • @RagoDN2
    @RagoDN2 5 років тому

    There are so many choices! The best choice for the apps I work on is probably gonna be "scoped_model" because it's lightweight and single-purpose. That said, I'm not opposed to giving Redux or MobX a try.

    • @happynewyearw
      @happynewyearw 5 років тому

      Try rx and stream, it's super powerful and reactive programming apply to most programming language!

  • @butbutmybutt
    @butbutmybutt 4 роки тому

    hey, wich video software are you using, share it pls :)

  • @nervi3608
    @nervi3608 3 роки тому

    which is the best for highest performance?

  • @pardipbhatti9943
    @pardipbhatti9943 5 років тому

    Thanks for the video. I just got pro membership at your site.

  • @evandrojunior1406
    @evandrojunior1406 4 роки тому

    If I want do use multiple streams in behavior subject. How can I do it? Your example uses only one. Thanks a lot!

  • @divinedela9125
    @divinedela9125 5 років тому

    Great as always.

  • @ddean3732
    @ddean3732 4 роки тому

    Great vid..
    I would like to contact you with a detailed question. How to?

  • @AbhishekKumar-mq1tt
    @AbhishekKumar-mq1tt 5 років тому +1

    Thank u for this awesome video

  • @zachzulanas4125
    @zachzulanas4125 5 років тому

    could we see maybe a Flutter comparison to other cross-platform native development languages? Thanks

  • @politicallynotcorrect2968
    @politicallynotcorrect2968 4 роки тому

    I think something like vuex is very simple to understand and still very powerful

  • @lucavenir5308
    @lucavenir5308 3 роки тому

    I guess this video is just outdated, but as a Flutter Developer I mainly use Providers, which are (imo) the best Inherited Widget wrapper, less error prone, in which you can decide if you actually want to listen to changes or no. Another Widget I use a lot and I didn't see in this video is the Consumer Widget. That's just too easy to use and I highly recommend it (but it listens to changes by default).

  • @Fullstackdesign
    @Fullstackdesign 5 років тому +3

    Good job on the video, I know how much time and effort it takes to make these videos. As for state management for a prototype, would you recommend using BLOC?

    • @Fireship
      @Fireship  5 років тому

      Thank you, this video was extra challenging. Bloc might be more than you need for a prototype, scoped model or a simple stream might be easier.

  • @sven2529
    @sven2529 Рік тому

    InheritedCounter Part not working: Failed assertion: line 41 pos 12: 'result != null': No InheritedCounter found in context)

  • @kaushalyaroshan
    @kaushalyaroshan 4 роки тому

    Great content with nice animations🤩🤩

  • @viditkhanna3721
    @viditkhanna3721 2 роки тому

    What do you guys think about Cubit?

  • @shubhamjaiswal3029
    @shubhamjaiswal3029 5 років тому

    Amazing Video Man!!
    ;)

  • @gregcounts4021
    @gregcounts4021 4 роки тому

    Bravo, very well done!

  • @anashashim
    @anashashim 5 років тому

    Awesome explanation 🔥😍👍

  • @jeisy8153
    @jeisy8153 4 роки тому

    Nice video, I also got into push recently... Still experimenting with networks but so far MonadPlug is the best...

  • @MultiTelefono
    @MultiTelefono 3 роки тому

    thanks for the video!!

  • @BiniamAsnake
    @BiniamAsnake 4 роки тому +4

    Thanks for the best summary with code samples. The flutter doc now gives an example using Provider package. Do you recommend using that instead of BLOC or RxDart? flutter.dev/docs/development/data-and-backend/state-mgmt/simple

  • @tommyeagen3763
    @tommyeagen3763 4 роки тому

    I am a beginner to Dart and Flutter and this confuses us me on so many levels, I am wondering what kind of app needs a widget tree that deep to cause Flutter community to provide that many tools for state management?

  • @MCorpJC
    @MCorpJC 4 роки тому +5

    Provider is missing in the list 🙂 good video