2023년부터 로그 기록 2023년부터 로그 기록

Problem프로젝트를 진행하면서 로컬스토리지로부터 객체 데이터를 가지고 와서, 파싱하고 state에 저장하는 과정이 반복해서 수행되고 있었다. 반복되는 과정의 코드를 줄이기 위해 커스텀 훅 useLocalStorage을 만들었다.로컬스토리지는 브라우저의 저장소로 데이터를 key-value 쌍으로 저장할 수 있다. 그런데 Next.js는 서버 사이드 렌더링을 지원하기 때문에, 서버 측에서 코드가 실행될 때 문제가 발생하게 된다. 로컬스토리지를 사용할 때는 Window 객체가 존재하는 클라이언트 사이드에서만 접근해야 한다.Next.js 클라이언트 컴포넌트에서는 일반적으로 useEffect를 사용하여 컴포넌트가 마운트된 후에 로컬스토리지에 접근하는 방식을 사용한다. 하지만 내 상황에서는 useState를 초..

Next.js 14 App Router 버전으로 개발을 진행하면서 Header 컴포넌트에 로그인/로그아웃 기능을 넣고 email 로그인을 해봤는데 로그인 상태가 변경되지 않는 이슈가 발생했다.1. Problem [ 문제 정의 ]Email 로그인 (signInWithCredentials) 할 경우 세션 값이 새로고침 해야 업데이트 되는 문제 [ 원인 분석 ]useSession Hook의 경우 loading, unauthenticated, authenticated로 3 가지 Status로 구분된다. 현재 로그인 후 accessToken이 잘 들어옴에도 loading → unauthenticated 상태에 그치고, 새로고침을 해야 loading → authenticated 상태로 변경되는 상황이다.[ 문제 접..