- Published on
useLocalStorage Hook React

useLocalStorage Hook React
useLocalStorage Code and Usage
useLocalStorage is a hook to interact with browsers local storage.
import { useState } from "react";
const useLocalStorage = (key, initialValue) => {
const [storedValue, setStoredValue] = useState(() => {
const item = window.localStorage.getItem(key);
return item ? JSON.parse(item) : initialValue;
});
const setValue = (value) => {
setStoredValue(value);
window.localStorage.setItem(key, JSON.stringify(value));
};
return [storedValue, setValue];
};
// Usage
const LocalStorageExample = () => {
const [count, setCount] = useLocalStorage("count", 0);
return (
<div>
<p>Count: {count}</p>
<button onClick={() => setCount(count + 1)}>Increment</button>
</div>
);
};