next.js 썸네일형 리스트형 [Nextjs] Nextjs 프로젝트에 localStorage 적용하기 문제 상황 만들고 있는 프로젝트의 사이드바를 열고 닫게 할 수 있게 만들어놨는데, 닫아 놓으면 새로고침 시 풀려서 불편함이 발생했다. 이럴 때는 클라이언트의 localStorage에 상태를 저장해주면 된다. 아래와 같이 localStorage에 값을 추가하는 코드를 작성하고 실행해보았는데, 적용이 되지 않았다. 'use client'export default function ClientLayout({ children }: { children: React.ReactNode }) { const [isOpen, setIsOpen] = useState(true); useEffect(() => { const stored = localStorage.getItem('sidebarOpen') if (s.. 더보기 [Next.js] NextAuth의 JWT 살펴보기 JWT의 기본 개념JWT (JSON Web Token)는 사용자의 인증 정보를 안전하게 저장하고 전송하기 위한 표준이며,기본적으로 헤더, 페이로드, 서명 3개의 부분으로 구성된다.헤더 (Header): 토큰의 유형과 서명 알고리즘 정보를 담음.페이로드 (Payload): 실제 인증 정보 및 추가적인 데이터를 담음. 예를 들어, 사용자의 ID, 이메일, 로그인 정보 등이 포함됨.서명 (Signature): 헤더와 페이로드가 변조되지 않았음을 보장하는 서명.JWT는 기본적으로 서버와 클라이언트 간의 인증 정보를 안전하게 전달하는 데 사용된다. NextAuth는 이 JWT를 쿠키(next-auth.session-token)에 저장하고, 클라이언트가 요청을 보낼 때 이를 복호화하여 인증 상태를 유지한다. JW.. 더보기 이전 1 다음