내가 취업을 하다니..
엊그제 처음으로 한 회사에서 최종합격 전화를 받았다.
프론트엔드 개발자로 취업을 준비하면서 정말 내가 개발자로 한 팀에 속해서 일을 할 수 있을까 많이 고민하기도 하고 힘들었던 순간도 많았지만, 이렇게 좋은 순간도 찾아오고 정말 행복하다!
서류전형 -> 코딩테스트 -> 1차(실무)면접 => 2차(임원)면접 과정을 통해 채용이 됐다. 원티드를 통해 지원했다. 해당 회사에서 3개월간 근무한 내용이 확인되면 채용보상금도 받는다. (달달하다)
절대 내가 잘해서 뽑혔다고 생각하지는 않는다. 최종합격한 회사 1차면접(실무진면접)때 정말 질문하시는 내용의 10%도 대답하지 못했다. 모르는 내용이 정말 태산같이 많다고 느꼈다. 들어본적만 있는 용어, 들어본 적도 없는 단어, 내가 자랑스럽게 해봤다고 자소서에 적어놨는데 막상 질문을 받으니 그것에 대해 하나도 설명하지 못했던 용어들, 난 그 면접을 보며 나는 세상에서 가장 작아졌다. 하지만 면접 덕분에 내가 모르는 것이 무엇인지 알게됐다. 모르면 공부하면 된다. 오늘도 드림코딩 복습을 해야겠다.
DOM TREE를 만들자
HTML의 각 태그들을 Node로 변환한다. HTML 태그들을 브라우저가 이해할 수 있는 Javascript Object로 변환하는 것이다. (Node는 EventTarget을 상속한다. 그래서 모든 Node에서는 이벤트가 발생할 수 있다)
CSSOM TREE도 만들자
CSS도 브라우저가 이해할 수 있게 CSS Object Model로 변환된다. CSSOM은 브라우저에 기본적으로 적용된 css, 인라인 등의 모든 내용이 다 계산된 값이 적용된다(computed Style).
DOM + CSSOM = Render Tree
DOM과 CSSOM을 더하면 드디어! 우리가 브라우저에서 보여지게 될 모든 요소를 포함한 Render Tree가 완성된다. 말 그대로 보여지는 부분만 선별적으로 만들어지기 때문에 css 속성중 display:none는 render tree에 해당 Node가 포함되지 않는다. 반면 opacity=0, visibility:hidden 속성 같은 경우는 그 자리에 해당 노드가 존재하지만 보이지 않는 상태다. 즉 render tree에는 해당 요소를 확인할 수 있다.
