https://github.com/thinkswan/flux-shopping-cart

A Flux app that allows users to manage a shopping cart.
https://github.com/thinkswan/flux-shopping-cart

flux javascript react tutorial

Last synced: about 2 months ago
JSON representation

A Flux app that allows users to manage a shopping cart.

• Host: GitHub
• URL: https://github.com/thinkswan/flux-shopping-cart
• Owner: thinkswan
• License: mit
• Created: 2019-06-27T18:19:11.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2021-03-09T15:26:37.000Z (almost 4 years ago)
• Last Synced: 2024-05-27T12:15:23.070Z (7 months ago)
• Topics: flux, javascript, react, tutorial
• Language: JavaScript
• Size: 73.2 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# flux-shopping-cart

A Flux app that allows users to manage a shopping cart.

Based on the tutorial found at

https://scotch.io/tutorials/creating-a-simple-shopping-cart-with-react-js-and-flux.

## How to use

```

git clone [email protected]:thinkswan/flux-shopping-cart.git

npm install

npm start

```

This will start a server at http://localhost:5000/.

## How to deploy

Click the button below to spin up your own copy of the app in a Heroku

instance.

[![Deploy to Heroku](https://www.herokucdn.com/deploy/button.png)](https://heroku.com/deploy)

## How it works

The app is bootstrapped by loading mock data into local storage, then using a

mock API to retrieve the data and use it to initialize the `ProductStore`.

Following the Flux architecture, React views trigger actions, which are then

sent to the dispatcher, which notifies any stores who have registered callbacks.

When the affected stores modify their data, they emit a `change` event, which

causes the `FluxCartApp` controller view to update its state. Changes are then

passed to child components via props.

The app is stateless, so refreshing the page will clear all items from the cart.

## License

MIT