:bug: fix: #17 useLocalStorage 코드 개선 및 metadataBase 추가

[redcontroller]

✍️ PR 한 줄 요약

useLocalStorage 코드 개선 및 metadataBase 추가

17

6

✏ 상세 작업 내용

• [x] window is undefined 해결하기
  • 조건부 렌더링 사용: window 객체를 사용할 때 조건부로 클라이언트 사이드에서만 실행되도록 함

• [x] 새로고침 에러 해결하기

  • 'beforeunload'에 event 붙이고, event.preventDefault()

    
    'use client';

  import { useEffect, useState } from 'react';

  export default function useLocalStorage(key: string, initialValue?: T) { const [storedValue, setStoredValue] = useState(() => { if (typeof window !== 'undefined') { const item = window.localStorage.getItem(key); return item ? JSON.parse(item) : initialValue; } return initialValue; });

  const setValue = (value: T) => { setStoredValue(value); if (typeof window !== 'undefined') { window.localStorage.setItem(key, JSON.stringify(value)); } };

  useEffect(() => { const handleBeforeUnload = (event: BeforeUnloadEvent) => { event.preventDefault(); event.returnValue = ''; // 일부 브라우저에서는 이 설정이 필요함 };

  const storage = window.localStorage.getItem(key); if (storage) { window.addEventListener('beforeunload', handleBeforeUnload); }

  return () => { window.removeEventListener('beforeunload', handleBeforeUnload); }; }, [key]);

  return [storedValue, setValue] as const; }

• [x] metadataBase 붙이기
  • 아래 이미지 에러 해결

    export const metadata = {
    metadataBase: new URL('https://genisisu.vercel.app'),
    title: 'Your Website Title',
    description: 'Your website description',
    ...

    export function generateMetadata() {
    const metadataBase = new URL('https://genisisu.vercel.app');
    return {
    metadataBase,
    title: '모델 - GENISISU',
    description: 'GENISISU 모델 목록 페이지',
    ...

    

✅ PR 양식 체크리스트

• [x] 💭 이슈는 등록했나요?
• [x] 🏷️ 라벨은 등록했나요?
• [x] 🔀 PR 제목의 형식을 잘 작성했나요?