{"id":17138140,"url":"https://github.com/esamattis/redux-hooks","last_synced_at":"2025-07-20T15:32:28.063Z","repository":{"id":57111777,"uuid":"168997759","full_name":"esamattis/redux-hooks","owner":"esamattis","description":"⚓ React Hooks implementation for Redux","archived":false,"fork":false,"pushed_at":"2019-03-24T15:46:39.000Z","size":118,"stargazers_count":96,"open_issues_count":4,"forks_count":4,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-07-08T08:07:59.170Z","etag":null,"topics":["react-hooks","redux","typescript"],"latest_commit_sha":null,"homepage":"http://npm.im/@epeli/redux-hooks","language":"TypeScript","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/esamattis.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-02-03T21:52:09.000Z","updated_at":"2022-11-17T11:19:58.000Z","dependencies_parsed_at":"2022-08-21T00:01:05.309Z","dependency_job_id":null,"html_url":"https://github.com/esamattis/redux-hooks","commit_stats":null,"previous_names":["epeli/redux-hooks"],"tags_count":16,"template":false,"template_full_name":null,"purl":"pkg:github/esamattis/redux-hooks","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/esamattis%2Fredux-hooks","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/esamattis%2Fredux-hooks/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/esamattis%2Fredux-hooks/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/esamattis%2Fredux-hooks/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/esamattis","download_url":"https://codeload.github.com/esamattis/redux-hooks/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/esamattis%2Fredux-hooks/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266151524,"owners_count":23884436,"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":["react-hooks","redux","typescript"],"created_at":"2024-10-14T20:08:52.937Z","updated_at":"2025-07-20T15:32:28.046Z","avatar_url":"https://github.com/esamattis.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ⚓ @epeli/redux-hooks\n\n\u003cstrike\u003e\n React Hooks implementation for Redux that does not suffer from the tearing /\n\"zombie child component\" problems.\n\u003c/strike\u003e\n\n**UPDATE** Nope. This is buggy too. And so is every other Redux Hooks lib.\n\n\nIt also implements performance optimizations eg. does not render when the map\nstate function does not produce new value and allows advanced\noptimizations with memoizing and dependency arrays.\n\nWritten in TypeScript so types are baked in and always up to date.\n\n## 📦 Install\n\n    npm install @epeli/redux-hooks\n\n## 📖 Usage\n\n```ts\nimport {useMapState, useActionCreators} from \"@epeli/redux-hooks\";\n\nconst ActionCreators = {\n    inc() {\n        return {type: \"INCREMENT\"};\n    },\n};\n\nfunction Counter() {\n    const count = useMapState(state =\u003e state.count);\n    const actions = useActionCreators(ActionCreators);\n\n    return \u003cbutton onClick={actions.inc}\u003e{count}\u003c/button\u003e;\n}\n```\n\nYour components must be wrapped with the `HooksProvider`\n\n```ts\nimport {HooksProvider} from \"@epeli/redux-hooks\";\n\nReactDOM.render(\n    \u003cHooksProvider store={store}\u003e\n        \u003cCounter /\u003e\n    \u003c/HooksProvider\u003e,\n    document.getElementById(\"app\"),\n);\n```\n\nCustom provider is required for now because the official react-redux bindings\ndo not use subscriptions and it's impossible to implement Redux hooks without\nefficiently. Read more about it\n[here](https://github.com/reduxjs/react-redux/issues/1177).\n\n## 📚 Available hooks\n\n-   `useMapState()` Renders when returned value differ using [`Object.is()`][is] check\n-   `useSelect()` Renders when returned value differ using shallow equal check\n-   `useActionCreators()` Bind object of action creators to dispatch\n-   `useDispatch()` Returns the plain dispatch-function\n-   `usePassiveMapState()` Like `useMapState()` but does not subscribe to the\n    store eg. is executed only when the component renders.\n\n[is]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is\n\nPlease read the [optimizations docs](docs/optimizing.md) for details when to use these.\n\n## TypeScript usage\n\nYou can use `createHooks()` factory to create custom typed version of the hooks\n\n```ts\nimport {createHooks} from \"@epeli/redux-hooks\";\n\nconst AppHooks = createHooks\u003c{foo: string}\u003e();\n\nfunction Foo() {\n    const foo = AppHooks.useMapState(state =\u003e state.foo);\n    return \u003cdiv\u003eString: {foo}\u003c/div\u003e;\n}\n```\n\n## Examples\n\nCodesandbox: https://codesandbox.io/s/github/epeli/typescript-redux-todoapp/tree/hooks\n\nGithub: https://github.com/epeli/typescript-redux-todoapp/tree/hooks\n\n## 🤔 Why yet another Redux Hooks implementation?\n\nAll the others I checked had the zombie child bug, poor performance or were missing TypeScript types.\n\nEven the `facebookincubator/redux-react-hook` one has the zombie bug which is stated in their [FAQ](https://github.com/facebookincubator/redux-react-hook/blob/da74ab765c200133f86b629869ba1fdbf46afa97/README.md#how-does-this-compare-to-react-redux). This one guarantees data flow top down like the official react-redux one does.\n\nThis also an experiment for the future of the react-redux:\n\nhttps://github.com/reduxjs/react-redux/issues/1177#issuecomment-460097106\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fesamattis%2Fredux-hooks","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fesamattis%2Fredux-hooks","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fesamattis%2Fredux-hooks/lists"}