🛠 Mission

5주차 워크북 실습 진행

📝 To-do

실습 1. - 로그인 페이지 유효성 검사 구현

UI

• 이메일과, 비밀번호 **type**의 **input**을 2개 만들어주세요.
• 모든 값을 입력한 후, 로그인 할 수 있는 **로그인 버튼**을 만들어주세요.

기능 체크

• 이메일은 올바른 이메일 형식이 아닐 경우, 위와 같이 에러 메시지와, UI상 변화가 나타나도록, 구현해주세요.
• 비밀번호도, 8자리 이상 16자리 이하가 아닌 경우, 에러메시지가 나오게 구현해주세요.
• 에러 메시지는, 실시간으로 조건이 충족하면, 사라져야 합니다.
• 실제로, input 창을 클릭했을 경우, **에러메시지가 나오게 동작**해주세요. input 창을 누르지도 않았는데, 바로 에러메시지가 나오면, UX 측면에서 기분 좋지 않겠죠?

🔍 접근 방법

useForm Hook 사용하기