오늘한 일
- 100일 코딩 챌린지 - Web Development 부트캠프를 진행했다
- 알고리즘 문제를 풀었다
- 블로그 TIL을 작성하였다
- 1일 1커밋을 하였다
느낌 점
오랜만에 예전으로 돌아가 빡세게 공부를 시작하니 몸이 적응이 안되어 힘들지만 그래도 참고 빨리 웹과 디자인을 공부하여 세붕이 홈페이지를 제작해야겠다
배운 점
웹 페이지 동작 방식
웹 페이지 동작 과정은 크게 두 가지로 나뉘는데 첫째로 웹 페이지를 요청하고 받아오는 과정인 클라이언트-서버 모델, 둘째로는 받아온 웹 페이지를 렌더링하는 과정이다
클라이언트-서버 모델
클라이언트(웹 브라우저)가 웹 페이지를 요청한다 서버는 해당 웹 페이지에 대한 요청을 받고 그에 따른 데이터를 생성한다 생성된 데이터는 HTML, CSS, JavaScript 등의 파일로 구성되며 서버는 이렇게 구성된 데이터를 클라이언트에게 전송한다 클라이언트는 받은 데이터를 해석하고 렌더링한다
웹 페이지 렌더링 과정 HTML 파일을 먼저 파싱한다 참고로 여기서 파싱은 마크업 언어로 작성된 문서를 읽고 그것이 어떤 의미인지 이해하는 과정이다 파싱된 HTML 파일은 DOM 트리로 변환되며 이 트리는 웹 페이지의 구조를 표현한다 CSS 파일도 파싱되어 스타일 규칙이 추출된다 이 규칙은 DOM 트리의 요소들에 적용되며 JavaScript 파일도 파싱되어 실행된다
이 때 DOM 트리를 수정하거나 CSS 스타일을 변경할 수 있다 최종적으로는 브라우저는 DOM 트리와 CSS 스타일, JavaScript의 실행 결과를 바탕으로 렌더링하게 되며 이 과정에서 화면에 보여지는 웹 페이지가 생성된다
내일 계획
내일은 진짜로 피그마 디자인에 대해 배워야겠다