git에서 특정 브랜치만 clone하기 참고 git을 사용하다 브랜치 전체를 clone하지 않고 특정 브랜치 하나만 clone하는 것이 필요할 때가 있다. 문제상황 장기 프로젝트를 위해 따로 브랜치를 따놨는데, master에 긴급 및 단기 프로젝트 기능을 넣다보니 장기 프로젝트 코드의 내용과 마스터의 코드 내용이 많이 달라지게 됐다. 작업 컴퓨터를 바꾸고 장기프로젝트 건과 master를 오가며 작업할 일이 생겼는데, master를 clone하니 장기프로젝트 브랜치만 받을 수 없어 작업에 어려움이 있었다. 해결 $ git clone -b {branch_name} --single-branch {저장소 URL} 예: git clone -b tempbranch --single-branch https://gith..
clientHeight, offsetHeight, scrollHeight의 차이 참고 문제상황 DOM을 이용해서 JS 이벤트를 조작하고 있었는데 문득 clientHeight(width), offsetHeight(width), scrollHeight(width)의 차이가 궁금해졌다. 위의 스택오버플로가 너무나 간결하게 정리해줬다. client- : 눈에 보이는 content + padding의 크기값 offset- : 눈에 보이는 content + padding + border + scrollbar의 크기값 scroll- : 눈에 보이지 않는 영역까지 포함한 전체 content + padding의 크기값 따라서 아래 구문이 true면 어떤 요소를 끝까지 스크롤한 것이다. (출처) // true면 eleme..
HTML checkbox 디자인 커스텀하기 문제상황 디자인 시안을 받았는데 기본 체크박스가 아닌 다른 모양의 체크박스였다. 해결 기본 체크박스는 숨김 처리하고 label을 이용해 스타일을 만든다. 텍스트의 위치 조정을 위해 별도의 wrapper를 만들고 position relative를 설정해준다음, text 요소의 position 은 absolute로 잡아 조정한다. 예시 코드 텍스트 생각할 점 이거보다 좀더 좋은 방법이 있을까..? 체크박스나 라디오 박스는 실무에서 자주 사용할 테니 저장해놔야겠다. 사이트에서 자주 볼 수 있는 요소들은 미리 만들어 놓는 게 좋겠다.
자바스크립트로 페이지 새로고침하기 참고1 참고2 문제 상황 어떤 특정 상황에서 강제로 페이지를 새로고침해야 했다. 해결 아래 메소드 중 하나를 골라 사용한다. // 1. history.go(); // 2. history.go(0); // 3. window.location.reload(); // 4. window.location.href=window.location.href; 매번 새로고침을 해야 하는 페이지가 있다면 setInterval 등을 활용해서 응용하면 되겠다.