# Speedometer 3.0: TodoMVC: React-Redux

## Description

This application uses React in combination with Redux to implement a todo application.

-   [React](https://reactjs.org/) is a JavaScript library for creating user interfaces.
-   [Redux](https://redux.js.org/) centralizes your application's state.
-   [React-Redux](https://react-redux.js.org/) is designed to work with React's component model.

## Implementation details

This implementation uses Redux to manage state and data flow of the application.
The Redux pattern is similar to a mvc patter, with the main difference that Redux is unidirectional.
Redux uses actions to dispatch a change, which is captured by reducers that update a central store.
Once the state in the store updates, the view receives the new state and can reflect those changes to the user.

Redux:\
Model: Redux store\
View: React ui components\
controller: React connected components + Redux reducers

MVC:\
Model: maintains the data and behavior of an application\
View: displays the model in the ui\
Controller: serves as an interface between view & model components

The storage solution uses an in-memory data object that implements a simple array to hold the todos.

## Built steps

To build the static files, this application utilizes webpack. It minifies and optimizes output files and copies all necessary files to a `dist` folder.

## Requirements

The only requirement is an installation of Node, to be able to install dependencies and run scripts to serve a local server.

```
* Node (min version: 18.13.0)
* NPM (min version: 8.19.3)
```

## Local preview

```
terminal:
1. npm install
2. npm run dev
browser:
1. http://localhost:7001/
```