[08-03] 데일리 스크럼 - 송시은

[sgoldenbird]

📅 Daily Scrum | 08-03

---

🎯 Done

#461

• 카카오 OAuth 요청에 랜덤 state 값 적용으로 CSRF 방지

• 로그인, 회원가입 후 헤더 새로고침해야 변경되던 문제 해결

  • 변경 사항
    useSignupMutation.ts 및 useSigninMutation.ts의 onSuccess 콜백 함수에서 router.push 대신 window.location.href를 사용하도록 수정했습니다.
  • 변경 이유
    • 회원가입 또는 로그인 후 router.push를 사용하여 페이지를 이동할 때, 클라이언트 측 라우팅으로 인해 서버 컴포넌트(AppLayout)가 다시 렌더링되지 않았습니다. 이로 인해 Header 컴포넌트의 사용자 정보가 즉시 업데이트되지 않아,
      GuestMenu가 보이고 새로고침 해야 AuthMenu가 보이거나 GuestMenu가 잠시 보였다가 AuthMenu로 바뀌는 깜빡임 현상이 발생했습니다.
    • Tanstack Query 훅 (useUser)를 활용해봐도 AuthMenu가 보이긴 하지만 user정보를 가져오려면 새로고침 해야하거나 상위구조부터 Tanstack Query활용하는쪽으로 해봐도 GuestMenu가 잠시 보였다가 AuthMenu로 바뀌는 깜빡임 현상은 여전. (빠르게 되긴 했지만)
    • window.location.href는 페이지 전체를 새로고침하여 서버에서 모든 것을 다시 렌더링하도록 만듭니다.
      이로써 AppLayout이 최신 사용자 정보를 가져오고 Header가 올바른 상태로 처음부터 렌더링되어 깜빡임 현상을 해결했습니다.

• 비밀번호 확인 유효성 검증 8자 이하일때 8자 이상이어야 한다는 메시지로 변경

• 로그인 후 뒤로가기 하면 이메일 폼에 입력되어 있도록 구현 (이후 다른 이메일로 로그인 하면 서버에서 새로운 사용자로 갱신)

• 로그인/회원가입 폼 입력값 자동 유지 기능 추가

  • 로그인 폼: 최근 로그인한 이메일이 자동 입력되도록 구현 (persist)
  • 회원가입 폼: 입력 중 실수로 뒤로가기나 새로고침 시 작성 중 내용이 유지되도록 구현 (sessionStorage), 로그인 후 또는 회원가입 완료 시 폼 리셋(sessionStorage 초기화)

• component error boundary 디자인 ! 로 변경

• 비번 유효성 검사 변경

• 닉네임 input max length 11 적용

• 토스트 위치 가운데로, 2초로 변경

---

🚧 Doing

• 4차 리팩토링
• 문서 정리
• 리드미 작성

---

📌 Todo

---

💬 ETC

| ❗ 논의 사항

| 💡 아이디어, 🔦 제안

• Button을 ui/ 넣기
• 비번 유효성 검사 메시지 맞추기 -> 최소 8자 이상이라는 메시지 먼저 뜨고 영문, 숫자, 특수문자 메시지 뜨도록.

  email: z.string().email({ message: '유효한 이메일 형식이 아닙니다.' }),
  nickname: z
    .string()
    .min(1, { message: '닉네임을 입력해주세요' })
    .max(10, { message: '닉네임은 10자 이하로 입력해주세요.' }),
  password: z
    .string()
    .min(8, { message: '비밀번호는 최소 8자 이상이어야 합니다.' })
    .regex(
      /^(?=.*[A-Za-z])(?=.*\d)(?=.*[!@#$%^&*()_\-+=])[A-Za-z\d!@#$%^&*()_\-+=]+$/,
      {
        message: '비밀번호는 영문, 숫자, 특수문자를 모두 포함해야 합니다.',
      },
    ),
  passwordConfirm: z
    .string()
    .min(8, { message: '비밀번호는 최소 8자 이상이어야 합니다.' }),
});

<Input.Root id='nickname' name='nickname' type='text'>
     <Input.Label>닉네임</Input.Label>
     <Input.Field placeholder='닉네임을 작성해주세요' maxLength={11} />  11로해야 유효성 검사 메시지가 뜸
     <Input.Helper />
</Input.Root>

| ❔ 질문