본문 바로가기

Front-end/Browser13

URI 그리고 URL, URN 📌 URI URL URN URC 모두의 관계성 📌 URI? (Uniform Resource Identifier) Identifier 식별자 네트워크상의 자원을 가리키는 고유 식별자(*ID)이다. ◾ URI 구조 scheme:[//[user[:password]@]host[:port]][/path][?query][#fragment] 1. scheme : 사용할 프로토콜 (네트워크 통신 규악)(OSI 7계층) 2. user 와 password : (서버의)데이터에 접근하기 위한 사용자의 이름과 비밀번호 3. host 와 port : 접근할 대상(서버)의 호스트명과 포트 번호 포트 번호는 보통 웹이 알아서 생략해준다. (http는 80, https는 443) 호스트명 대신 도메인명 또는 IP주소로 표현되기도 한.. 2021. 9. 11.
Client - Server : SOP와 CORS 📌 SOP? (Same Origin Policy) 동일 출처 정책으로, 하나의 Origin에서 로드된 문서나 스크립트가 다른 Origin의 자원과 상호작용하지 못하도록 제한하는 것. 여기서 말하는 Origin은 아래 3가지 요소를 조합한 것이다. ✔ URL Scheme (http, https ... etc URL SCHEME 종류 참고) ✔ Hostname [NodeName] (localhost, 내 블로그 기준 -> code-designer) ✔ port (3000, 8080 ...) 예전에는 브라우저에서 요청을 보내면, 서버에서 해당하는 로직을 수행한 뒤 "HTML을 완성시켜 반환"해줬다. 즉, 하나의 서버(동일한 Origin)에서 모든 작업이 수행되었다. 다른 브라우저와 교류할 일도 적었고, 만약 .. 2021. 9. 10.
REST API 기본 정리 📌 REST란 (REpresentational State Transfer)? HTTP를 기반으로 클라이언트가 서버의 리소스에 접근하는 방식을 규정한 아키텍처. 🏁 REST 특징 더보기 ◾ Uniform URI로 지정한 리소스에 대한 조작을 한정적이고 통일된 인터페이스로 수행하는 아키텍쳐다. --> REST가 지정한 API대로만 조작하게 하니까 ! ◾ Stateless 작업을 위한 상태 정보를 저장하거나 관리하지 않습니다. API server는 들어오는 요청만 처리하면 되기 때문에 서비스의 자유도가 높아지고 구현이 단순해진다. --> 요청만 단순하게 처리 ! ◾ Cacheable REST는 HTTP라는 기존 웹 표준을 그대로 사용하기 때문에 웹에서 사용하는 기존 인프라를 활용할 수 있다. 따라서, HTTP.. 2021. 9. 8.
브라우저 렌더링 과정 && 각종 용어 정리 📌 브라우저 렌더링? 1. [Parsing] HTML 파일과 CSS 파일을 파싱해서 각각 Tree 를 만듦. 2. [Style] 두 Tree 를 결합해서 화면에 표현되는 Node 를 기준으로 Rendering Tree 를 만듦. 3. [Layout/Reflow] Rendering Tree 에서 각 Node 의 정확한 위치와 크기를 계산. = 레이아웃을 계산. 4. [Paint/Repaint] 계산된 값을 이용해 각 Node 를 화면 상의 실제 pixel 로 변환하고 여러 개의 Layer로 생성. 5. [Composite] Layer 들을 합성하여 실제 화면에 나타냄. 대부분의 프로그래밍 언어는 운영 체제operating system이나 가상 머신virtual machine 위에서 실행된다. 그러나 웹 애.. 2021. 8. 22.