끄적끄적 보니타

https://medium.com/@gethylgeorge/how-virtual-dom-and-diffing-works-in-react-6fc805f9f84e https://github.com/acdlite/react-fiber-architecture https://www.geeksforgeeks.org/reactjs-virtual-dom/ https://www.pluralsight.com/guides/virtual-dom-difference-maker-react-js#module-efficientdiffalgorithm

https://javascript.plainenglish.io/differences-between-vue-2-and-vue-3-ee627e2c83a8 Differences Between Vue 2 And Vue 3 Vue 3 is latest version of Vue which is progressive Javascript framework, help developer create a approachable, versatile, performant… javascript.plainenglish.io https://ko.javascript.info/ 모던 JavaScript 튜토리얼 ko.javascript.info https://web.dev/howbrowserswork/ How browsers work..

에러메시지 node_modules/puppeteer/.local-chromium/linux-686378/chrome-linux/chrome: error while loading shared libraries: libXcursor.so.1: cannot open shared object file: No such file or directory 해결 방법 1. su - root 2. apt-get install -y wget unzip fontconfig locales gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2...

https://developer.mozilla.org/ko/docs/Web/Events 이벤트 참조 | MDN DOM 이벤트는 발생한 흥미로운 것을 코드에 알리기 위해 전달됩니다. 각 이벤트는 Event 인터페이스를 기반으로한 객체에 의해 표현되며 발생한 것에 대한 부가적인 정보를 얻는데 사용되는 추가 developer.mozilla.org

HTTP 프로토콜의 요청과 응답은 헤더(header, 부가 정보)와 바디(body, 실제 데이터)로 구성 HTTP의 헤더와 바디는 개행문자인 '\r\n'으로 구분 헤더와 바디 사이에 한 개의 빈 줄(line)이 존재 HTTP 헤더는 요청과 응답에 공통으로 사용되는 공통 헤더 / 요청 헤더 / 응답 헤더로 구분 HTTP 공통 헤더 주요 항목 Data - HTTP 메시지를 생성한 일시- RFC 1123을 따름 ex) Date : Tue, 19 Nov 2019 04:13:24 GMT Connection - Keep-Alive를 설정 ex) Connection : keep-alive Cache-Control - Cache 속성을 설정 no-store : 캐시를 저장하지 않음 no-cache : 서버에 확인 후 ..

https://developer.mozilla.org/ko/docs/Web/API/Selection selection - Web API | MDN A Selection object represents the range of text selected by the user or the current position of the caret. To obtain a Selection object for examination or manipulation, call window.getSelection(). developer.mozilla.org https://developer.mozilla.org/ko/docs/Web/API/Range range - Web API | MDN Range 객체는 주어진 document ..

HTTP 헤더 - 클라이언트와 서버가 요청 또는 응답으로 부가적인 정보를 전송할 수 있도록 해주는 역할 - 대소문자를 구분하지 않는 키:줄바꿈이 없는 값 으로 이루어짐 (공백은 무시) - IANA 레지스트리에 신규 헤더 포함 모든 헤더가 나열되어 있음 (원본은 RFC 4229) ※ 커스텀 헤더는 'X-'를 앞에 붙여 추가 될 수 있었지만, RFC 6648에서 비표준 필드가 표준이 되었을 때 불편함을 유발해 2012년 6월 폐기 Context에 따른 Header 그룹화 General header - 요청과 응답 모두 적용 - body에 전송되는 데이터와 관련이 없는 헤더 Request header - patch될 리소스나 client에 대한 자세한 정보를 포함하는 헤더 Response header - 위치..

브라우저 (Browser) - HTML과 CSS 명세에 따라 HTML 파일을 해석해서 표시하는 도구 ex) 모질라, 파이어폭스, 크롬, 익스플로러, 엣지, 사파리 등 ※ 브라우저의 명세는 웹 표준화 기구인 W3C(World Wide Web Consortium)에서 정함 브라우저의 주요 UI - URI를 입력할 수 있는 주소 표시줄 - 상태 표시줄 - 도구모음 - 북마크 - 다양한 버튼 : 이전 버튼, 다음 버튼, 새로 고침 버튼, 현재 문서의 로드를 중단할 수 있는 정지 버튼, 홈 버튼 ※ 표준 명세가 없음에도, 수 년간 서로의 장점을 모방하다가 기준이 되어버림 브라우저의 주요 기능 - 사용자가 선택한 자원을 서버에 요청하고 브라우저에 표시 ※ 자원 : 주로 HTML 문서, PDF나 이미지 등 ※ 자원의..

Compiler - 고급 프로그래밍 언어로 작성된 코드를 machine code로 변환하는 컴퓨터 프로그램 - 사람이 읽을 수 있는 코드를 컴퓨터 프로세서가 이해하는 언어(바이너리 1 또는 0비트)로 변환하는 프로그램 - 컴퓨터는 machine code를 처리하여 해당 작업을 수행 - compiler는 작성된 프로그래밍 언어의 구문 규칙을 준수해야 함 - compiler는 해당 프로그램에서 발견된 error는 수정할 수 없음 => 컴파일 불가 - 프로그램이 실행되기 전, 한번에 모든 코드를 machine code로 변환 - interpreted 코드 보다 빠르게 실행됨 - compile을 수행한 후 모든 오류를 한꺼번에 표시 - translation linking-loading model 기반 Inter..

Same-Origin Policy - 웹 어플리케이션의 중요 보안 모델 - 주로 스크립트로부터의 데이터 접근에 적용됨 - 일치하는 HTML 태그를 경유하는 이미지, CSS, 스크립트, 글꼴 등 출처를 경유하여 리소를 임베드하는 것은 제한되지 않음 출처 결정 규칙 CORS란? - Cross-Origin Resource Sharing, 교차 출처 자원 공유 - 웹 페이지 상의 제한된 리소스를 최초 자원이 서비스된 도메인 밖의 다른 도메인으로부터 요청할 수 있게 하는 구조 - 추가 HTTP 헤더를 사용하여, 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제 - 웹 애플리케이션은 리소스가 자신의 출처(도메인, 프로토콜, 포트)와 다를 ..