Manage State in Flutter, E-Com App 5

Two questions always haunt Flutter beginners. What is the State of Flutter? And, how to manage the State of Flutter?

As we’ve building an ecommerce app from scratch, we should answer these questions at the very beginning.

Otherwise we cannot follow the workflow of code.

However, we won’t take much time. 

Because we have a separate category on the State of Flutter. 

Besides, we have discussed the Provider package in detail before. 

Yet we need to understand the core concepts that revolve around the State.

Before we start the discussion, let’s take a look at the following image first.

State of Flutter at a glance
State of Flutter at a glance

What do we learn from the above image?

We’ve learned two points. 

Firstly, the State of Flutter changes the User Interface. 

Before going to the second point, let’s explain this.

For example we have tapped a button. As a result, we see that a new page or screen opens up. 

Whenever a new page opens up, it also builds the Widgets.

Now, a widget may have a lot of child widgets. Right? 

If the change builds all the widgets, it might be costly for our system resources. Therefore we have to avoid it.

In summary, when the State or Data changes, the User Interfaces change. As the user interface changes it might build one or multiple widgets.

Secondly, the State of Flutter might act across the app. In that case, we call it global.

Or it could be local. That means, you change the state but it changes the User Interface locally.

For example, we add an item to cart, so the cart changes.

While changing the State it does not affect other widgets.

For our e commerce app we’ll use the Provider package.

Manage State and Provider

Why will we use providers?

Certainly, in our next article, we’ll explore that question in detail. However, for absolute beginners, who are reading this post, let me tell you one thing at the very beginning.

Provider package is one of the most useful packages you need to use while you manage the State of Flutter app. Therefore, try to understand how we use it first.

Secondly, you need to understand why we use this package. To sum up the “why” question, we must say that the Provider package helps us to enhance the performance of our flutter app. It reduces the Widget rebuilds.

Finally, in the next section, we will discuss how to use Provider for the e-commerce app.

What Next?

Books at Leanpub

Books in Apress

My books at Amazon

GitHub repository

Python and Data Science

Flutter, Dart and Algorithm

Twitter

Comments

2 responses to “Manage State in Flutter, E-Com App 5”

  1. […] What is the difference between mixin and extend in Flutter? Let’s understand the difference because we’ve been building an e-commerce app. […]

  2. […] As a result, now we can easily access each product property through the instantiated product objects. […]

Leave a Reply