프론트엔드면접질문 4

Browser Rendering Process (브라우저 렌더링 원리)

💟 브라우저 렌더링이란? 우리가 주소창에 https://www.google.com 또는 https://www.naver.com 등 다양한 URL을 검색하면 해당 웹페이지로 접속하는 것이 브라우저 렌더링 입니다. 즉, 브라우저라는 것은 우리가 흔히 이용하는 웹페이지/웹사이트들이고, 실시간으로 웹 브라우저를 화면에 그려내는 과정을 렌더링이라고 합니다. 💟 렌더링 엔진 대부분의 웹 브라우저들을 들여다보면 두 개의 엔진이 있는데, 하나는 렌더링 엔진으로 사용자가 보는 화면을 그려내는 역할을 하고, 하나는자바스크립트 엔진으로 자바스크립트 코드를 읽어서 기능을 작동시키는 역할을 합니다. 이러한 렌더링 엔진들은 브라우저마다 다른데, 우리가 흔히 사용하는 크롬은 블링크 엔진을 사용합니다. 렌더링 엔진은 웹 사이트의 소..

TIL/For Interview 2023.10.22

객체 지향 프로그래밍(OOP: Object Oriented Programming)

🧘🏻‍♀️ 객체지향 프로그래밍이란? 아직 면접을 본 적 없지만,, 면접 단골 질문이라고 하는 객체지향 프로그래밍에 대해 알아보도록 합시다. 우선 객체란 무엇인가? 객체는 프로그램에서 사용되는 데이터 또는 식별자에 의해 참조되는 공간을 의미하며 값을 저장할 변수와 작업을 수행 할 메소드(함수)를 서로 연관된 것들끼리 묶어서 만든 것이다 객체가 레고의 조각이고 레고의 조각을 조립해서 무언가를 만드는 방식을 객체지향 프로그래밍이라 할 수 있다. 예를 들어 '도서 관리 프로그램'을 만들어 본다고 가정하자. 이를 객체지향으로 구현하게 되면 책의 제목, 저자, 페이지수와 같은 자료형 필드와 대출하기, 반납하기 등의 메소드를 책이라는 객체에 묶어서 관리하는 것이 가능해진다. 이렇게 되면 추상적이었던 동작도 직관적으로..

TIL/For Interview 2023.05.16

Virtual DOM에 대해 정리해 보는 시간

DOM, Virtual DOM 등.. 줏어 들어보긴 했지만 누군가 설명하라고 한다면 머뭇거리게 되는 개념이지요 (^^) 훗훗 우선 DOM이란 무엇일까요? 처음 HTML을 공부할때 DOM tree를 잘 알아야 한다, DOM, node 등등의 중요성에 대해 많이 줏어 들었는데요. 🦖 DOM이란? Document Object Model의 줄임말 입니다. 말그대로 문서객체모델이지요. HTML의 각 요소들(element)을 tree 형태로 표현한 것을 DOM이라고 하는데요. 아래 구조를 보면 더 쉽게 이해할 수 있습니다. 하나의 root(뿌리)에서 여러가지 요소들이 가지를 친 것 같은 모습이죠. DOM tree안에는 각각의 element에 상응하는 Node가 들어 있는데요, 개발자들은 DOM구조에 접근을 하고 원..

TIL/For Interview 2023.04.06

What is a REST API? RESTful API?

API, REST API, RESTful API 등등 여기저기서 줍줍하여 들어보긴 했지만, 명확하게 이거이거에요 라고 설명하기 어려웠던 부분이에요 (저에겐^^) 🍎 API란? '한 프로그램에서 다른 프로그램으로 데이터를 주고받기 위한 방법' 이라고 할 수 있죠 Application Programming Interface의 약자인데 풀어써도 어려운게 함정.. 손님-점원-요리사로 많이들 비유하시는데, 손님이 자리에 앉아서 점원에게 주문을 하면 점원은 주문내역을 요리사에게 전달하죠? 요리가 끝나면 점원이 다시 손님에게 음식을 가져다 주고요. 이럴 때 중간 매개체 역할을 하는 점원이 'API'라고 할 수 있습니다. 즉 손님과 요리사를 서버라고 한다면 API는 중간에서 양쪽 서버를 연결해 주는거죠 🍎 REST란?..

TIL/For Interview 2023.04.05