본문 바로가기

프로젝트

블라인드 채용사이트 (5) - 회원가입 버튼 눌렀을 때 검사 기능 추가 중

24 / 02 / 13 (화)

Front

1. 회원가입 버튼 눌렀을 때 정규식 또는 인증번호 검사가 하나라도 안되어 있으면 가입 못하게 방지 기능 추가 중

2. 차크라 UI의 Toast 기능을 활용해 정규식 통과못한 곳 팝업 띄우기

 

Back

1. 메일 인증번호 응답 값을 ResponseEntity 로 200, 400 Return


토스트 팝업이 여러 개가 안되어 있으면 여러 개가 발생

나는 위에서 부터 아래로 확인해 제일 최상단 한 개 만 띄우고 싶음

 

문제의 로직

// 모든 정규식 및 인증번호 통과해야 가입하기 버튼 누를 수 있음
// 가입하기
// TODO: 인증번호 까지 맞아야 가입하기 됨 만들기
// TODO: 토스트 까진 띄웠는데 여러개 안되어 있으면 여러개 동시에 토스트가 나옴 그걸 해결해야함 하나씩 나오게
function addMemberHandler() {
  // 이름
  if (!memberNameRegex) {
    toast({
      position: "top",
      description: "이름 입력란을 확인해주세요.",
      status: "info",
    });
    document.getElementById("memberName").focus();
  }

  // 아이디
  if (!memberNameRegex) {
    toast({
      position: "top",
      description: "아이디 입력란을 확인해주세요.",
      status: "info",
    });
    document.getElementById("memberId").focus();
  }

  if (
    memberNameRegex &&
    memberIdRegex &&
    memberPwRegex &&
    memberEmailRegex &&
    emailCheckClick &&
    memberPhoneRegex &&
    phoneCheckClick
  ) {
    axios
      .post("/member/save", {
        memberId: memberId,
        memberPw: memberPassword,
        checkPassword: checkPassword,
        memberName: memberName,
        memberEmail: memberEmail,
        memberPhone: memberPhone,
      })
      .then((res) => {
        console.log(res.data);
      })
      .catch()
      .finally();
  }

TODO

1. 최상단 기준으로 한 개씩 토스트 팝업 띄우기

2. 휴대폰 인증번호 시작하기

 

일단 취업해서 작업 중단 상태

반응형