😃오늘 배운 내용
query selector
Document.querySelector()는 제공한 선택자 또는 선택자 뭉치와 일치하는 문서 내 첫 번째 Element를 반환한다. 일치하는 요소가 없으면 null을 반환한다.
백틱 `의 역할은?
- 템플릿 리터럴(Template Literal) : ES6부터 새로 도입된 문자열 표기법이다. 문자열 생성시 따옴표 대신, 백틱(`)을 사용하고, 이는 몇 가지 장점을 가지고 있다.
- 문자열 내부에서 줄 바꿈 표기를 \n을 쓰지 않고 표현이 가능하다.
- ${ } 사이에 들어간 변수는 문자열이 되던 과거와는 달리, 템플릿 리터럴을 사용하면 ${ } 사이에 변수나 연산 등을 삽입할 수 있다.
Cookie?
서버로부터 응답을 받으면 클라이언트와의 통신이 종료되고, 상태 저장을 하지 않는 성격을 가진 HTTP의 단점을 해결하기 위해 쿠키라는 개념이 도입되었다.
쿠키는 4KB크기의 파일로서, HTTP통신 시 헤더에 추가되어 웹 서버가 클라이언트 컴퓨터에 저장한다. 한 번 쿠키가 저장되면, 해당 URL로 시작하는 모든 페이지들에 대한 요청에 쿠키 이름과 값이 포함되어 전달된다. 말 그대로 서버가 클라이언트를 구문하기 위해서 이름표를 달아주는 것이라 생각하면 편하다.
쿠키값으 기본 형태는 document.cookie = "쿠키이름=쿠키값"이고, "쿠키이름 = 쿠키값"쌍이 ";" 로 연결되어 쿠키에 다양한 정보를 담을 수 있다. 가령 이렇게 말이지요. user=Rok; path=/; expires=Tue, 19 Jan 2038 03:14:07 GMT
쿠키 설정과 쿠키값을 받는 작업은 setCookie,getCookie함수를 구현해서 수행할 수 있다.
😎느낀 점!
이제 본격적으로 프론트엔드 웹개발 실습에 돌입했는데, 컴포넌트 단위의 코드 작성이 아직 어색하다. 확실히 컴포넌트 단위로 관리하게 되면, 유지보수성이 좋아지고 코드의 가독성도 좋아지는 것 같다.
매일매일 정신없이 강의를 들으며 공부하다 보면 하루하루를 되돌아 볼 수 있는 시간을 갖기가 어려운데, TIL을 통해서 하루를 되돌아보게 되어 참 좋다. 이번 주말은 밀린 강의를 듣느라 정말 고생했다. 강의 시간은 짧은데, 이 강의를 소화하기 위해서는 그 시간보다 몇 배 더 많은 시간을 투자해야한다. 모든 일이 그렇다. 진정으로 내것으로 만들고 능숙해지기 위해서는 각고의 노력이 필요한 것이다.
능숙함이 직관이 될때까지 정진하자!
😁참조
