{"id":16227641,"url":"https://github.com/leafoftree/react-int","last_synced_at":"2025-03-19T13:31:07.875Z","repository":{"id":43888285,"uuid":"182240780","full_name":"leafOfTree/react-int","owner":"leafOfTree","description":"A simple way to use react/react-native with redux and redux-saga.","archived":false,"fork":false,"pushed_at":"2024-09-16T02:51:45.000Z","size":707,"stargazers_count":4,"open_issues_count":1,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-28T18:48:19.565Z","etag":null,"topics":["dva","react","redux","redux-saga"],"latest_commit_sha":null,"homepage":"https://leafoftree.github.io/react-int/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/leafOfTree.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":"docs/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-04-19T09:36:40.000Z","updated_at":"2024-09-16T02:51:48.000Z","dependencies_parsed_at":"2024-01-08T01:44:05.574Z","dependency_job_id":"a2605bc7-5d0d-4c15-b964-bc682e3a3445","html_url":"https://github.com/leafOfTree/react-int","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/leafOfTree%2Freact-int","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leafOfTree%2Freact-int/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leafOfTree%2Freact-int/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leafOfTree%2Freact-int/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/leafOfTree","download_url":"https://codeload.github.com/leafOfTree/react-int/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243989730,"owners_count":20379648,"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":["dva","react","redux","redux-saga"],"created_at":"2024-10-10T12:53:23.585Z","updated_at":"2025-03-19T13:31:07.624Z","avatar_url":"https://github.com/leafOfTree.png","language":"JavaScript","readme":"\u003ch1 align=\"center\"\u003e\n  React-Int\n\u003c/h1\u003e\n\nA simple way to use [React][0]/[React Native][5] with [react-redux][1] and [redux-saga][2]. Keep most things in one file(model) like [Dva][3].\n\n## Features\n\n- Reducers and sagas in one file.\n- Namespace.\n- Key as action type. (Convenient)\n- HMR everywhere. (Need extra code snippet)\n- Promisified dispatch.\n- Handles Effect errors without terminating app.\n- [Supports React Native][8].\n- Works with [create-react-app][4].\n\nFeel free to make an issue or a pull request.\n\n## How it works\n\nReact-int is an encapsulation of react-redux and redux-saga, aiming to simplify code and related files. Its main job is to create store from models and render app.\n\n## Install\n\n    yarn add react-redux redux-saga react-int\n\n    # or \n    npm i react-redux redux-saga react-int\n\n## Usage\n\nStart app, write models and connect components. That's all. :tada:\n\n```javascript\n// index.js\nimport start from \"react-int\";\nimport App from \"./App\";\nimport models from \"./models\";\n\nconst { updateApp, updateModels } = start(\n  App,\n  document.getElementById(\"root\"),\n  models,\n  {/* options */},\n);\n\n// enable HMR\nif (module.hot \u0026\u0026 process.env.NODE_ENV !== 'production') {\n  module.hot.accept('./App', () =\u003e updateApp(App));\n  module.hot.accept('./models', () =\u003e updateModels(models));\n}\n```\n\nSee also\n\n- Full online demo: [![Edit react-int-demo](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/61wpmyj04r?fontsize=14)\n\n- [Quick start][6]\n\n- [APIs][7]\n\n## Usage with React Native\n\nSee [Usage with React Native][8]\n\n## Data Flow\n                                                          --Model-- \n           defines       triggers             sync       |         |   updates\n    State ----------\u003e UI ----------\u003e Actions ----------\u003e | Reducer | ----------\u003e Store\n      ^                                 |                |         |               |\n      |                                 |     async      |         |               |\n      |                                 |---------------\u003e|  Saga   |               |\n      |                                 |\u003c---------------|         |               |\n      |                                       puts        ---------                |\n      |                                                                            |\n       ----------------------------------------------------------------------------\n                                    contains\n\n\n## Documentation\n\nBasic introduction can be found on [the website](https://leafoftree.github.io/react-int).\n\nRefer to [react][0], [react-redux][1], [redux-saga][2] for further documentation.\n\n## Development\n\nSee \u003ca href=\"https://leafoftree.github.io/react-int/#/development\"\u003eDevelopment\u003c/a\u003e.\n\n[0]: https://github.com/facebook/react\n[1]: https://github.com/reduxjs/react-redux\n[2]: https://github.com/redux-saga/redux-saga\n[3]: https://github.com/dvajs/dva\n[4]: https://github.com/facebook/create-react-app\n[5]: https://github.com/facebook/react-native\n[6]: https://leafoftree.github.io/react-int/#/quick_start\n[7]: https://leafoftree.github.io/react-int/#/apis\n[8]: https://leafoftree.github.io/react-int/#/usage_with_react_native\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fleafoftree%2Freact-int","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fleafoftree%2Freact-int","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fleafoftree%2Freact-int/lists"}