Section1 Unit10 JS/브라우저 DOM - 유효성 검사

---

Section1 Unit10 [JS/브라우저] DOM - 유효성 검사

 

⭐️ 과제. 유효성 검사

 회원가입 Form을 만들어보며, 특정 조건에 맞는 값을 입력하도록 구현하는 연습을 했다. 

 

See the Pen 회원가입 Form (유효성검사) by sowon (@hello_FAY) on CodePen.

 

Bare Minimum 요구사항을 완료 후 다른 기능도 추가해서 넣어보았다. 

 ✔️ 아이디와 패스워드 뿐만 아니라 전화번호, 이메일 영역도 추가하여 구현

 ✔️ addEventListener 사용 (학습자료에는 onkeyup을 사용)

 ✔️ 하단의 Message는 html이 아닌 js의 textContent로 내용 출력

 ✔️ 회원가입 버튼 disabled 조작

 ✔️ 약간의 html, css 수정

 

---

🌙  오늘의 회고

 오늘 스터디클럽에 가입했다 🙂 가입할까 말까 망설였었는데, 온라인 100%로 수업하다 보니 다른 사람들과의 소통이 잘 되지 않는 것 같아 스터디를 같이 하면 좋을 것 같아서 가입했는데, I인 나는 낯가리는 중이라.. 열심히 눈팅중.. 👀

 어제 오늘 진행한 유효성 검사 과제는 무난하게 제출했다. 다른 기능을 좀 더 적용해보고 싶어서 기존에 제시되어 있던 아이디와 패스워드 뿐만 아니라 전화번호와 이메일 input도 추가해서 정규표현식으로 검사를 하도록 구현했다. 요즘은 유튜브나 다른 커뮤니티에서도 chatGPT 사용을 추천했는데, 라이브 세션에서도 정규표현식은 chatGPT를 적극 활용하기를 권장했다. chatGPT가 등장한지 오래되지 않았는데, 개발 공부를 하면서 적극 활용하니 엄청난 도움이 되는 것 같았다. 1년 전쯤 정규표현식을 처음 접했을 때는 열심히 구글링해서 찾아봤었는데(그마저도 저 정규표현식은 외울수도 없어서 복붙해서 따로 메모해 뒀었다…), 요즘엔 질문 하나만 잘 던지면 알아서 착착 대답해주니 정말 신기하다…. 🤩 여튼 요즘 정말 잘 사용하고 있다.

 급 마무리 🤚🏻