React 로그인

로그인 프로젝트 생성

프로젝트 생성

라이브러리 설치

로그인 프로젝트 생성

회원가입 화면

로그인 화면

자동 로그인

최초 로그인 시, 응답받은 JWT 를 쿠키에 저장하고, 브라우저 재접속 시 쿠키에 저장된 JWT 로 인증하여 사용자의 로그인 상태를 유지하는 기능

자동 로그인 프로세스

 쿠키에서 JWT 가져오기

자동 로그인

로그아웃

로그아웃 성공

마이 페이지

회원 정보 수정 성공

회원정보 수정

마이 페이지

회원 탈퇴 성공

로그인 여부 관리

최초의 로그인 이후에는, 브라우저의 저장소인 localStorage 또는 sesssionStorage 에 데이터를 저장하는 방법을 이용해서 로그인 여부와 사용자 정보를 관리하는 방법

로그인 후, JWT 로 사용자 정보를 매번 요청할 필요없이, 클라이언트에서 바로 정보를 가져오도록 하여 서버 측의 로드을 줄일 수 있다.

로그인 여부 관리