본문 바로가기

개발지식/Web 지식3

브라우저 렌더링 과정 브라우저의 역할 브라우저 렌더링 과정에서 브라우저가 하는 역할은 무엇일까? 브라우저는 개발자가 작성한 HTML, CSS, JS 코드를 이용하여 웹 페이지를 그려주는 역할을 한다. 이 때, 브라우저는 이 코드들을 가지고 어떻게 렌더링을 해주는 것일까? 브라우저의 구성 브라우저를 구성하는 요소는 크게 다음과 같다. 브라우저는 크게(1) 사용자 인터페이스, (2) 브라우저 엔진, (3) 렌더링 엔진, (4) 네트워크, (5) 인터프리터, (6) UI 백엔드, (7) 스토리지. 등으로 구성이 되어있다. (1) 사용자 인터페이스(UI): 브라우저 상에서의 주소표시줄, 뒤로가기 버튼, 새로고침 버튼 등, 사용자와 상호작용 할 수 있는 부분 (2) 브라우저 엔진: 사용자가 주소창에 입력한 URL 값이라든가 뒤로가기 .. 2024. 1. 6.
npm, yarn npm npm 홈페이지에서 설명하는 npm에 대한 정의는 다음과 같다. npm is the world's largest software registry. Open source developers from every continent use npm to share and borrow packages, and many organizations use npm to manage private development as well. 해석하자면 npm은 세계 최대의 소프트웨어 저장소이다. 모든 대륙의 오픈 소스 개발자들은 npm을 사용하여 패키지를 공유하고 대여하며, 많은 기관들이 개인적인 개발을 관리하는데 npm을 사용한다. npm은 자바스크립트/타입스크립트 프로그래밍 언어를 위한 패키지 관리자이고, 자바스크립트 .. 2023. 11. 19.
CORS 에러란 무엇인가? 웹개발을 하다보면 아래와 같은 오류를 종종 볼 수 있다. 아래 오류는 CORS 오류에 대한 메시지로, CORS 오류는 보안 상의 이유로 브라우저에서 발생하는 오류이다. CORS 정의 CORS란 Cross-Origin Resource Sharing의 약자로 교차 출처 리소스 공유를 의미한다. HTTP 헤더를 사용하여 한 출처에서 실행 중인 웹 어플리케이션이 다른 출처의 특정 자원에 접근할 수 있는 권한을 부여하도록 브라우저에서 알려주는 메커니즘이다. 보안의 이유로 브라우저는 (자바)스크립트에서 시작한 교차 출처 HTTP 요청을 제한한다. XMLHttpRequest와 FetchAPI는 동일 출처 정책을 따른다. CORS는 서버와 클라이언트 간의 상호 작용에서 중요한 역할을 한다. 즉, 이 API를 사용하는 .. 2023. 10. 8.
728x90