localStorage / sessionStorage

// ── localStorage: ブラウザにデータを永続保存 ─────────────
// ページを閉じても残る。ドメインごとに独立している

// 保存: 文字列しか保存できないのでオブジェクトは JSON に変換
const user = { name: '田中', age: 25, theme: 'dark' };
localStorage.setItem('user', JSON.stringify(user)); // オブジェクト
localStorage.setItem('theme', 'dark');              // 文字列はそのまま

// 読み込み: JSON.parse で元のオブジェクトに戻す
const saved = localStorage.getItem('user');
const parsedUser = saved ? JSON.parse(saved) : null; // null チェック必須！

// 削除
localStorage.removeItem('user');  // 特定のキーを削除
localStorage.clear();             // 全て削除（⚠️ 注意！）

// ── sessionStorage: タブ/ウィンドウを閉じると消える ───
// localStorageと同じAPIで使える
sessionStorage.setItem('cart', JSON.stringify(cartItems));

// ── Reactでよく使うパターン: カスタムフック ──────────
function useLocalStorage<T>(key: string, initial: T) {
  const [value, setValue] = useState<T>(() => {
    // 初回のみ localStorage から読み込む（遅延初期化）
    const saved = localStorage.getItem(key);
    return saved ? JSON.parse(saved) : initial;
  });
  const save = (v: T) => {
    setValue(v);
    localStorage.setItem(key, JSON.stringify(v)); // 保存も同時に
  };
  return [value, save] as const;
}