리액트 심화주차 개인과제 2일차

개인과제를 이어서 진행했다. 로그인과 회원가입 API는 JWT 인증서버를 사용했고, 로그인에 성공하면 서버 응답으로 받은 accessToken을 로컬스토리지에 저장했다. 새로고침에도 로그인 상태가 유지되도록 로컬스토리지를 이용하는 것이다.

Layout 컴포넌트를 만들었는데 로그인에 성공했을 경우, 화면 최상단에 페이지 이동을 위한 Navigation Bar를 구현했다.

=> 원래는 닉네임에 input창으로 직접 입력해서 팬레터를 남겨야했다면, 지금은 회원가입 시 입력했던 닉네임 값으로 나오도록 수정했다.

redux모듈로 유저데이터를 관리하도록 했고, accessToken뿐만 아니라 avatar, nickname, userId도 로컬스토리지를 이용해 새로고침에 대응한다.

로그인했을 때 로컬스토리지는 다음과 같다.