{"id":19178041,"url":"https://github.com/cmdruid/use-store","last_synced_at":"2026-05-07T19:05:16.720Z","repository":{"id":175648221,"uuid":"653874025","full_name":"cmdruid/use-store","owner":"cmdruid","description":"A simple and easy-to-use reducer store, made with pure react.","archived":false,"fork":false,"pushed_at":"2024-04-20T23:18:43.000Z","size":82,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-12-09T23:42:36.809Z","etag":null,"topics":["hook","react","reducer","redux"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/@cmdcode/use-store","language":"CSS","has_issues":true,"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/cmdruid.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-06-14T23:48:51.000Z","updated_at":"2024-04-20T23:18:47.000Z","dependencies_parsed_at":null,"dependency_job_id":"952b5b7c-851d-4192-93f9-4ad9603a2594","html_url":"https://github.com/cmdruid/use-store","commit_stats":{"total_commits":19,"total_committers":2,"mean_commits":9.5,"dds":"0.26315789473684215","last_synced_commit":"a46c80d71f7ea20e646da99b367f86ce9f35c0a2"},"previous_names":["cmdruid/use-store"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/cmdruid/use-store","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cmdruid%2Fuse-store","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cmdruid%2Fuse-store/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cmdruid%2Fuse-store/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cmdruid%2Fuse-store/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cmdruid","download_url":"https://codeload.github.com/cmdruid/use-store/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cmdruid%2Fuse-store/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32751790,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-07T02:14:30.463Z","status":"ssl_error","status_checked_at":"2026-05-07T02:14:29.405Z","response_time":62,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["hook","react","reducer","redux"],"created_at":"2024-11-09T10:36:18.800Z","updated_at":"2026-05-07T19:05:16.687Z","avatar_url":"https://github.com/cmdruid.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# use-store\n\nA simple and easy-to-use reducer store, made with pure react.\n\n- Create a store and context provider with default values.\n- Uses a simple API: `store`, `update`, and `reset`.\n- Easily setup your own type interface for full type saftey!\n\n## Import\n\nThis package is available on NPM for easy import:\n\n```bash\n# Using NPM\nnpm install @cmdcode/use-store\n# Using Yarn\nyarn add @cmdcode/use-store\n```\n\n## Basic Usage\n\nFirst, create a custom store:\n\n`/your-project/src/context/DemoStore.tsx`\n\nHere is an example of how to create a demo store:\n\n```tsx\n// Import the package.\nimport { createStore, StoreAPI } from '@cmdcode/use-store'\n\n// Setup your own custom Store interface.\nexport interface DemoStore {\n  posts : string[]\n}\n\n// Setup the default values for your store.\nconst defaults : DemoStore = {\n  posts : []\n}\n\n// Optional: If you would like to return a custom store object, use a\n// middleware method that takes the default store and returns a custom store.\nconst middleware = (store : StoreAPI\u003cDemoStore\u003e) =\u003e {\n  const say_hello = () =\u003e console.log('hello world!')\n  return { ...store, say_hello }\n}\n\n// Optional: If you would like the store to be cached in the browser's \n// session storage, define a key for the session store.\nconst session_key = 'my_unique_key'\n\n// Export the provider and store hook for use in your app.\nexport const { StoreProvider, useStore } = createStore({ defaults, middleware, session_key })\n```\n\nThe next step is to wrap your react app with the store provider:\n\n```tsx\n// Example base app for react / nextjs.\n// Your project may look slightly different.\nimport { StoreProvider } from './src/context/DemoStore.js'\n\nexport default function App ({ Component, pageProps }) {\n  return (\n    \u003cStoreProvider\u003e\n      \u003cComponent {...pageProps} /\u003e\n    \u003c/StoreProvider\u003e\n  )\n}\n```\n\nWith the `StoreProvider` configured, importing the store is relatively simple.\n\nHere is a basic example of reading from the store:\n\n```tsx\nimport { useStore } from './src/context/DemoStore.js'\n\nexport default function View () {\n  const { store } = useStore()\n\n  return (\n    \u003cdiv\u003e\n      \u003ch2\u003eLatest Posts:\u003c/h2\u003e\n      { store.posts.map(post =\u003e \u003cpre\u003e{ post }\u003c/pre\u003e) }\n    \u003c/div\u003e\n  )\n}\n```\n\nHere is an example of updating and resetting the store:\n\n```tsx\nimport { useState } from 'react'\nimport { useStore } from './src/context/DemoStore.js'\n\nexport default function Post () {\n  const [ text, setText ] = useState('')\n  const { store, update, reset } = useStore()\n\n  const submit = () =\u003e {\n    const posts = [ ...store.posts, text ]\n    console.log(posts)\n    update({ posts })\n  }\n\n  const clear = () =\u003e {\n    reset()\n  }\n\n  return (\n    \u003cdiv\u003e\n      \u003cinput \n        name     = 'post' \n        value    = { text } \n        onChange = { (e) =\u003e setText(e.target.value) }\n      /\u003e\n      \u003cdiv className='controls'\u003e\n        \u003cbutton onClick={ submit }\u003eSubmit\u003c/button\u003e\n        \u003cbutton onClick={ clear }\u003eClear\u003c/button\u003e\n      \u003c/div\u003e\n      \n    \u003c/div\u003e\n  )\n}\n```\n\n## Development / Testing\n\nThis library uses `yarn` for package management and `vite` for a development / demo server.\n\n```bash\n## Clean up any old builds:\nyarn clean\n## Start the vite development server:\nyarn dev\n## Release a new build:\nyarn release\n```\n\n## Bugs / Issues\n\nIf you run into any bugs or have any questions, please submit an issue ticket.\n\n## Contribution\n\nFeel free to fork and make contributions. Suggestions are welcome!\n\n## License\n\nUse this library however you want!\n\n## Contact\n\nYou can find me on nostr at: `npub1gg5uy8cpqx4u8wj9yvlpwm5ht757vudmrzn8y27lwunt5f2ytlusklulq3`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcmdruid%2Fuse-store","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcmdruid%2Fuse-store","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcmdruid%2Fuse-store/lists"}