State management

Karthiksharma
2 min readDec 3, 2020

(Flutter +Firebase+ Mobx)

Flutter is declarative. This means that Flutter builds its user interface to reflect the current state of your app:

When the state of your app changes (for example, the user flips a switch in the settings screen), you change the state, and that triggers a redraw of the user interface. There is no imperative changing of the UI itself (like widget.setText)—you change the state, and the UI rebuilds from scratch.

Step 1:

add packages in pubsec.yaml .

Step 2:

now create the file store_observer.dart:

Step 3:

Integerate your flutter application with firebase . and generate the cloud firestore database .

simply make a database according to you in cloud firestore.

Step 4:

generating of the model accordring to the cloud firestore. in a file name model.py

Step 5:

Generating of the mobx database store. (run this command in command prompt)

flutter packages pub run build_runner build — delete-conflicting-outputs

Step -6:

create a file name getservices.py. here you will write all the services that you want from cloud firestore

Step 7:

generating the mobx store. this the most important step. give the file name restaurant_store.dart

Step 8:

Generating of the mobx store. (run this command in command prompt)

flutter packages pub run build_runner build — delete-conflicting-outputs

Step 9:

Intializing the store and the provider in the main.dart

Step 10:

make a file name homepage.py

here you will call the stores in your presentation.

there is widget I am using is customPopularCard in place of that you can make your own beautiful widget . and use it

--

--

Karthiksharma

I’m a Mobile Developer enthusiast & a junior pursuing my Bachelors in Computer Science . I am passionate about Data Structure, Web Dev, Machine Learning.