private route 구현

jwt token의 유효성을 검증하는 유틸리티 클래스를추가한다.

src/utils/JwtUtils.ts

routes 폴더에 라우팅 패스를 명시한다.

src/routes/index.js

PrivateRoute 컴포넌트를 생성한다. 이 컴포넌트는 인증된 사용자만 통과시킨다.

src/routes/PrivateRoute.jsx

인증 로직 적용

App.jsx에 인증 로직을 적용한다.

useEffect 훅에서 token을 가져와서 유효성을 검증하고 isAuth 상태를 정의한다. 이 상태를 가지고 우측 상단 로그인 혹은 로그아웃 버튼을 구현한다.

라우팅에서 게시판 글등록과 게시판 수정에는 인증로직이 필요하므로, Route가 아니라 앞에서 만든 PrivateRoute를 적용하였다.

src/App.jsx