Visualizing Flutter Bloc


Bloc relies on three components. An event, a bloc, and a state.

Event, Bloc, and State
An API request comes in and it can produce one of two states. Your bloc decides.

Flutter Bloc Integration

At this point, you understand bloc. Actually, yeah, it’s that simple! Let’s see how you can actually use it now.

How widgets in a tree might get mapped to an app. Super simplified.
Every node under the bloc provider has access to it.
Widgets submitting events to the bloc.
Api results can come back as an event.
A Bloc Builder receiving state
On success state, we don’t build the right widget. On failure state, we don’t build the left.


Flutter and bloc summary

Learn more

To learn more about flutter and bloc (and to get into some actual code), I would highly recommend checking out the package flutter_bloc and its really well made wiki.



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Timothy Stepro

Timothy Stepro

Software engineer by day, software engineer by night.