Skip to content

Conversation

@hyeonjiroh
Copy link
Contributor

@hyeonjiroh hyeonjiroh commented May 21, 2025

🔗 이슈 번호

Closes #199 #205


📋 작업 사항

인증 상태에 따른 리다이렉션

  • 로그인이 되지 않은 상태에서 board, team, user 관련 페이지 접근 시 로그인 페이지로 리다이렉트
  • 로그인 상태에서 auth 관련 페이지 접근 시 팀 페이지로 리다이렉트
    • 소속된 팀이 있는 경우에는 소속된 팀들 중 첫 번째 팀 페이지로 리다이렉트
    • 소속된 팀이 없는 경우에는 no-team 페이지로 리다이렉트

로그인, 회원가입 페이지

  • 로그인, 회원가입 페이지 반응형 스타일 적용
  • 로그인 성공 시 팀 소속 여부에 따라 리다이렉트
    • 소속된 팀이 있는 경우 소속된 팀들 중 첫 번째 팀 페이지로 리다이렉트
    • 소속된 팀이 없는 경우 no-team 페이지로 리다이렉트

📷 스크린샷

로그인 페이지 반응형

2025-05-22.141233.mp4

회원가입 페이지 반응형

2025-05-22.141317.mp4

로그인 성공 시 리다이렉션

2025-05-22.141432.mp4

@hyeonjiroh hyeonjiroh added the 💫feat 기능 구현 이슈 label May 21, 2025
@hyeonjiroh hyeonjiroh self-assigned this May 21, 2025
@hyeonjiroh hyeonjiroh requested review from ARON-Y and jjanie00 May 21, 2025 13:42
ARON-Y
ARON-Y previously approved these changes May 21, 2025
Copy link
Contributor

@ARON-Y ARON-Y left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아까 말씀하시는거 듣기론 미들웨어를 이용해서 리다이렉션 하신다는줄 알았는데 이렇게 하셨군요!ㅇ0ㅇ 궁금해서 GPT 물어봤더니 지금 구조는 팀 존재 여부에 따라 라우팅 같은 세밀한 분기가 필요하기 때문에 middleware보다 layout.tsx를 활용한 서버 컴포넌트 제어가 훨씬 적절하다고 하네요,, 공부하면서 갑니다.🙇🏻‍♀️ 감사합니다!

@hyeonjiroh
Copy link
Contributor Author

아까 말씀하시는거 듣기론 미들웨어를 이용해서 리다이렉션 하신다는줄 알았는데 이렇게 하셨군요!ㅇ0ㅇ 궁금해서 GPT 물어봤더니 지금 구조는 팀 존재 여부에 따라 라우팅 같은 세밀한 분기가 필요하기 때문에 middleware보다 layout.tsx를 활용한 서버 컴포넌트 제어가 훨씬 적절하다고 하네요,, 공부하면서 갑니다.🙇🏻‍♀️ 감사합니다!

네! 처음에는 middleware.ts를 사용하려고 했는데 다음과 같은 이유들로 이 방법을 사용하게 되었습니다.

  1. middleware.ts에서는 HTTPOnly 쿠키를 사용해야 되는데, 현재 브라우저 쿠키에만 액세스 토큰을 저장하고 있습니다.
  2. 로그인 시 첫 번째 팀으로 리다이렉트하려면 첫 번째 팀의 id 값이 필요한데, 이때 API 요청을 통해 이 id 값을 얻을 수 있습니다. 그런데 middleware.ts 안에서 API 요청을 보내 그 값을 리다이렉트할 경로에 사용하는 것은 일반적이지 않아 보였습니다.

저야말로 자세히 봐주셔서 감사합니다! 따로 찾아보신 것도 너무 멋져요!👍

@hyeonjiroh hyeonjiroh changed the title [feat] #199 인증 상태에 따른 리다이렉션 [feat] #199 #205 인증 상태에 따른 리다이렉션 / 로그인 페이지 리다이렉트 / 로그인, 회원가입 페이지 반응형 May 22, 2025
@github-actions
Copy link

Preview Deployment
🔗 https://coworkers-krknful27-hyeonjirohs-projects.vercel.app

Copy link
Contributor

@jjanie00 jjanie00 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

고생하셨습니다 현지님 ! 라우팅과 반응형 선뜻 도와주셔서 감사해요 💓

toast.success('로그인 되었습니다.');
router.push('/no-team');
const userGroupsData = await getUserGroups({});
const firstGroupId = userGroupsData?.[0]?.id;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

응답으로 오는 데이터가 시간 순이 아닌 랜덤으로 섞여있어서, sort() 로 후처리해주면 좋을 것 같습니다. 🙂

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

그룹 데이터가 랜덤으로 섞인다는 걸 모르고 있었네요..! 알려주셔서 감사합니다! 알려주신대로 sort 후 가장 작은 id 값을 firstGroupId로 사용하도록 변경하겠습니다~!

@jjanie00 jjanie00 merged commit d2d92a6 into dev May 22, 2025
1 check passed
@jjanie00 jjanie00 deleted the feat/#199/authentication-redirect branch May 22, 2025 10:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

💫feat 기능 구현 이슈

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[refactor, design] 로그인 페이지 리다이렉트 / 로그인, 회원가입 페이지 반응형 [feat] 인증 상태에 따른 리다이렉트

4 participants