문제 상황

로그인 또는 회원가입 페이지에서 페이지 이동 시 아래와 같은 문제들이 발생:

1. 페이지 이동 직전에 불필요한 validation 메시지가 표시됨
   • "이메일을 입력해주세요"
   • "비밀번호를 입력해주세요"
2. 비밀번호 입력 필드의 내용이 노출되는 문제 발생

원인 분석

1. Validation 로직 문제

기존 코드에서는 validateForm 함수가 불필요하게 엄격한 검증을 수행:

typescript
Copy
const validateForm = (): boolean => {
  const newErrors = { email: '', password: '' };
  let isValid = true;

  if (!email) {
    newErrors.email = '이메일을 입력해주세요.';
    isValid = false;
  }

  if (!password) {
    newErrors.password = '비밀번호를 입력해주세요.';
    isValid = false;
  }

  setErrors(newErrors);
  return isValid;
};

이 로직은 폼 제출 시마다 validation 메시지를 설정하여, 페이지 이동 직전에도 메시지가 표시되는 문제를 야기했습니다.

2. 에러 상태 관리 문제

• 입력값 변경 시 에러 상태를 초기화하지 않아 불필요하게 에러 메시지가 유지됨
• validation 메시지 표시 조건이 명확하지 않음

해결 방안

1. Validation 로직 단순화

typescript
Copy
const validateForm = (): boolean => {
  if (email && password) {
    return true;
  }
  return false;
};

• 불필요한 validation 메시지 설정 제거
• 단순히 필수 필드 존재 여부만 확인

2. 에러 상태 관리 개선