어제 밤에 바로 자러가서 다음날 아침에 쓰게 된다(1월 12일 > 13일)
회원가입 페이지 만들고 난 후 테스트 해보면 비밀번호와 비밀번호 확인시 문구 변경이 되지 않는점과 한글 닉네임 사용 시 가입 환영창이 뜨지 않는 오류 발견됨
회원가입페이지와 로그인 페이지를 reload 되지않고 바로 뜨게 만드는것을 배웠다.
hasClass('클래스명')으로 확인하여 display:none를 주면 되며
bulma를 사용하고 있어 is-hidden이라는 클래스를 적용하면 됐다.
사용방법
1. 로그인 페이지 칸과 회원가입 페이지 칸을 모두 한 html에 작성한다.
2. 로그인시 나와야하는 칸은 id를 넣어 정리해 둔다
3. 회원가입 시 나와야 하는 칸은 is-hidden 클래스를 준다.
4. removeClass('클래스명') -> addClass('클래스명')을 if문 사용
5. 제이쿼리를 임포트 하게 되면 toggleClass('클래스명')을 주게 되면 if문 사용 없이 한줄로 구현 가능하다.
그렇게 한페이지 내에서 회원가입하기 누르면 로딩없이 바로 나타낼수 있다.
단점으로... 아직 내 기능이 부족해서 로그인창 ID,PW에 값을 입력하고 회원가입 누르면 그 값이 회원가입창에도 적용된다는 점이다.
12일 종일 했던것은 이렇게 토글을 사용한 방법을 시도했으며 id값을 정리해 뒀다.
아직 다른 페이지가 끝나지 않아 먼저 시작할수 없어 도움을 드렸는데
div 박스 안에 일정 글자수 이상 되면 박스를 삐져나오는 경우가 발생됐다.
박스크기설정을 해도 동일하여 글자수 제한할수있는 기능을찾아보다
함수를 사용해서 일정 글자수 이상 나오면 제한 걸어둘수 있고 css를 사용할수도 있다.
overflow: hidden; (글자가 넘어가면 그 밖에 글자는 안보이게)
word-break:break-all; (글자가 넘어가지 않게)
text-overflow: ellipsis; (글자가 넘어가면 생략기호)
1. width 또는 height가 고정적일 것
2. overflow: hidden; 을 사용해 영역을 감출 것
3. 아래줄로 내려가는 것을 막기위해 white-space: nowrap 등이 필요
이렇게 3가지 css를 내가 적용했을때는 안됐으나 팀원분이 적용하니
글자수 생략이 가능해졌다...!
오늘은 미니프로젝트 제출하는날 이므로 각 페이지마다의 완성도를 다져보며 기능은 재업데이트해야한다.
