This property is what makes it decoupled with the rest of the other layers. The main thing here is that the BLoC does not know anything about the components that send events to it and to components that listen to it. At the same time, other components such as user interface, repositories, or even other BLoCs may listen to these state updates and do something with it. It means that the BLoC component itself receives events, does something and then finally updates its state. If you are familiar with the old design patterns, BLoC can be seen as a fusion of event driven architecture, observer, and state machine patterns. The reason that BLoC is reusable is due to it following a reactive programming paradigm. Makes your code reusable due to decoupling

A good library and IDE plugins for Flutter.

Makes your code reusable due to decoupling.

Every component listening to this BLoC does somethingīefore you go changing the whole architecture of your Flutter app, I will first list all the things that I found very useful after using this pattern. BLoC updates its state and publishes this update to listeners 4. BLoC accepts the event and processes something 3. Now, replace the component/s from the steps above with real objects such as UI widgets, repositories, services, data sources, other BLoCs, or any other components you can think of.

All components that are listening does something about new state.

BLoC updates its state and publishes this state update to listeners.BLoC accepts the event and does something.The following is a step by step process of how BLoC pattern works. The main component of this pattern is the BLoC itself which contains a part of the app’s business logic. Step by step process of how BLoC pattern worksīefore we even go deep into the code, it is better if we actually know first how this pattern works.

For now, don’t worry about streams, sinks, state management and other jargons of a BLoC.īLoC pattern is really just another way of splitting your code into layers in such a way that each component of your code can be swapped and replaced while the main function of your app still works unchanged.īLoC pattern is a way of dividing and organizing code to make it reusable. BLoC pattern is a way of dividing and organizing code to make it reusable. I will skip the formal definition of BLoC (Business Logic Component), but instead define what it is to me. By the end of this post, you should be able to understand how powerful it is and be able to use it in your projects. I will provide my own simple definitions and an example using this pattern in Flutter. This article will serve as a beginner’s guide to BLoC pattern.

Change order of bloc in blocs app