{"id":25061691,"url":"https://github.com/markgeeromano/smol-store","last_synced_at":"2026-05-03T16:31:47.804Z","repository":{"id":57364232,"uuid":"159273818","full_name":"MarkGeeRomano/Smol-Store","owner":"MarkGeeRomano","description":"A simple, redux-inspired global store for electron apps ⚛️","archived":false,"fork":false,"pushed_at":"2018-12-03T18:19:33.000Z","size":122,"stargazers_count":3,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-03-18T13:57:35.663Z","etag":null,"topics":["electron","redux","state-management"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/MarkGeeRomano.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":"2018-11-27T04:00:40.000Z","updated_at":"2019-05-12T21:10:25.000Z","dependencies_parsed_at":"2022-09-13T21:12:59.838Z","dependency_job_id":null,"html_url":"https://github.com/MarkGeeRomano/Smol-Store","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/MarkGeeRomano%2FSmol-Store","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MarkGeeRomano%2FSmol-Store/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MarkGeeRomano%2FSmol-Store/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MarkGeeRomano%2FSmol-Store/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MarkGeeRomano","download_url":"https://codeload.github.com/MarkGeeRomano/Smol-Store/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246457993,"owners_count":20780679,"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":["electron","redux","state-management"],"created_at":"2025-02-06T16:54:11.127Z","updated_at":"2026-05-03T16:31:47.765Z","avatar_url":"https://github.com/MarkGeeRomano.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Smol-Store \u003cimg src=\"./github/totoro.gif\" width=\"30\"\u003e\n\nA smol redux-inspired store for your electron app.\n\n## Installation\n```\nnpm install smol-store\n```\n\n## Philosophy\nSure, there are other libraries out there that achieve the same, but this lib is  _very smol_, it's dumb simple (~75 lines of code), and the API consists of only 4 functions.\n\nThis was implemented from scratch in an [@araBlocks][araBlocks] electron application. It's been a real asset, so it's been pulled out and packed into an npm module.\n\n## Usage\n```js\n//reducers.js\nmodule.exports = {\n aNumber: (state, load) =\u003e {\n  switch (load.type) {\n    case 'ADD_1':\n      state += 1\n      break\n    case 'ADD_2':\n      state += 2\n      break\n    default:\n      state += load.value\n    }\n    return state\n  }\n}\n```\n```js\n//state.js\nmodule.exports = { aNumber: 0 } //property names must match reducer names\n```\n```js\n//main.js (root of electron app)\nconst smolStore = require('smol-store')\nconst state = require('./state')\nconst reducers = require('./reducers')\n\nsmolStore.initialize(state, reducers))//initialize needs to be called before API can be used\n\n//set regular listeners for main process - call `dispatch` when heard\nipcMain.on('increment_1', () =\u003e smolStore.dispatch({ type: 'ADD_1' }))\nipcMain.on('increment_2', () =\u003e smolStore.dispatch({ type: 'ADD_2' }))\nipcMain.on('increment_custom', (event, value) =\u003e smolStore.dispatch({ type: 'CUSTOM', load: { value } }))\n```\n```js\n//index.js (script for index.html)\nconst { ipcRenderer } = require('electron')\nconst { subscribe, state } = require('smol-store')\n\ndocument.getElementById('button1').onclick = () =\u003e ipcRenderer.send('increment_1')\ndocument.getElementById('button2').onclick = () =\u003e ipcRenderer.send('increment_2')\ndocument.getElementById('button3').onclick = () =\u003e ipcRenderer.send('increment_custom', Math.random())\n\nconst display = document.getElementById('display')\n\ndisplay.innerText = state.aNumber//`state` is the object created in state.js, made global through `initialize`\n\n//the callback passed into `subscribe` will be called when the `state` has been changed.\nsubscribe(() =\u003e display.innerText = state.aNumber)\n```\n\n## API\n\n### `someReducerName(state, load)`\nA function that corresponds to a property on the state that holds instructions for modifying that piece of the state, based on the `type` value the `load` holds. _Must be called in main process_ \n- `state` - The property of the state that corresponds to the reducer\n- `load` - An optional value passed into the reducer\n\n\n### `initialize(state, reducers, [opts])`\nSets the initial app state and creates the dispatch function you'll use to update your state.\n- `state` - An object representing the initial state of the app.\n- `reducers` - An object with properties whose values are **functions**, whose property names are the **same** as the `state` property it corresponds to. The function will work to modify that part of the `state`.\n- `opts` - An object you can add properties to that will change the value of the string `dispatch` emits to renderer processes, the value of the string your renderer process emits to the main renderer to subscribe to changes, and the value the renderer process emits to unsubscribe to changes. I'd leave the defaults unless your having naming clashes 😁. The properties you can add to opts:\n  - `kRefresh` (default: `'REFRESH'`) - Triggers callback passed into `subscribe`\n  - `kSubscribe` (default: `'SUBSCRIBE'`) - Subscribes a renderer process to state changes\n  - `kUnsubscribe` (default: `'UNSUBSCRIBE'`) - Removes subscription from renderer process\n\n\n### `state`\nA [`getter`][getter] function that returns the `state`. Stored in the main process' `global` variable.\n\n### `dispatch(load)`\nDispatches an object to all reducers to modify the state accordinly. Will emit a `'REFRESH'` message to all subscribed renderer processes after updating state. _Must be called in main process_.\n\n- `load` - an object with atleast one property called `type`. Other properties that hold arbitrary values can be added\n\n### `subscribe(callback)`\nEmits a `'SUBSCRIBE'` message from the given renderer process to the main process to ensure it emits a `'REFRESH'` message to it when state has changed. Creates a listener for the message, and upon the deletion of the given render process, emits an `'UNSUBSCRIBE'` message to the main process. _Must be called in renderer process_.\n\n- `callback` - This callback will fire anytime the `'REFRESH'` event is heard. Most often this will use the updated state to render UI changes.\n\n[getter]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get\n[araBlocks]: https://github.com/AraBlocks/","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmarkgeeromano%2Fsmol-store","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmarkgeeromano%2Fsmol-store","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmarkgeeromano%2Fsmol-store/lists"}