{"id":23101166,"url":"https://github.com/codemask-labs/stan-js","last_synced_at":"2025-05-16T15:05:40.863Z","repository":{"id":219743803,"uuid":"732075212","full_name":"codemask-labs/stan-js","owner":"codemask-labs","description":null,"archived":false,"fork":false,"pushed_at":"2025-04-09T07:08:36.000Z","size":28798,"stargazers_count":151,"open_issues_count":0,"forks_count":1,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-04-12T14:19:40.360Z","etag":null,"topics":["context","intellisense","react","rerenders","state","store","typescript"],"latest_commit_sha":null,"homepage":"https://codemask-labs.github.io/stan-js/","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/codemask-labs.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-12-15T15:24:22.000Z","updated_at":"2025-04-09T07:08:39.000Z","dependencies_parsed_at":null,"dependency_job_id":"0a86ceca-354a-4dc0-a9eb-7f643c5258ba","html_url":"https://github.com/codemask-labs/stan-js","commit_stats":null,"previous_names":["codemaskinc/createstore","codemaskinc/store","codemask-labs/store","codemask-labs/stan-js"],"tags_count":20,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codemask-labs%2Fstan-js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codemask-labs%2Fstan-js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codemask-labs%2Fstan-js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codemask-labs%2Fstan-js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codemask-labs","download_url":"https://codeload.github.com/codemask-labs/stan-js/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248578875,"owners_count":21127714,"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":["context","intellisense","react","rerenders","state","store","typescript"],"created_at":"2024-12-16T23:50:32.119Z","updated_at":"2025-04-12T14:19:49.727Z","avatar_url":"https://github.com/codemask-labs.png","language":"TypeScript","readme":"[![TypeScript](https://img.shields.io/badge/typescript-%230276C7?style=for-the-badge\u0026logo=typescript\u0026logoColor=%23fff\u0026link=https%3A%2F%2Fwww.typescriptlang.org%2F)](https://typescriptlang.org)\n[![React](https://img.shields.io/badge/react-%23077EA4?style=for-the-badge\u0026logo=react\u0026logoColor=%23fff\u0026link=https%3A%2F%2Freact.dev%2F)](https://react.dev/)\n[![ReactNative](https://img.shields.io/badge/react%20native-%23282C34?style=for-the-badge\u0026logo=react\u0026logoColor=%2360DAFB\u0026link=https%3A%2F%2Freact.dev%2F)](https://reactnative.dev/)\n[![platform - ssr](https://img.shields.io/badge/SSR-black?style=for-the-badge\u0026logo=next.js\u0026logoColor=white)](https://nextjs.org/)\n[![MIT](https://img.shields.io/npm/l/%40codemaskinc%2Fstore?style=for-the-badge)](https://mit-license.org/)\n[![NPM Version](https://img.shields.io/npm/v/stan-js?style=for-the-badge\u0026link=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Fstan-js)](https://www.npmjs.com/package/stan-js)\n[![NPM Downloads](https://img.shields.io/npm/dw/stan-js?style=for-the-badge\u0026link=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Fstan-js)](https://www.npmjs.com/package/stan-js)\n\n\u003cimg src=\"./assets/baner.png\" alt=\"stan-js\" width=\"100%\" height=\"auto\" /\u003e\n\n## Overview\n\nstan-js is a lightweight and flexible state management library designed for use in React, React Native and even vanilla-js applications. It simplifies the process of managing state in your application by providing a simple `createStore` function. This package aims to offer a straightforward solution for state management without the need for extensive type definitions or repetitive code.\n\n## Features\n\n- ⚡️ Performance and minimal re-renders\n- ✍️ Simple configuration\n- ⚛️ Out of the box React integration\n- 💾 Built in data persistence\n- 🚀 Amazing typescript IntelliSense\n- 🪝 Easy access to all store values\n- 🪶 Very lightweight\n- 🥳 No dependencies\n- 🛡️ 100% Test coverage\n\n## Installation\n\nInstall package using preferred package manager:\n\n```bash\nnpm install stan-js\nyarn add stan-js\npnpm add stan-js\nbun add stan-js\n```\n\n## Demos\n\n##### React\n\n[![Open in repo](https://img.shields.io/badge/github-pages?style=for-the-badge\u0026logo=github\u0026logoColor=white\u0026color=black\n)](https://github.com/codemask-labs/stan-js/tree/main/examples/react)\n[![Open in StackBlitz](https://img.shields.io/badge/Stackblitz-fff?style=for-the-badge\u0026logo=stackblitz\u0026logoColor=white\u0026labelColor=%231374EF\u0026color=%231374EF\n)](https://stackblitz.com/github/codemask-labs/stan-js/tree/main/examples/react)\n\n##### Astro + React\n\n[![Open in repo](https://img.shields.io/badge/github-pages?style=for-the-badge\u0026logo=github\u0026logoColor=white\u0026color=black\n)](https://github.com/codemask-labs/stan-js/tree/main/examples/astro)\n[![Open in StackBlitz](https://img.shields.io/badge/Stackblitz-fff?style=for-the-badge\u0026logo=stackblitz\u0026logoColor=white\u0026labelColor=%231374EF\u0026color=%231374EF\n)](https://stackblitz.com/github/codemask-labs/stan-js/tree/main/examples/astro)\n\n##### Next.js SSR\n\n[![Open in repo](https://img.shields.io/badge/github-pages?style=for-the-badge\u0026logo=github\u0026logoColor=white\u0026color=black\n)](https://github.com/codemask-labs/stan-js/tree/main/examples/nextjs)\n[![Open in StackBlitz](https://img.shields.io/badge/Stackblitz-fff?style=for-the-badge\u0026logo=stackblitz\u0026logoColor=white\u0026labelColor=%231374EF\u0026color=%231374EF\n)](https://stackblitz.com/github/codemask-labs/stan-js/tree/main/examples/nextjs)\n\n## Getting Started\n\nCreate a store with initial state:\n\nYou can think of a store as your app state. You can define multiple keys/values, each key will create separated subscription ([more explained here](https://codemask-labs.github.io/stan-js/reference/createstore/#usestore)). If you want to persist the value - you can simply wrap it in [Synchronizer](https://codemask-labs.github.io/stan-js/reference/synchronizer/)\n\n```typescript\nimport { createStore } from 'stan-js'\nimport { storage } from 'stan-js/storage'\n\nexport const { useStore } = createStore({\n    count: 0,\n    get doubleCount() {\n        return this.count * 2\n    }, \n    user: storage(''),\n    selectedLanguage: 'en-US',\n    unreadNotifications: [] as Array\u003cNotification\u003e\n})\n```\n\nUse the returned hook in your React component:\n\n```typescript\nimport { useStore } from './store'\n\nconst App = () =\u003e {\n    const { count, user, setCount } = useStore()\n\n    return (\n        \u003cdiv\u003e\n            \u003ch1\u003eHello {user}!\u003c/h1\u003e\n            \u003cp\u003eCount: {count}\u003c/p\u003e\n            \u003cbutton onClick={() =\u003e setCount(prev =\u003e prev + 1)}\u003eIncrement\u003c/button\u003e\n            \u003cbutton onClick={() =\u003e setCount(prev =\u003e prev - 1)}\u003eDecrement\u003c/button\u003e\n        \u003c/div\u003e\n    )\n}\n```\n\nCheck out our [Docs](https://codemask-labs.github.io/stan-js/) for more information and examples.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodemask-labs%2Fstan-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodemask-labs%2Fstan-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodemask-labs%2Fstan-js/lists"}