<commit_before># ReduxEvaluation

**Table of Contents**

- [Overview](#overview)
- [App State](#app-state)
  - [State Specification](#state-specification)
  - [State Implementation](#state-implementation)
  - [State Promotion](#state-promotion)
  - [State Transition](#state-transition)
- [Simplified UI Components](#simplified-ui-components)
  - [React Approach](#react-approach)
  - [Redux Approach](#redux-approach)
  - [Redux Example](#redux-example)
- [Time Travel](#time-travel)
- [Conclusion](#conclusion)

## Overview

This project is an evaluation of the
[Redux](https://github.com/reactjs/redux/) framework (a popular
[Flux](https://facebook.github.io/flux/) implementation)
used in conjunction with [React](https://facebook.github.io/react/).

The app itself is a Shopping Cart, which is part of the
[CodeWinds](http://codewinds.com/) React 101 training course.

The app has been implemented in two different ways (found in different
branches of this project).  This allows you to directly compare the
two different implementations.  The branches are:

 - **PlainReact**: The original React app without
   Redux.  The top-level [`<App>`](../PlainReact/src/comp/app.jsx)
   component maintains application state, and contains the function to
   alter this state.  React properties are trickled down from this
   `<App>` component throughout the entire containment tree.

 - **ReduxReact**: A refactor of this same React app, utilizing the
   Redux framework.

What follows are the details of this Redux refactor.


## App State<commit_msg>add instllation instructions<commit_after># ReduxEvaluation

**Table of Contents**

- [Overview](#overview)
- [Run Project](#run-project)
- [App State](#app-state)
  - [State Specification](#state-specification)
  - [State Implementation](#state-implementation)
  - [State Promotion](#state-promotion)
  - [State Transition](#state-transition)
- [Simplified UI Components](#simplified-ui-components)
  - [React Approach](#react-approach)
  - [Redux Approach](#redux-approach)
  - [Redux Example](#redux-example)
- [Time Travel](#time-travel)
- [Conclusion](#conclusion)

## Overview

This project is an evaluation of the
[Redux](https://github.com/reactjs/redux/) framework (a popular
[Flux](https://facebook.github.io/flux/) implementation)
used in conjunction with [React](https://facebook.github.io/react/).

The app itself is a Shopping Cart, which is part of the
[CodeWinds](http://codewinds.com/) React 101 training course.

The app has been implemented in two different ways (found in different
branches of this project).  This allows you to directly compare the
two different implementations.  The branches are:

 - **PlainReact**: The original React app without
   Redux.  The top-level [`<App>`](../PlainReact/src/comp/app.jsx)
   component maintains application state, and contains the function to
   alter this state.  React properties are trickled down from this
   `<App>` component throughout the entire containment tree.

 - **ReduxReact**: A refactor of this same React app, utilizing the
   Redux framework.

What follows are the details of this Redux refactor.


## Run Project

If you want to run this project on your local machine, simply clone
the git repo (or zip it up), and follow these instructions.

- Install Project Dependencies

```
$ cd {project-root}
$ npm install
```

- For Development

```
$ cd {project-root}
$ npm start
> browse localhost:3005
```


## App State
{'fraction_non_alphanumeric': 0.11948955916473318, 'fraction_numerical': 0.002900232018561485, 'mean_word_length': 4.500797448165869, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 8, 'https://': 6, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 1, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3413250', 'n_tokens_mistral': 1051, 'n_tokens_neox': 971, 'n_words': 348}