9. bootstrap5 로그인, 회원가입 페이지 만들기

로그인 페이지

다른 사이트 로그인 페이지와 비슷하게 만들었다.

 form 태그를 가장 바깥 컨테이너로 사용했고 div 태그로 내부를 만들어줬다.

text, password, submit, checkbox를 vstack으로 쌓아줬다.

그다음 hstack으로 아이디 찾기와 비밀번호 찾기, 회원가입 링크를 만들어 주었다.

만들다보니 배치하는데 생각이 많이 필요했다.

조금 더 익숙해져야할 필요가 있어 보인다.

회원가입 페이지

회원가입 페이지는 breakpoint-md 를 사용해 2가지 형태로 나오게 만들었다.

로그인 페이지보다 배치하는데 더 고민을 많이 했다.

생각을 하다 그냥 열을 4, 8로 나눠서 한 행을 다 채워넣었다.

vstack으로 margin top, bottom 대신 gap-3을 사용했다.

끝으로

회원가입 페이지는 js로 유효성 검사를 해야 되지만, 아직 js는 잘 모른다.

이제 진짜 다음 글부터 component를 하나씩 정리할 생각이다. 

총 24가지가 있는데 몇개씩 할지는 분량을 보고 하겠다.