Sign Up Page

회원가입 페이지

계정 만들기:

아이디:

비밀번호:

[아이디 소스 코드]

<input id="username" name="username" type="text" required minlength="3" maxlength="20" pattern="[a-zA-Z0-9]+">

1. minlength & maxlength를 이용해서 아이디 길이를 조절할 수 있다.
2. pattern 기능을 이용해서 허용 가능한 input 값을 지정할 수 있다.

[비밀번호 소스 코드]

<input id="pw" name="pw" type="password" required minlength="8" maxlength="15">

Codecademy에서 제공한 예시는 비밀번호를 8자리 이상 15자리 이하 비밀번호를 요구했다.
하지만 요즘 많은 사이트들이 보안 이유로 특수 문자, 대문자, 소문자를 요구하고 있다.
Spiderman Far From Home에서 나온 피터와 해피의 대화는 그런면에서 현실성이 조금 떨어진다.

이제는 아래와 같은 비밀번호 강/약 bar를 가입할 때 많이 볼 수 있다.

<  input type="password" id="psw" name="psw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain at least one number and one uppercase and lowercase letter, and at least 8 or more characters" required>

위 소스코드에 따르면 비밀번호는 다음과 같은 요건을 모두 충족 시켜야한다.

1. 1개 이상의 대/소문자
2. 1개 이상의 숫자
3. 최소 8개 이상 케릭터