[카카오테크캠퍼스 3주차 회고] 시켜줘 명예소방.. 아니 베스트 TIL

⏳ 2023. 4. 24. - 2023. 4. 30.

 

😎 2주차 베스트 TIL에 선정되었다. 🥳

 

혼자 공부하면 이렇게 열심히는 정리하지 않는데, 쿠키즈와 함께라서 열정이 🔥 타오른다.

또한, 노션에 보기 좋게 정리하는 것이 화면에 최적의 경험을 제공하는 프론트엔드 개발과 결이 비슷하다고 생각했다.

그래서 학습일지 작성에 꽤 오랜 시간이 걸리지만.. 다 작성하고 나면 뿌듯하고, 복습할 때도 편한 장점이 있다!

3주차도 베스트 TIL 가보자고~

 

개념원리

css는 개념적인 공부보다는 실제 적용하는 경험만 많았다.

그렇기 때문에 형제 선택자, 가상 요소 선택자 등 정확한 명칭을 모르고 사용한 경우도 있었고,

강의를 듣고 나서야 이 부분에 대한 이해가 부족했구나 느끼기도 했다.(특히, 우선순위)

 

하루하루 조금씩이지만 성장하는 것이 스스로 느껴진다. 그리고 그것이 기쁘고, 재미있다.

이 마음가짐과 열정을 끝까지 가지고 가자!

---

상상도 못한

tabindex="-1"?

실은, tabindex에 값으로 0을 주는 것이 탭으로 이동했을 때 요소가 정렬된 순서(논리적 흐름)대로 이동하게 하는 방법이고, tabindex에 값으로 -1을 주는 것은 포커스 받을 수 있는 태그가 탭으로 포커스를 받지 못하게 하는 방법이다.

그럼 왜 강의에서는 동작한 것인가?
→ 탭이 아닌 클릭으로 포커스했기 때문! 값이 -1이지만, tabindex 속성이 있기 때문에 클릭했을 때 포커스가 된다.

강의에서 tabindex에 대해 소개해주었다.

처음 보는 속성이라 오.. 그렇구나..하고 넘겼다.

 

그런데 슬랙 질의응답에서 이에 관하여 질문이 나왔고, 생각해보니까 이상했다!

덕분에(이게 "같이의 가치"?) tabindex 관련 문서를 찾아보았고 내용을 다시 정리할 수 있었다.

 

앞으로 처음 보는 속성이 나온다면

관련 문서를 찾아보고 강의에서 적용하는 방식 이외에도 다른 사용법에 대한 추가적인 학습이 필요하다고 느꼈다.

---

!important

우선순위에 대해서 알고 있는 사실은 ‘인라인 방식이 링크 방식보다 높다’ 정도였다.

그동안 링크 방식으로, 대부분 클래스 선택자로만 css를 다뤘기 때문에 우선순위에 대해서 별로 신경쓰지 않은 것 같다.

div.hello { /* 1️⃣ */
  color: red;
}
.hello { /* 2️⃣ */
  color: green;
}

(같은 클래스인데 빨간색으로 출력되는 거 보고 충격먹음;;)

1️⃣은 태그(1점), 클래스(10점) → 11점, 2️⃣는 클래스(10점) → 10점으로 1️⃣의 우선순위가 더 높다.

 

2주차 피드백에서 !important 남발하지 않기 부분을 보고 그에 관한 내용을 찾아봤었는데, 이번 강의에서 관련 내용을 다뤄 좋았다!

---

이러다 다 죽어

선택 과정 파트1을 끝냈다. 그러나 16일 시작, 30일 완강.. 생각보다 진도가 느리다.

처음 수강하는 선택 과정이었기 때문에 따로 계획을 세우진 않고, 틈틈이 수강해서 전체적으로 완강이 늦어진 것 같다.

파트2부터는 목표 완강일을 정하고, 계획을 세워 수강하자!

---

파트 1에 관하여

스타벅스 웹페이지를 클론 코딩하면서 html, css, js를 자세하게 다루어 보았다.

새롭게 다가오는 부분이 많았고, 특히 동적인 화면을 위한 라이브러리(swiper, gsap)를 사용한 부분이 재미있었다.

2학년 때 날씨 어플을 만들어본 경험이 있는데, 슬라이드 화면을 구성하려고 swiper를 사용한 기억이 났다.

당시에는 코드 복붙 수준이었지만.. swiper를 또 보니 반가웠달까. 내적 친밀감?

아무튼! swiper는 실무에서도 정말 자주 사용한다고 하니, 사용법에 익숙해지자!!

 

유튜브 iframe에 관한 내용이 나오는데, 유튜브 영상의 ID 값이 v=어쩌고인 것을 이번에 처음 알게 되었다. 꿀잼

 

애플 공식 홈페이지가 재밌어서(고정이미지 배경을 잘 사용하는 듯) 참 좋아하는데, 직접 사용해보니 더 재미있었다.

파트2는 제목만 보면 애플 홈페이지 클론코딩 냄새가 솔솔 나는데 그랬으면 좋겠다. 🙏

 

2주차에서 예상했던 대로 필수 과정은 개념 위주, 선택 과정은 실습 위주가 맞는 것 같다.

실제 적용하면서 학습하는 것이 훨~~~씬 기억에 오래 남으니!! 꼭!! 선택 과정을 다 들을 것이다!! 🔥🔥