{"id":16768042,"url":"https://github.com/bouk/shux","last_synced_at":"2025-03-16T13:22:26.076Z","repository":{"id":140486654,"uuid":"42873557","full_name":"bouk/shux","owner":"bouk","description":"Object-oriented flux pattern implementation","archived":false,"fork":false,"pushed_at":"2015-09-21T15:02:38.000Z","size":107,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-01-23T01:11:22.198Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bouk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-09-21T15:01:57.000Z","updated_at":"2015-09-23T18:37:35.000Z","dependencies_parsed_at":"2023-03-13T08:56:00.220Z","dependency_job_id":null,"html_url":"https://github.com/bouk/shux","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bouk%2Fshux","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bouk%2Fshux/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bouk%2Fshux/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bouk%2Fshux/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bouk","download_url":"https://codeload.github.com/bouk/shux/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243872728,"owners_count":20361539,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-13T06:10:38.781Z","updated_at":"2025-03-16T13:22:26.055Z","avatar_url":"https://github.com/bouk.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# shux\n[![Build Status](https://travis-ci.org/boourns/shux.svg?branch=master)](https://travis-ci.org/boourns/shux)\n\nEasy to use flux pattern implementation\n\nShux is optimized for ease of use both by itself and with React.\n\nWhen you register a store, Shux creates proxy methods on the Dispatcher object for the store's actions.  If a store implements an action named `login`, we dispatch the login action in our application code by calling `Dispatcher.login(user, password)`.  This function will call the action against all the registered stores that implement the `login` action.  \n\nThis is easier to wrap your head around than firing methods via `Dispatcher.dispatch({type: 'login', user: user, password: password})` and tracking their implementations across your stores.\n\nThis also has the nice benefit that you do not need to track a list of ACTION_NAME constants, or have action creator functions.  You also don't need a big `switch` statement to determine which action was called - let the language handle the event dispatch for you.  This also improves performance.  No longer do we have to run every reducer, every `switch` block, and every string comparison on action types.  Shux tracks which stores implement which actions at store registration, and only calls the actions where implemented.\n\nShux requires extremely little boilerplate code.  I wrote it for other developers at [Shopify](https://shopify.com/) to be able to read the code that uses it.\n\nAll the other key concepts either came from [redux](https://github.com/rackt/redux) or [flux](https://github.com/facebook/flux).  After implementing a few features using Facebook's dispatcher, and a few features using redux, I wrote up what I felt the pros and cons of both implementations were.\n\nShux is an attempt to mitigate the cons, and steal the pros.\n\n# Other Features\nImplements Stores as singleton classes.  This gives a natural place to add methods that calculate derived state from the original state that is stored (aka business logic)\n\nLets stores handle their own state.  Redux is cool, but hiding the state initialization / management is not obvious to newcomers.\n\nComes with a React container that handles store update subscribe / unsubscribe so users don't need to think about these things.\n\n# Example\n\nCreate a store that receives two actions: `updateProduct` and `logout`.\n\n```javascript\n# ProductStore.js\nimport {Store,Dispatcher} from 'shux';\nclass ProductStore extends Store {\n  constructor() {\n    super();\n    this.state = {};\n\n    this.actions = {\n      updateProduct: (product) =\u003e {\n        this.state = product;\n      },\n\n      logout: () =\u003e {\n        this.state = {};\n      }\n    }\n  }\n\n  productIsNew() {\n    return !this.state.product.id;\n  }\n}\n\nvar productStore = new ProductStore();\n// register the store\nDispatcher.register(productStore);\n\nexport productStore\n```\n\nListen for store changes:\n```javascript\nimport ProductStore from './ProductStore';\n\nProductStore.subscribe(() =\u003e {\n  console.log(\"Product store updated\");\n  if (ProductStore.productIsNew()) {\n    console.log(\"Product is new!\");\n  }\n});\n```\n\nCall the `updateProduct` action:\n```javascript\nDispatcher.updateProduct({id: null, title: \"new!\"});\n```\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbouk%2Fshux","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbouk%2Fshux","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbouk%2Fshux/lists"}