데브허브 | DEVHUB | React Native Authentication with Expo Router v5React Native Authentication with Expo Router v5
- Expo Router v5는
stack.protected 그룹을 활용하여 인증 상태에 따라 라우트 접근을 제어하는 간소화된 방법을 제공합니다. 🛡️
- 기존의 복잡한 수동 리다이렉트(사용자 유무, 로딩 상태 확인 등) 없이 인증 흐름을 처리할 수 있어 코드가 훨씬 깔끔해집니다. 🧹
isAuthenticated와 같은 인증 상태 변수를 guard 함수에 연결하여, 사용자가 인증되었을 때만 특정 페이지 그룹(예: 탭, 내부 영역)에 접근하도록 설정합니다. 🔑
stack.protected 블록 외부에 있는 라우트는 사용자가 인증되지 않았을 때만 표시되도록 설정하여, 로그인/회원가입 페이지 등을 효율적으로 관리합니다. 🚪
- 인증 상태 변경 시
router.push나 router.replace와 같은 명시적인 내비게이션 호출 없이 Expo Router가 자동으로 적절한 화면으로 전환합니다. 🚀
- 중첩된 보호 그룹을 통해 관리자 전용 페이지나 유료 사용자 콘텐츠와 같이 더 세분화된 접근 제어를 구현할 수 있습니다. 🌳
- 일반 페이지뿐만 아니라 모달, 탭, 드로어, 커스텀 내비게이터 등 다양한 UI 요소에도
stack.protected를 적용하여 접근을 제한할 수 있습니다. 🖼️
stack.protected는 UI/UX 측면의 보호이며, 실제 보안은 항상 백엔드 API 엔드포인트와 토큰 인증을 통해 이루어져야 함을 강조합니다. 🔒