[WIL] 4월 2주차 (04/11 ~ 04/16)

START

1. 데일리 미션을 하는 시간을 하루 2시간으로 정했다. 기술 면접을 준비한다고 생각하면서 꼼꼼하게 준비하고 있다.
   특히 이번 주에 1차 평가라고 하는 기술 면접을 진행했는데, 멘붕이 왔다. 내가 이렇게 얕게 알았다니..😭 정확한 이해가 없이 대충 넘어갔었는데 다 뽀록났다..ㅋㅋㅋㅋㅋㅋ

2. 코어 자바스크립트 책 대출
   자바스크립트가 깊게 팔수록 점점 어려워짐을 느꼈다. 정제되어있지 않은 정보의 홍수 속에서 허덕이는 나를 발견해 하나의 책을 바이블로 여기며 살펴봐야겠다고 생각했다. 수많은 책들 중에 2가지 후보 (사실 가장 대표적인) "모던 자바스크립트 Deep Dive"와 "코어 자바스크립트"가 있었는데 아무래도 딥다이브는 너무 두꺼워서.. 우선 코어 자바스크립트를 한번 훑고 딥다이브로 넘아갈 예정이다.

3. 청계천 드래곤 팀 데일리 미션 - 안보고 대답하기 세션 시작
   매일매일 방대한 데일리 미션을 하다보니 휘발되는 것을 느꼈다. 따라서 일주일에 1번씩 1문제에 대해 대답하기를 하기로 했는데 막상 시행을 하니 너무 횟수가 적다고 느껴졌다. 따라서 팀원들과 토의 끝에 저녁먹기 전 5시 반에 짧게 모여서 30분간 서로 1문제씩 출제하고 대답하기로 했다.

이번주에 처음으로 시행했는데, 생각보다 재미있고 부담은 되지만 서로가 잘못 알고 있는 것에 대해 짚어줄 수 있어서 좋은 방법이라고 느꼈다! 앞으로도 지속할 예정

• 하지만 팀이 변경 되면.. ㅠㅠ 이거에 대해 이야기해볼 예정이다.

STOP

1. 이번주 알고리즘 스터디는 잠시 중단..
   웹 컴포넌트를 구현하는 요구사항이 너무 어려워서 일주일 내내 그것만 팠다. 스스로 공식 문서나 자료들을 찾아보고 "재사용성"이 좋은 코드를 작성해야하는데 로직을 생각하는데 많은 힘을 들였다.(뒤에서 더 자세히 얘기할 예정)

따라서 아쉽지만 정말 핑계가 아니라 알고리즘 문제를 못풀었다. 그래도 다행인 것은 다음주는 알고리즘 주간이기 때문에(사실 이번주부터였지만 밀렸던 나..) 많이 풀 수 있을 것이라 생각한다.

2. 컨디션 조절 실패
   이번주는 컨디션 조절에 실패했다. 몸이 안좋았다고나 할까.. 머리가 아픈 현상이 지속되었다. 아마 스트레스 + 부담감 때문인 것 같은데 해결책을 빠르게 찾아야한다. 따라서 운동을 다시 다녀볼까 한다.

Continue

1. TIL을 꾸준히 쓰고있다.
   물론 하루 이틀씩 미룰 때도 있지만, 미뤘다면 최대한 오전시간을 활용해서 빠르게 적으려고 노력하고 있다.

2. Weekly Mission 선택 요구사항까지 구현
   사실 필수 요구사항은 커리큘럼 내에서 출제가 되고 선택 요구사항은 그것에서 더 나아가 혼자 학습 한 뒤 (혹은 원래 알고있거나) 구현을 해야하는데, 놓치기 싫어서 많은 시간을 투자하면서 구현하고 있다. 이번주는 웹 컴포넌트를 사용하는 것이 선택 요구사항이었는데 사실 살짝 벅차긴 했다. (이유는 정규 커리큘럼도 양이 너무 많은데, 시간을 더 내려고 하다보니 잠이 부족했다.)

그래도 코드리뷰를 받을 수 있다는 점과 어차피 개발자가 된다면 공식문서를 보며 스스로 학습을 해야하기 때문에 스스로 공부하는 힘을 기른다는 차원ㅇ에서 앞으로도 지속할 예정이다.

What I Learned

From 이론

이번주는 프로미스, 모던, 객체 지향 자바스크립트에 대해 공부했다. 더불어 멘토링 시간에 지금까지 학습한 내용에 대한 기술 면접을 진행했다.

• 학습 내용 (TIL)

  • [TIL] 멘토링과 자바스크립트 웹 개발 기본기 (with 무한 alert 원인)
  • [TIL] 모던 자바스크립트
  • [TIL] 자바스크립트 객체 지향과 모의 기술 면접😭
    

• 이론 정리 (feat 백과사전)

  • 자바스크립트 웹 개발 기본기 백과사전
  • 모던 자바스크립트 백과사전
  • 자바스크립트 객체 지향 기본기 백과사전

From project

1. Week3 로그인 폼 태그 submit에 관련한 validation에서 && 연산자를 사용하며 short circuit에 대해 알아볼 수 있었다.
   [TIL] form태그와 location, short circuit, 웹 컴포넌트

2. position: absolute' 일 때 세로 중앙 정렬 하는 방법 부모 요소에 대한 세로 중앙 정렬 법이다. top : 50 으로 둔 뒤, transform("0%", "-50%")`를 하면 되는 것을 코드리뷰를 통해 알게 되었다.

3. auto 키워드
   Week2를 구현하다가 무작정 grid-template: repeat(2, auto) / repeat(2, auto);에서 auto 키워드를 적었다. 그런데 작동을 해서 자료를 찾아봤는데 못찾았다.
   하지만 공식 문서에 이미 명시되어있었다니.. 루크가 알려줬다

• 공식 문서를 보는 습관을 들이자
  

3. Wee3 무한 alert 원인
   [TIL] 멘토링과 자바스크립트 웹 개발 기본기 (with 무한 alert 원인)
   결론은 Window에서만 발생하는 고질적인 오류였다. 아마 alert가 발생되고 focus in & out이 트리거 되는 로직이 맥북과 다른 것 같다. e.sourceCapability 프로퍼티에서 alert로 인한 event와 실제 사용자가 발생시킨 event 사이에 null이냐 요소이냐의 차이가 있음을 알고 이를 사용해서 (임시로) 구현했다. 하지만 일반적이지 않은 방법이다.
   결론은 무분별한 alert는 사용하지 않는 게 좋다.

4. 웹 컴포넌트
   

[TIL] 자바스크립트 실행 컨텍스트와 웹 컴포넌트
간만에 리액트가 생각이 났다. 하지만 vanila로 작성하려니 어려웠고 생명주기를 고려하는 것에 많은 힘을 쏟았다.
다양한 callback에 대해 알 수 있었다. 가장 어려웠던 부분도 이것이었는데, observer 등록을 하고 attributeChangedCallback이 실행되게 하는 것에 실패했다. 아마 attribute명을 Camel로 적어서 그런 것 같은데.. 리팩토링을 하면서 재시도 해볼 예정이다.

• Custom elements, Shadow DOM를 생성하는 것은 익숙해졌으나 HTML 템플릿은 만들어 사용하지 않았다. 리팩토링때 사용할 예정이다.
  

So what next?

1. 알고리즘 주간 시작! 자료구조와 알고리즘에 대한 기초를 이번 기회에 확실하게 잡고 넘어갈 예정이다.
2. 틈틈히 Week4 컴포넌트 리팩토링하기. 웹 컴포넌트에 대해 처음 접해서 캡슐화를 제대로 하지 못했다. 보완할 것!
3. TIL는 매일 밤 10시에 작성하기
4. 멘토링 - 가고싶은 기업 공고 분석하기