{"id":49064,"library":"react-mkx-storage","title":"react-mkx-storage","description":"A React hook library (v1.1.9) providing useLocalStorage, useSessionStorage, and useCookieStorage for state management across browser storage APIs. Minimal API surface with three named hooks, each accepting a key and initial value. Suitable for small-to-medium React projects needing persistent state without a state management library. Last updated in 2023; low release cadence.","status":"active","version":"1.1.9","language":"javascript","source_language":"en","source_url":null,"tags":["javascript","reactjs","broswer","localStorage","sessionStorage","storage"],"install":[{"cmd":"npm install react-mkx-storage","lang":"bash","label":"npm"},{"cmd":"yarn add react-mkx-storage","lang":"bash","label":"yarn"},{"cmd":"pnpm add react-mkx-storage","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for hooks API.","package":"react","optional":false}],"imports":[{"note":"Named export, not default.","wrong":"import useLocalStorage from 'react-mkx-storage'","symbol":"useLocalStorage","correct":"import { useLocalStorage } from 'react-mkx-storage'"},{"note":"CommonJS require is possible but not recommended in ESM projects.","wrong":"const useSessionStorage = require('react-mkx-storage').useSessionStorage","symbol":"useSessionStorage","correct":"import { useSessionStorage } from 'react-mkx-storage'"},{"note":"Named export, correct usage shown.","symbol":"useCookieStorage","correct":"import { useCookieStorage } from 'react-mkx-storage'"}],"quickstart":{"code":"import React from 'react';\nimport { useLocalStorage } from 'react-mkx-storage';\n\nfunction App() {\n  const [name, setName] = useLocalStorage('name', 'John');\n  return (\n    <div>\n      <p>Hello, {name}!</p>\n      <input value={name} onChange={e => setName(e.target.value)} />\n    </div>\n  );\n}\n\nexport default App;","lang":"javascript","description":"Shows basic usage of useLocalStorage hook with a default value and input binding."},"warnings":[{"fix":"Manually listen to storage events if cross-tab sync is needed.","message":"Hook does not synchronize state across tabs for localStorage or sessionStorage.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Store smaller serialized data or consider backend storage for large payloads.","message":"useCookieStorage may have limited max cookie size (typically 4096 bytes per cookie).","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Only pass JSON-serializable initial values.","message":"Initial value type must be serializable (string, number, object, array) – functions or symbols will cause errors on JSON.parse.","severity":"gotcha","affected_versions":">=0.0.0"}],"env_vars":null,"search_vec":"'2023':55 'accept':30 'across':18 'api':21,23 'broswer':61 'browser':19 'cadenc':58 'hook':7,28 'initi':34 'javascript':59 'key':32 'last':52 'librari':8,51 'localstorag':62 'low':56 'manag':17,50 'medium':41 'minim':22 'mkx':3 'name':27 'need':44 'persist':45 'project':43 'provid':10 'react':2,6,42 'react-mkx-storag':1 'reactj':60 'releas':57 'sessionstorag':63 'small':39 'small-to-medium':38 'state':16,46,49 'storag':4,20,64 'suitabl':36 'surfac':24 'three':26 'updat':53 'usecookiestorag':14 'uselocalstorag':11 'usesessionstorag':12 'v1.1.9':9 'valu':35 'without':47","created_at":"2026-06-07T16:59:51.783463+00:00","updated_at":"2026-06-07T16:59:51.783463+00:00","problems":[{"fix":"Use correct named imports: import { useLocalStorage } from 'react-mkx-storage'","cause":"Importing default export instead of named export.","error":"TypeError: Cannot read properties of undefined (reading 'from')"},{"fix":"Wrap hook usage in a component that is only rendered client-side.","cause":"Using hooks in non-browser environment (SSR) or with third-party cookies blocked.","error":"Uncaught DOMException: Failed to read the 'localStorage' property from 'Window': Access is denied for this document."},{"fix":"Ensure the component runs in browser context and key is consistent.","cause":"Key may be missing or storage was cleared; also SSR environment.","error":"Value is not saved after page refresh"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://react-mkx-storage.vercel.app","github":null,"docs":null,"changelog":null,"pypi":null,"npm":"react-mkx-storage","openapi_spec":null,"status_page":null,"smithery":null,"categories":["storage"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}