오늘은 뭔가.. 특히나 집중이 안되는 날이였다.
강의를 집중해서 들으려고 해도 그게 잘 되지만은 않았고, 계속 딴 생각을 하게 된 것 같다.
아마 월요일이라 그런거였겠지..라고 생각해본다.

Publishing

오늘은 퍼블리싱 강의를 들었다.
예전에 웹 디자인을 배우며 들었던 내용들이 많아 막 어렵지는 않았고, 대부분 복습하는 개념이였다.

새로 알게된 것들

label 태그

음.. 대충 checkbox를 만들었을 때, 지정된 칸을 눌러야만 체크가 적용/해제가 되는데 <label></label>이라는 태그로 묶게 되면 묶인 오브젝트의 어떤 부분을 누르더라도 체크가 적용/해제 된다.

<input type="checkbox" id="checkbox"/> 아이디 패스워드 저장

아이디 패스워드 저장
예를들어, 이런식으로 체크박스를 만들었을 때 박스 안쪽을 눌러야만 체크가 적용/해제 된다.

<label><input type="checkbox" id="checkbox" /> 아이디 패스워드 저장</label>

아이디 패스워드 저장
하지만 이런식으로 label 태그를 이용해 오브젝트를 한번 묶어주게 되면 아이디 패스워드 저장이라는 다른 오브젝트(지금 예시에서는 텍스트)를 눌러도 체크가 적용/해제가 된다!!

preventDefault();

처음 알게 된 자바스크립트 명령어!
사용은 event 뒤에 붙이는 식으로 event.preventDefault(); 이렇게 사용한다고 한다.

기본 동작을 막아주는 함수라고 하고, 예를들어 로그인(폼태그)을 제출하면 화면을 한번 새로고침 한다.
그런데 여기서 문제가 생긴다!
화면을 새로고침을 하게되면 입력한 정보가 전부 없어지게 된다!!

그렇기 때문에 event.preventDefault();를 통해 화면을 새로고침하는 것을 막아주는 것!

!!$('#checkbox:checked').val();

이게 갑자기 뭔가 싶기도 하겠지만 꽤 유용한 명령어인듯 하다.
일단 예시를 보도록 하자.

<label><input type="checkbox" id="checkbox" /> 아이디 패스워드 저장</label>

이런식으로 html에서 checkbox의 id를 checkbox라고 할당해주었다.

let isChecked = !!$('#checkbox:checked').val();

그 후 javascript를 통해 id가 checkbox인 것을 불러오는데, 앞에 !!를 붙여두었다.
이는 checkbox의 상태가 체크된 상태(checked)면 boolean 값 중 True를 반환하게 되고, 그렇지 않다면 False를 반환하게 된다.

(!!를 앞에 붙여준다면 javascript에서는 값을 boolean으로 받아온다고 한다.)

곧 기초 프로젝트가 시작된다. 걱정되고 부담된다..
하지만 이번 프로젝트도 잘 할 수 있을거라고 생각해!