글쓰는쿼카의 PM 여정
(2024. 6. 19.) 로그인, 회원가입 유효성 검사 기능 구현 본문
로그인, 회원가입 조건
1. ID
- 빈칸 x
- 이메일 형식 O
2. PassWord
- 빈칸 x
- 6글자 이상 O
- 영어, 숫자, 특수문자 3가지 모두 포함 (보류)
3. Recheck PassWord - 회원가입만 해당
- 빈칸 x
- 2번 PassWord와 일치
4. Nickname - 회원가입만 해당
- 빈칸 x
- 3글자 이상 O
const validateEmail = (email) => {
const regex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i;
return regex.test(email);
};
const handleSignUp = async (e) => {
if (!email) {
alert("이메일 주소를 입력해주세요.");
return;
}
if (!validateEmail(email)) {
alert("이메일 형식으로 이메일 주소를 입력해주세요.");
setEmail("");
return;
}
if (!password) {
alert("비밀번호를 입력해주세요.");
return;
}
if (password.length < 6) {
alert("비밀번호는 6글자 이상이어야 합니다.");
setPassword("");
return;
}
if (!recheckPassword) {
alert("비밀번호를 확인해주세요.");
return;
}
if (password !== recheckPassword) {
alert("비밀번호와 일치하지 않습니다.");
setRecheckPassword("");
return;
}
if (!nickname) {
alert("닉네임을 입력해주세요.");
return;
}
if (nickname.length < 3) {
alert("닉네임은 3글자 이상이어야 합니다.");
setNickname("");
return;
}
'개발 > React' 카테고리의 다른 글
🌐Tailwind CSS (2024. 6. 27.) (0) | 2024.06.28 |
---|---|
💣[개인과제] TypeScript - 플러스 주차 (2024. 6. 26.) (0) | 2024.06.26 |
[팀프로젝트] 역할 세분화 요청 (2024. 6. 18.) (0) | 2024.06.18 |
[팀프로젝트] 아웃소싱 프로젝트 소개 (2024. 6. 16.) (0) | 2024.06.18 |
🌐비동기 통신 방법 - axios -part 2 (2024. 6. 13.) (0) | 2024.06.13 |