loading...

Why State is important.

xanderjakeq profile image Xander Jake de los Santos ・2 min read

State-driven development is the programming paradigm where the views are dependent on the app's state. State is the data that an app collects to 'know' what is going on with itself and its interactions with the user. It can be its auth state, content data, or user clicks.

Tracking the state makes it easy for developers to visualize how the app will behave. We can see how the state will morph before we actually build up the UI, plan what components we need and how the state should affect our views. This Post has this hypothetical situation where a new developer needs to add a component to an app. This component needs to show different things based on the app's auth state.

This is a problem since a component would show two different unrelated things, signup or user's recent items. A component to show signup/login would make much more sense. This can be prevented when considering the state of the app beforehand. With this situation, as described in the other post, the task would be easier to understand. It would be clear that what should have been built are two components that will be displayed depending on the auth state.

Luckily, we have front-end libraries that allow us to easily be able o build state-driven web apps such as Reactjs. Reactjs has a great state management system for us to use. We can have the state at of the app bound to the topmost component then pass those data as props to child components and be change the views accordingly.

(I'm no expert correct me if I'm wrong)

Posted on by:

xanderjakeq profile

Xander Jake de los Santos

@xanderjakeq

Art and Code. currently @lambdaschool

Discussion

markdown guide