#로그아웃

스프링부트 배포 root 와 유저

우분투 서버를 하나만들어서 배포를 하려고합니다. aws는 아니고 자체적으로 os를 설치해서 이용하게되었는데 root에서 jar파일을 nohup & 으로 백그라운드 실행시켰는데 root가 로그아웃을 하니 프로젝트도 같이 다운됩니다. 여러가지 시나리오를 해봤는데 왜이러는건지 어떻게해야 실행시킨 프로젝트를 유지할수있을까요? 시도해본 시나리오 1. 사용자 user 와 root가 동시에 접속해서 duser가 프로젝트를 실행시키고 duser가 접속을 종료시 - 프로젝트 유지 - root가 로그아웃하면 프로젝트가 내려갑니다 2. 사용자가 먼저 접속해서 프로젝트를 백그라운드로 실행시킨후 root가 이후에 접속했다가 로그아웃한경우 - 프로젝트 유지 3. root 로 접속해서 user로 변경후 프로젝트 실행시 user에서 root로 변경했을때는 프로젝트가 유지되고 root를 로그아웃하면 프로젝트도 종료됩니다. 어떻게 접속했다가 로그아웃해도 프로젝트가 내려가지않게 하고싶습니다.

스프링부트 ServiceInterface에 요청문 작성

안녕하세요 MSA아키텍처를 적용한 개인프로젝트 진행중에 궁금한 사항이 생겨서 글 작성합니다 회원정보 수정을 한 뒤 수정이 정상적으로 완료되었을 때 클라이언트에 완료되었다는 메세지와 함께 로그아웃 메서드를 실행시키고 싶어서 public interface IUserInfoService { @PostMapping(value = "security/v1/logout") void logout(); } 이렇게 서비스 인터페이스에 작성을 해두고 컨트롤러에서 userInfoService.logout(); 으로 호출하여 실행하는데 권장되는 방법인지, 더 좋은 방법이 있는지 궁금해서 질문드립니다

리액트쿼리 사용법 이게맞나요?

좀 이상합니다.. 상황이, 1. 로그아웃 후 게시물작성 페이지로 접근하면 프라비잇 라우터 컴포넌트 + 사용자인증 훅 (리액트쿼리) 로 인해 '/' 로 잘 튕겨집니다. 2. 로그인 후 게시물 작성페이지로 접근하면 '/' 로 튕겨집니다. 최소 두번은 게시물 작성 페이지로 접근하던가, 새로고침후 접근해야 접근이 가능합니다. axios header 토큰 및 유저 정보 불러오는 api에서 리턴해주는 값들을 다 콘솔찍어서 확인해봤는데 이상없었습니다. 딱한군데 사용자인증 훅쪽만 이상이있었습니다. 아래 코드에 삽입된거에서 콘솔(userLoginInfo) 하면 언디파인이 나오는데요.. 신기한게 fetchUserInfo에서 콘솔 res.data하면 유저정보가 잘찍힙니다..ㅠㅠ 혹시 뭐떄문에그런걸까요?

토큰 기반 인증에서 리프레쉬 토큰 관리

JWT로 토큰 기반 인증을 구현할 때 궁금한게 좀 생겼습니다! 리프레쉬 토큰은 DB에 저장해볼까 했는데 그러면 토큰 기반 인증이 아니라 세션 기반 인증인 것 같아서 고민입니다. DB에 저장하는 순간 Stateless 장점도 없어지는 것 같구… Stateless로 구현한다해도 로그아웃 때문에 블랙리스트 관리해야한다는데, 이러면 결국 Stateful인거 같구… 다른 분들은 어떻게 구현하시는지 궁금합니다! 일단 이렇게 고민해봤습니다. --- <1번 시나리오 - 리프레쉬 토큰을 DB에 저장하지 않는 시나리오>

 1. 액세스 토큰이랑 리프레쉬 토큰은 클라이언트가 저장하고 서버는 저장하지 않는다.
 2. 클라이언트 요청이 왔을 때 리프레쉬 토큰이 만료되지 않았으면 액세스 토큰을 발급해주고, 만료됐으면 액세스 토큰을 발급해주지 않는다. (401 또는 403)
 장점 - DB에 접근할 이유가 없으므로 Stateless 하다. 단점 - 로그아웃을 했을 때 토큰 자체는 무효화시킬 수 있는 방법이 없다.

 <2번 시나리오 - 리프레쉬 토큰을 DB에 저장하는 시나리오> 1. 액세스 토큰이랑 리프레쉬 토큰은 클라이언트와 서버가 각각 저장한다.
 2. 클라이언트 요청이 왔을 때 리프레쉬 토큰이 만료되지 않았으면 액세스 토큰을 발급해주고, 만료됐으면 액세스 토큰을 발급해주지 않는다. (401 또는 403) 장점 - 로그아웃을 했을 때 토큰 자체는 무효화시킬 수 있다. 단점 - DB를 접근해야하므로 Stateful 하다. => 클러스터링이나 샤딩이 도입되면 복잡도가 올라간다.
 --- 1번 시나리오 단점을 극복하려고 블랙 리스트를 Redis에 관리한다는 글들을 종종 봤습니다. 블랙 리스트를 도입 안했을 때 문제는 실제로 겪어본 적이 있어서 공감은 가는데, 이러면 사실상 세션 쓰는거랑 똑같지 않나라는 생각이 듭니다. 인증시 결국 Redis 같은 DB에 접근해서 직접 확인하는 거니까요. 한편으로는 서비스가 매우 많이 커지면 세션이 부담돼서 토큰 기반 인증으로 전환한다는데, 파면 팔수록 점점 세션 기반 인증으로 바뀌는 것 같아서 고민입니다.

앱 삭제하는 경우 DB에 저장된 토큰 처리 방법

취업을 준비하고있는 백엔드 직무를 희망하는 학생입니다. 최근 프로젝트를 진행하며 제목과 같은 문제에 접하게 되었습니다. 이전에는 웹 프론트와 작업을 하여 로그아웃을 하는 경우 데이터베이스에서 토큰을 삭제하는 방식, 즉 양쪽에서 토큰을 삭제하는 방법으로 프로젝트를 진행하였습니다. 최근 모바일과 작업을 하게 되었는데 앱 같은 경우 삭제를 하면 백엔드쪽 요청을 받지 못할텐데 따로 다른 방법이 있을까요..?

node.js express.js 백엔드 개발 시 자동 로그아웃 관련

안녕하세요 헬스케어 콘텐츠 개발팀에서 근무하고있는 이제 1년 2개월이된 서버개발자입니다. 서버쪽은 저 혼자라서 서버쪽 도움을 요청할분이 없기에 이렇게 도움을 요청 드리게 되었습니다! node.js express.js로 개발중인데요! 클라이언트쪽은 다른분이 unity로 개발중에있습니다. 앱에서 로그인하고 일정시간동안 아무 이벤트가없으면 자동로그아웃이 되도록 구현하려고합니다. 알아보니 setInterval를 사용하면 될 것같아 구현은했는데 postman으로 테스트시 console에 자동 로그아웃 성공되는 부분까지 확인이 되었습니다. 그런데 클라이언트쪽 return에 대해서는 아무 반응이 없다보니 이렇게 처리하는게 맞나라는 생각이 듭니다. 개발하고 unity 클라이언트 앱 쪽과 api 통신을할껀데 setInterval로 자동 로그아웃 기능을 구현면 어떻게 unity 클라이언트쪽에서 확인하고 팝업창을 띄우거나 로그인 페이지로 돌릴지 감이 잡히지않아 이렇게 요청드립니다..!! 정리하자면.. node.js로 백엔드 개발중 일정 시간이 지나도록 이벤트(마우스,키보드,api요청)가 전혀없을때 setInterval로 만들어 놓은 자동 로그아웃이 실행되고 return 값을? unity 클라이언트쪽에서 받아서 팝업창에 띄우는 흐름대로 하려고하는데 관련 키워드나 해결방법을 알고싶어 도움 청하게 되었습니다..!!! 혹시나 제가 처리하려는 흐름이나 setInterval로 접근하는게 잘못된것일까요..?

JWT 로그아웃 관련 질문 입니다.

JWT 를 사용하여 로그인 기능을 구현 하였습니다. 저같은 경우에는 로그인시 에세스토큰과 리플레시 토큰을 생성해서 사용중이 mysql 테이블에 저장을하고 토큰 두개를 반환하면 프론트(리엑트) 에서 세션 스토리지에 저장해서 에세스 토큰으로 통신하다가 만료가 되면 리플레시를 요청하고 리플레시를 보내서 데이터베이스에서 유효시간과 변형이 되지 않은것을 확인하면 다시 에세스 토큰을 발급하는 시스템으로 구현을 했는데요 이때 에세스 토큰은 30분 리플레시 토큰은 8시간을 주고 개발 하였습니다. 그런데 생각해보니 로그아웃을 구현 안했더라고요 프론트에서는 로그아웃하면 세션스토리지를 날려버리면 끝인데 RestAPI라 데이터만 주고 받으면 되는 형식이라 딱이 제가 받는게 없다는겨죠 그렇게 로그아웃을 찾아 보다가 다른분들은 Redis를 사용하여 리플레시 토큰을 입력받은 아이디를 key로 저장한후에 에세스를 발급하고 로그아웃하면 그토큰을 블랙리스트로 만들더군요 만료시간후에 자동 삭제되게 설정도 하는거 같아요 이게 어느 방향으로 개발하는게 맞는지 도통 모르겠습니다. 로그아웃 할때마다 리플레시를 무효화 시키고 로그인할 때 새로 생성해서 저장하는게 맞는지 로그아웃해도 데이터베이스에 리플레시 유효기간이 남아 있다면 그것을 계속 사용하는게 맞는건지 어느 글들을 보면 리플레시를 7일 한달도 주는 경우가 있더라구요... 그래서 잘 모르겠습니다. 로그인 -> 에세스,리플레시토큰 발급 -> 프론트 세션스토리지 저장 -> 에세스로 통신 -> 만료되면 리플레시 요청 -> 프론트에서 리플레시 통신 -> 데이터 베이스 확인후 유효검사후 에세스 다시 발급 -> 재로그인시 유효시간이 남으면 기존의 리플레시 토큰 사용 로그인 -> 에세스,리플레시토큰 발급 -> ........ -> 로그아웃시 Redis에 블랙리스트로 저장 -> 블랙리스트 접근불가 -> 다시로그인시 리플레시 새로발급 실무에서는 어떻게들 관리하시는지 알려주시면 감사하겠습니다.

클라이언트에서 사용자가 로그인 상태인지 판별하는 방법

일반적으로 웹/앱 클라이언트에서 사용자가 로그인 상태인지 어떻게 확인하는지 궁금합니다. 1. 서비스에 접속하고 페이지를 이동할 때마다 매번 유저 정보를 가져오는 api를 호출해서 에러가 나면 로그아웃 상태로 판단한다. 2. 서비스에 접속할 때 한번 유저 정보 api를 호출하고 에러가 나면 로그인 api를 호출해서 성공할 때까지 로그아웃 상태로 판단한다. 3. 쿠키나 로컬 스토리지 같은 곳에 세션 id가 있는지 여부로 판단한다. 지금 생각해본건 이렇게 세가지 인데 일반적으로 어떻게 로그인 상태인지 매번 판별하는지 궁금합니다! 그리고 환경을 nextjs로 가정했을때 이 유저 api 호출을 ssr과 csr중 어디서 호출하는게 좋을지도 알고 싶습니다.

API 요청 시 헤더에 토큰이 안 담깁니다.

안녕하세요. 현재 개발 서버에서 게스트 모드 로그아웃 시 delete 요청을 보내는 플로우인데 일반 회원 계정 삭제와 동일한 api를 사용하고 있습니다. 일반 회원 계정 삭제는 잘 되는데 게스트 모드로 로그인을 하고 delete 요청을 보내면 헤더에 토큰이 안 담겨져 401 에러가 납니다... 현재 next.js를 사용하고, api 관련 로직은 class로 로컬 스토리지에서 엑세스 토큰과 리프레쉬 토큰을 가져오고, axios instance를 사용하여 headers에 토큰을 넣어 요청을 하고 있습니다. 로컬 스토리지에는 토큰들이 잘 보이고, 똑같은 api를 사용하는데 왜 이런 이슈가 생기는지 모르겠습니다 ㅜㅜ...

로그아웃 구현 관련하여 질문이 있습니다.

로그아웃 기능을 구현하기 위해 검색하던 중, 헷갈리는 점이 있어 질문드립니다. 백엔드에서 DB에 저장되어있는 Refresh Token을 제거하고 프론트에서는 AccessToken이 저장되어있는 쿠키를 제거하면 되는 걸로 이해를 하고 있었는데, 어떤 글에서는 프론트에서 쿠키를 제거하면 보안에 취약하기 때문에 백엔드에서 처리를 해야한다는 글이 보이네요. 어떤 방법을 써야할까요?

next.js 로그아웃 기능 (서버/클라이언트 공통 코드 작성 방법)

안녕하세요. 현재 로그아웃 기능을 구현하고 있습니다. 로그아웃 진행 시 다른 서브 도메인을 갖고 있는 사이트로 redirect 시킨 후 다시 돌아와야 합니다. 예) a.example.com에서 로그아웃 시 -> b.example.com?redirect=a.example.com 사이트로 리다이렉트 후 다시 a.example.com 사이트로 이동 해당 로직을 구현 함에 있어 클라이언트에서는 문제가 없습니다. 하지만, 서버 미들웨어에서 정상 동작은 하나 첨부 이미지와 같은 CORS 에러가 발생됩니다. 서버/클라이언트에서 동시에 사용할 수 있는 코드로 로그아웃 버튼을 클릭 하여 로그아웃 처리되는 로직을 만들고 싶은데요. 방법이 있을까요? (서버에서 로그아웃 처리가 필요한 이유는 토큰 만료 시 서버 단에서 로그아웃 시키기 위하여..) 단, b.example.com 사이트에서는 어떠한 설정도 불가능

백엔드 협업 프로젝트 초반 진행

안녕하세요 지금 부트캠프에서 협업 프로젝트 진행 예정 중에 있습니다 첫 프로젝트라 규모가 작지만 시작을 어떻게 해야할지 고민이 되어서 질문합니다 회원 1. 이메일 비밀번호 입력하여 회원가입 API 2. 이메일 비밀번호 입력하여 접속하는 API 3. 접속된 유저 로그아웃 조회 1. 게시물 전체 조회하는 API 2. 작성자 이메일을 통해 특정 게시물들을 검색하는 API 3. 댓글을 조회하는 API 생성 1. 댓글을 새롭게 만들 수 있는 API 2. 게시물을 새롭게 만들 수 있는 API 수정 1. 기존 댓글의 글을 수정하는 API 2. 게시물을 새롭게 수정할 수 있는 API 삭제 1. 게시물을 삭제하는 API 2. 댓글을 삭제하는 API 심화 1. 이메일과 같이 댓글 좋아요를 할 수 있는 기능 해당 기능을 구현하는 것이고 팀원들과 분담도 마쳤습니다. 우선 DTO, Controller, Repository, ERD 등을 설계하려고 하는데 그 중에서 DTO가 우선이라고 생각하고 진행했습니다. 과정 중에 DTO와 ERD은 서로 같을 필요가 없다고 판단했고 처음부터 데이터베이스랑 연결하면 혼란이 올 것 같다고 생각했습니다. 그래서 DTO로 설계하고 테스트 코드로 확인 후 잘 동작한 다음 데이터 베이스와 연결을 하는게 좋을지 아니면 처음부터 데이터 베이스랑 연결하는 것이 좋을지 궁금합니다. 또한, 해당 설계를 먼저 하는 것보다 더 좋은 방법이 있는지도 궁금합니다. 대체로 어떤 순서로 진행되는지 조언을 받고 싶습니다!

React+Next.js 사이트 배포

전공자/프론트/React/3년 공백 React+API+Firebase 적용한 프로젝트 2개 보유 취준 생활이 길어지다 보니 부모님의 걱정으로 우선 지인 회사에 취업해 전산 업무를 담당하며 회사 사이트를 관리하게 되었어요. (연봉이 좋습니다.) 전산 업무는 사실상 나이 있으신 분들 컴퓨터 모르는 부분 가르쳐 드리고 나중에 외주 프로그램 오픈 하면 미팅하고 에러 나는 부분만 전화로 해결 요청 드리면 된다고 아무것도 몰라도 알려주겠다 하셔서 여기서 제가 직접 사이트를 만들어 배포하면 나중에 커리어에 추가할 수 있을 것 같아서 다니기로 했습니다. (모르는 게 생기면 대표님(개발관련X)과 친척 분께 여쭤볼 수 있습니다. 친척=유일한 사수) 현재 운영 중인 사이트는 JSP로 기능만 작동하는 아주 단순한 디자인의 사이트(친척이 4개월 동안 개발하고 이직, 프론트X)라 제가 Next.js를 아직 써본 적은 없는데 차차 공부하면서 사이트를 개발해볼까 합니다. 질문 1. 로그인/로그아웃, 회원가입, 게시판 정도의 기능만 하고 나머지는 회사에 대한 설명 위주인 간단한 사이트인데 React + Next.js + MySql 로 개발해서 배포할 수 있을까요? 아니면 따로 Spring으로 백엔드를 따로 개발해야 할까요? (Spring Framework + mariaDB로 ERP 프로그램 개발 경험 있습니다. 배포는 안 해봤습니다.) 질문2. 질문1 중 하나를 선택해 배포할 때 AWS로 할 지 아니면 다른 추천해주실 만한 것이 있는지 궁금합니다. 기존 토이 프로젝트들은 firebase로 db 및 로그인 구현했고 netlify로 배포해서 아는 게 너무 부족합니다. 질문3 - 여담. 지금이라도 도망가야 할까요?ㅋㅋ 혼자서 독학으로 프론트하고 있던지라 앞으로 TypeScript, Next.js 등 공부할 예정이었는데 여기 취업 아니면 국비지원 부트캠프 가려고 했습니다. 대학생 때 학과 1~2등도 해보고 학점도 4.1~4.3 정도로 공부는 잘하는 편...이었습니다ㅎ... 사이트 개발하다가 도저히 안되겠으면 그냥 외주 맡기시라고 하고 저는 다니면서 개인 공부해도 되지 않을까 생각합니다.

사이드 프로젝트 중인데, 여기서 어디로 방향을 잡아야 할지 모르겠습니다.

올해 졸업 후 spring boot 백엔드 취준을 시작했습니다. 4월 즈음 프로젝트 인원을 모아 기획자, 동시에 백엔드 개발 역할로 프로젝트를 시작했습니다. 현재 어느 정도 진행되었지만, 공부가 부족해 어느 방향으로 나아가야 할지 정체된 상황입니다. 주제는 커리어리, 인프런 같이 스터디나 사이드 프로젝트 인원을 찾는 사이트입니다. 기본적인 레이어 개발은 거의 완성된 상황(api 및 비즈니스 로직 , 데이터 페이징 등)이고, spring security, jwt를 적용한 로그인/ 로그아웃도 구현되었습니다. 이 다음 어디로 나아갈지 고민중 입니다. 이 다음 단계로의 경험이 별로 없어 쉽지 않은 것 같습니다.. 제가 생각한 길은 이렇습니다. - 클라우드 설계. - 개발할 때 등한시 한 테스트 코드 다시 만지기 - ?? 사실 제대로 하고 있는 지 의문이 들지만,, 저희 스스로 할 수 있는 최대한 해보려 합니다. 도움 주시면 감사하겠습니다

포론트 공부 방향 조언 부탁드려요

현재 html css js까지 공부 후 간단한 플젝마치고 리액트를 배우면서 리덕스 툴킷배우고 혼자 파이어베이스를 이용해 로그인,로그아웃,게시판 정도까지 하는 플젝까지 혼자서 했습니다. 이후에 타입스크립트를 배우는게 맞을까요 아니면 Next.js로 넘어가는게 좋을까요? 다른 방향이 있으면 조언 부탁드립니다! 학부 2학년입니다.

스프링부트 알림 api개발 방법(파베,안드이용)

스프링 부트 알림api를 개발하고 있고 firebase이용하고 있습니다 그냥 알림을 보내는건 로그인할때 토큰받아서 그거 이용해서 보내고 있는데 안드로이드폰이꺼지고나서 다시켜졌을때 알림가는거랑 로그아웃하고 다시 로그인하고 가는건 어떻게 보내는지 알수있을까요? 다시켜지고 가는건 이미 꺼졌을때 db에서 토큰은 있으니깐 보내고 파베가 알아서 켜진거 감지하고 보내나요?아니면 제가 따로 처리를 해줘야하나요??? 로그아웃해서 못받은 알림은 어떻게 체킹해서 다시 로그인했을때 전부 다 보내게 되나요?? 알림내용 테이블을 따로 구축해서 받은거못받은거 체킹하나요?.. 관련 자료를 아무리 서칭해도 잘 못찾겠습니다ㅜ

리액트 프로젝트 내에서 공통 함수 파일 위치를 어디로 하면 좋을까요?

로그아웃 함수를 공통 함수로 만들어서 사용하고 싶은데, 보통 한 파일에서 모든 공통 함수를 관리하나요? 아니면 함수마다 별도의 파일을 만드는 경우가 많은가요? 또한, 공통 함수와 커스텀 훅이 같은 것으로 이해해도 괜찮은 건가요?

react-query에서 invalidateQueries 사용 방법?

아래와 같은 코드가 있을 때 로그아웃을 하면 내 정보를 다 삭제해 주려고 합니다. 그 때 invalidateQueries를 사용해서 초기화 시켜주려고 하는데요. 정보가 너무 많아요 혹시 효율적인 방법이 있을까요? 모든 원하는 key의 정보를 한번에 삭제한다던가 하는 함수가 있나요?

Next.js 의 _layout.tsx 파일 내에서 server side 데이터를 활용할 방법이 있을까요 ?

네비게이션 바에서 로그인, 로그아웃 상태를 구분해서 구현을 다르게 해주려고 합니다. 문제는 네비게이션 바 컴포넌트를 _layout.tsx 내에 구분했는데 여기서 getServerSideProps 를 사용할수 없더라고요. API 호출을 사용하면 해결되기는 하지만 getServerSideProps 를 사용할 때보다 느려서 사용하기 애매합니다. 혹시 다른 좋은 방법이 있을까요 ?

firebase 로그아웃 에러가 납니다.

index-30f3030e.js?7426:1267 Uncaught (in promise) TypeError: Cannot assign to read only property 'isRunning' of object '#<ProactiveRefresh>' at ProactiveRefresh._stop (index-30f3030e.js?7426:1267:1) at UserImpl._stopProactiveRefresh (index-30f3030e.js?7426:1681:1) at AuthImpl.directlySetCurrentUser (index-30f3030e.js?7426:2588:1) at eval (index-30f3030e.js?7426:2442:1) _stop @ index-30f3030e.js?7426:1267 _stopProactiveRefresh @ index-30f3030e.js?7426:1681 directlySetCurrentUser @ index-30f3030e.js?7426:2588 eval @ index-30f3030e.js?7426:2442 로그아웃 함수를 실행하면 위와 같은 에러가 나는데요. 로그아웃을 하고 싶은데, 로그아웃이 되질 않아서 useEffet로 로그인 상태를 감지하는 함수에서도 계속 로그인이 된 상태로 나옵니다 ㅜㅜ

rest에서 put, post 의 차이

put은 서버에 자원을 한번만 생성하는 것이고, post는 무한히 생성하는 것으로 알고 있는데, 그러면 보통 rest를 구성할 때 post보다는 put만 사용하는 것이 좋나요? (로그인과 로그아웃을 제외한)

react Custom Hook을 만들려고 하는데 도움이 필요합니다ㅠㅠ

안녕하세요, react, typescript로 개발중인 주니어 취준생입니다 커스텀 훅을 처음으로 작성해보려고하는데... 제가 커스텀 훅에 대한 이해가 부족한 건지 이런 저런 방법을 사용해봐도 같은 에러가 계속 나네요ㅠㅠ vscode상에서 나타나는 에러는 없는데 로그아웃 버튼을 누르면 콘솔에 계속 같은 에러가 생깁니다...! 상황) 로그아웃 로직을 재사용할 수 있게 커스텀 훅으로 관리하려고 함 [로그아웃 로직] - 로그아웃 하면 localStorage의 access_token과 refresh_token을 삭제하고, - alert창을 띄우고, 메인화면으로 이동하게 함. 에러메세지에 있는 링크 https://reactjs.org/warnings/invalid-hook-call-warning.html 에 있는 세가지 일반적인 이유는 아래와 같습니다. 1. React와 React DOM의 버전이 일치하지 않을 수 있습니다 . -> 확인해보니 Hooks를 지원하는 버전 맞습니다. 2. Hooks 규칙을 위반하고 있을 수 있습니다 . -> Hooks규칙을 맞춰서 작성했다고 생각했는데 이부분은 정확하게 모르겠습니다. 3. 동일한 앱에 둘 이상의 React 사본이 있을 수 있습니다 . -> 링크에 나온대로 'npm ls react'를 해보면 사진과 같은 결과가 나옵니다. 혹시 3번이 문제가 있는건가요? 봐도 잘 모르겠습니다...흐ㅠㅠ 커스텀 훅이 아니라 그냥 함수로 만든 후에 재사용해야하나? 싶은데 그 함수는 컴포넌트도 아니고 커스텀훅도 아니라서 useNavigate를 사용할 수 없다는 에러가 떠서 그럼 로그아웃 로직을 사용할 때마다 컴포넌트에서 별도로 navigate처리를 해줘야 할 것 같아서 로그아웃 로직 안에서 useNavigate를 사용해서 커스텀훅으로 만들고 싶습니다...! 이런 형태의 로직은 커스텀훅으로 만들 수 없는건가요? 아니면 제가 뭔가 잘못하고있는게 있을까요ㅜㅠㅠ