React 동적 UI - part5

wltjd1688·2025년 4월 22일

풀사이클

목록 보기
58/74

비밀번호 초기화 및 로그인과 전역상태 관리

로그인 후 상태관리를 위해서 zustand를 사용함

  • store/authStore.ts 에서 create로 간단한 전역 스토어 구현
  • token, getToken(), setToken(), removeToken() 메서드를 구현하여 토큰 관리

Axios 인터셉터로 인증 헤더, 오류 처리 추가
http.ts파일에서 Request를 인터셉터 하여 token을 Authorization헤더에 자동 추가함, 또한 response가 401(토큰만료)에러 발생시 removeToken한 후 /login로 강제 리다이렉트시킴

도서 목록 페이지


useSearchParams를 구현하여 URL과 컴포넌트간 상태 동기화를 해봄.
BookFilter에 만든 카테고리, 신간과 pagination을 쿼리스트링(?category_id=0&news=true&page=2)으로 관리
추가로 뷰모드(list, Grid)또한 구현해보았음

profile
일단 해!!!!

0개의 댓글