# Web Frontend

jiseung

이전에도 웹 접근성에 관련해 공부한 글을 쓴 적이 있는데, 웹 접근성 공부는 끝이 없는 것 같다!!! 이 글은 김데레사 강사님의 강의를 듣고 공유하고 싶은 내용 몇 가지를 주관적으로 정리한 글이다! > The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect. -Tim Berners-Lee, W3C Director and inventor of the World Wide Web 웹의 힘은 보편성에 이며, 장애에 관계 없이 모든 사람의 접근이 필수적이다. 웹은 물리적 세계에서 사람들이 직면하는 의사 소통, 상호 작용에 대한 장벽을 제거해주는 기능이 있다. 하지만 잘못된, 혹은 무지한 웹 설계는 이 장벽

jae_yoon

프론트엔드 Java Script 2021.09.12 ~ 8월에 공부한 내용을 모두 잊어버려서 다시 정리中 Java Script 서론, 링크 Web Developer라면 필수적인 JavaScript를 공부하기로 마음먹었다. 프론트엔드를 희망하지만 node.js를 활용한 백엔드에도 관심이 생겨서 그 부분도 깊게 공부하려고 한다. 추후, 모던 자바스크립트 딥다이브 교재를 통하여 대비할 것이다. 드림코딩 엘리 - JavaScript 기초강의 플레이리스트 https://www.youtube.com/playlist?list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2 MDN JavaScript 문서 https://developer.mozilla.org/ko/docs/Web/JavaScript Java Script(1) : 역사/현재/미래 > * 1. 동적인 웹사이트를 만들기 위한 노력 * 마크 앤더슨은 원래 정적이

junyoung7

템플릿 엔진(Template Engine) : 템플릿 양식과 특정 데이터 모델에 따른 입력 자료를 합성해서, 결과 문서를 출력하는 software(or software component) > 그 중에서 웹 템플릿 엔진은 웹 문서가 출력되는 템플릿 엔진을 말한다. html과 data logic code를 분리해준다. 출처 : https://gmlwjd9405.github.io/2018/12/21/template-engine.html 서버 사이드 vs 클라이언트 사이드 Server side template engine : 서버 측에서 DB, API로부터 가져온 정보를 미리 정의된 Template에 넣어서, 서버 측에서 html을 그려서 클라이언트에 내려준다. 이렇게 고정 부

junyoung7

렌더링 서버로부터 HTML 파일을 받아서, 브라우저 영역에 뿌려주는 과정을 렌더링이라고 한다. 먼저 브라우저가 서버로부터 HTML 문서를 내려 받는다. 렌더링 엔진이 HTML 문서를 파싱해서 DOM 트리를 구성한다. 외부 CSS와 함께 스타일 요소들을 파싱해서 CSSOM 트리를 생성한다. => 이 때, 스타일은 브라우저 자체 스타일, 사용자 정의 스타일, HTML 태그에 걸려있는 스타일 순서대로 처리됨 (그래서 html에 인라인으로 태그에 걸려있는 스타일 속성이 먼저 적용되는 거임) 이 DOM 트리 + CSSOM 트리를 하여서 렌더링 트리 생성하고(head, display = none인 요소는 포함 x), 각 노드의 크기와 위치를 계산한다.(레이아웃(리플로우) 단계) 여기까지 수행하면, 렌더링 엔진이 각 요소가 어디 어떤 크기로 표현되는지 알 수 있게 되고, 페인트 이벤트를 발생시켜 화면에 그린다.(페인팅(레스터화))

junyoung7

HTTP (HyperText Transfer Protocol) : 인터넷에서 데이터를 주고받을 수 있는 프로토콜(규칙). 주로 HTML 문서를 주고 받는데 사용하며, TCP/UDP 를 사용한다. 또한 80번 포트를 이용한다. 특징 연결 상태를 유지하지 않는, 상태가 없는 비 연결성 프로토콜 => Cookie와 Session이 등장하게 된 계기. 연결을 유지하지 않는 프로토콜이기 때문에 request/response로 동작함 HTTPS는 뭔가요 그러면? : HTTP + SSL(Secure Socket Layer) : HTTPS(HyperText Transfer Protocol Secure) HTTP의 확장 버전이다. HTTP는 plain text, 평문으로 데이터를 주고 받기 때문에 중간에서 데이터를 탈취할 수 있다. 반면 HTTPS는 암호화된 데이터를 주고 받기 때문에 이를 방지하여 보안성을 높일 수 있다. 브라우저 : 웹 서버에서