[항해99] 미니프로젝트(Day2)

고정원·2021년 4월 13일
0

2021.04.13(화)
어제에 이어서 회원가입시, 프론트에서 처리할 수 있는 부분 작업

2. Nickname
-> 사용자는 input창에 사용하고 싶은 닉네임을 입력하고, 중복확인버튼을 누른다.
📍input에 값을 받아서 그 값으로 뭘 해보자 -> useState 사용!
2.1 사용자가 input창을 클릭하면 info가 출력되고(display='block'), 입력하는 값(e.target.value)이 형식에 맞는지 체크(changeNickname(e))
changeNickname
info 색깔바꿔주기

<li>6자 이상의 영문 혹은 영문과 숫자를 조합 </li>
<li>닉네임 중복확인</li>

3. Password
-> 비밀번호 형식을 알려주기 위해 input창을 클릭했을때, 비밀번호 작성형식을 보여주고 입력하는 값이 작성형식들에 맞는지 폰트컬러를 달리하여 알려준다.

4. Password check
-> 동일한 비밀번호를 입력했는지 체크한다.

5. Github address
-> github의 주소를 입력하면, 본인 깃허브의 주소인지 까지는 아니더라도 실제로 유효한 깃허브주소인지는 체크하고 싶어서
깃허브의 주소를 입력받으면, 그 값을 api넣어 response에서 status값(200 or 404)으로 확인하려 했다. 그러나 github 자체적으로 막아놓았다.(📍CORS에러발생)

-> 하여, 우리가 원하는대로라면 '깃허브로 회원가입하기'와 같은 로직을 타야 되는 것 같아서 우선은 github주소의 본인 아이디만 입력 받는것으로 마무리 했다.

-> sns로 회원가입/로그인 하기는 우선순위에서 나중으로 미루어 두었다.

=> Ref로 다 바꿔줘야 할 것 같다...ㅠ

profile
해결문제에 대해 즐겁게 대화 할 수 있는 프론트엔드 개발자

0개의 댓글