# Redux and Component Architecture

In the previous example, our `counter` component is a smart component. It knows about redux, the structure of the state, and the actions it needs to call. While in theory you can drop this component into any area of your application and have it just work. But, it will be tightly bound to that specific slice of state, and those specific actions. For example, what if we wanted to have multiple counters tracking different things on the page? For example, counting the number of red clicks vs blue clicks.

To help make components more generic and reusable, it is worth considering smart component, or container components - and dumb components.

|                | Container Components      | Presentational Components   |
| -------------- | ------------------------- | --------------------------- |
| Location       | Top level, route handlers | Middle and leaf components  |
| Aware of Redux | Yes                       | No                          |
| To read data   | Subscribe to Redux state  | Read data from props        |
| To change data | Dispatch Redux actions    | Invoke callbacks from props |

[Redux Docs](http://redux.js.org/docs/basics/UsageWithReact.html)
