본문 바로가기

전체 글139

브라우저 저장소의 차이점(Local storage, Session storage, cookie) 브라우저 저장소의 종류 브라우저 저장소의 종류는 Cookie, WebStorage 두가지로 나눠지고, WebStorage는 LocalStorage와 SessionStorage로 이루어져 있다. 웹 스토리지(Web Storage) 데이터를 클라이언트에 저장하기 위해 만들어진 키-밸류 형식의 저장소. HTML5에 포함되어 있는 스펙으로 기존의 저장소로 사용되었던 Cookie의 몇가지 단점을 개선한 스펙이다.(키-밸류 페어로 저장됨, 매번 서버로 전송되지 않음) 쿠키(Cookie) 서버와 클라이언트 간의 지속적인 데이터 교환을 위해 만들어진 키-밸류 형식의 저장소 브라우저 저장소의 차이점 1. 웹 스토리지와 쿠키의 차이점 1) 쿠키 목적 : 쿠키는 서버와 클라이언트가 지속적으로 데이터 교환을 하기 위해 만들어.. 2023. 7. 25.
[기술 면접 스터디-4일차] HTTP란, HTTP 메시지 구조, position 사용방법 1. HTTP란 ? 💡 하이퍼텍스트 전송 프로토콜을 의미. 웹 상에서 클라이언트와-서버 간에 데이터 통신을 하기 위한 통신규약 입니다. HTTP란 무엇인가? 1. HTTP란 ? 1. HTTP(Hyper Text Transfer Protocol) 💡 하이퍼텍스트 전송 프로토콜을 의미. 웹 상에서 클라이언트와-서버 간에 데이터 통신을 하기 위한 통신 프로토콜(규칙), 즉 통신규약 입니다. 클라이언 junvelee.tistory.com + HTTP와 HTTPS의 차이는? 1. HTTPS(Hypertext Transfer Protocol Secure)는 HTTP의 확장 버전 또는 더 안전한 버전이다. HTTPS에서는 브라우저와 서버가 데이터를 전송하기 전에 안전하고 암호화된 연결을 설정한다. 2. HTTPS는 .. 2023. 7. 24.
HTTP란 무엇인가? 1. HTTP란 ? 1. HTTP(Hyper Text Transfer Protocol) 💡 하이퍼텍스트 전송 프로토콜을 의미. 웹 상에서 클라이언트와-서버 간에 데이터 통신을 하기 위한 통신규약 입니다. 클라이언트가 브라우저를 통해서 어떠한 서비스를 URI로 서버에 요청(Request)하면, 서버에서는 해당 요청에 대한 결과를 응답(Response)하는 형태로 동작한다. HTTP/1.1, HTTP/2는 TCP 기반, HTTP/3는 UDP 기반 프로토콜이다. TCP 연결은 요청을 보내거나(혹은 여러 개의 요청) 응답을 받는데 사용된다. 클라이언트는 새 연결을 열거나, 기존 연결을 재사용하거나, 서버에 대한 여러 TCP 연결을 열 수 있다. 2. HTTP 메시지 구조 HTTP 메시지는 요청(Requests).. 2023. 7. 24.
[기술 면접 스터디-2일차] hoisting과 Parameter, argument 차이 1. Hoisting 이란? TDZ란? 호이스팅 - 자바스크립트 엔진이 런타임 이전(코드를 실행하기 전)에 변수와 함수 등의 선언이 해당 스코프의 최상단으로 끌어올려진 것처럼 동작하는 것을 말하며, 정확하게는 변수 식별자와 초기값 undefined를 컨텍스트의 최상단에 등록하는 것을 말한다. TDZ(일시적 사각지대) - TDZ는 let과 const 키워드로 사용하여 변수를 선언했을 때 호이스팅 후 실제 변수 선언문을 만나기 전까지 변수를 참조할 수 없는 일시적 사각지대 구간을 의미합니다. - TDZ는 ES6(ECMAScript 2015)에서 let과 const키워드가 도입됨에 따라 생겨난 개념입니다. 이전까지 var키워드로 선언된 변수는 호이스팅 되고 변수 선언과 undefined로 초기화가 동시에 진행.. 2023. 7. 20.
[기술 면접 스터디-1일차] 브라우저 렌더링 원리, RESTful API 1. 웹페이지가 브라우저에 렌더링되는 과정을 설명해주세요. 각 브라우저에는 렌더링 엔진이 존재하는데 이 렌더링 엔진이 critical rendering path 프로세스를 거치며 화면을 렌더링 합니다. 1. 사용자가 주소 표시줄에 URI 입력 2. 브라우저 엔진이 캐시에서 해당 URI의 캐싱된 데이터가 있는지 확인, 있다면 해당 자료를 렌더링 엔진에게 보내주고, 없다면 렌더링 엔진이 네트워크에 URI를 전달하여 네트워크가 해당 서버에 요청을 보내고, 응답받은 리소스를 렌더링 엔진에게 전달 3. 렌더링 엔진의 HTML파서가 HTML태그를 한줄씩 파싱하여 브라우저가 이해할 수 있는 Node 객체로 변환하고, 이 Node, 즉 DOM의 계층 구조인 DOM Tree를 형성 4. CSS파서가 CSS를 caseca.. 2023. 7. 19.
브라우저의 구성 요소와 렌더링 과정 브라우저의 렌더링 원리 브라우저는 사용자 인터페이스, 브라우저 엔진, 렌더링 엔진, 네트워크, 자바스크립트 인터프리터, UI백엔드, 스토리지로 구성되어 있다. 브라우저가 화면을 렌더링 할 때, CRP(Critical Rendering Path) 라는 프로세스를 사용하며 다음 단계들로 이루어진다. (1) 브라우저 엔진이 사용자 인터페이스로부터 URI를 받아 캐시에서 자료를 찾는다. 사용자가 주소표시줄에 입력을 하는 순간, 브라우저 엔진이 주소 값에 해당하는 캐싱된 데이터가 있는지 캐시에서 찾아본다. (2) 렌더링 엔진이 브라우저 엔진 또는 네트워크로부터 자료를 받는다. - 캐싱된 자료가 있다면 브라우저 엔진으로부터 렌더링 엔진이 자료를 받아 HTML, CSS, image 등을 파싱한다. - 캐싱된 자료가 .. 2023. 7. 16.