본문 바로가기

Tech40

Controlled Components, Uncontrolled components 사전 지식 우선 두 가지 개념을 알아보기 전에, 기본 개념을 알아보자. HTML에서 , , 같은 Form element는 사용자 입력에 기반해서 자신의 상태를 유지하거나 갱신한다. 즉, HTML 태그 자체적으로 상태를 갖는다. Input event Input event가 발생하면, , , 의 value가 변한다. https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event HTMLElement: input event - Web APIs | MDN The input event fires when the value of an , , or element has been changed. developer.mozilla.org Change ev.. 2021. 8. 3.
HTML5 Tags HTML5는 HTML의 새로운 버전으로 Client Side Technology 기술의 중심이 되는 마크업 언어이다. HTML5 의 등장으로 CSS3, 자바스크립트 API를 통한 기능의 확장과 결합을 통해 기존의 HTML 이상의 의미를 부여하게 되었고 기존의 Active-X 와 같은 플러그인인 외부 기술에 의존했던 것을 걷어냄으로서 웹표준, 웹접근성을 한층 높여놓고 있다. HTML5 문서는 반드시 으로 시작하여 문서 형식(document type)을 HTML5로 지정한다. (아래 링크 참고) https://egas.tistory.com/86?category=498296 DOCTYPE은 무엇을 하나요? DOCTYPE은 무엇을 하나요? DOCTYPE은 document type의 약어이다. DOCTYPE의 유.. 2021. 8. 3.
DOCTYPE은 무엇을 하나요? DOCTYPE은 무엇을 하나요? DOCTYPE은 document type의 약어이다. DOCTYPE의 유일한 목적은 브라우저가 문서를 렌더링할 때, quirks mode(쿼크 모드)로 바뀌지 않도록 하는 것이 유일한 목적이다. 또한, HTML5에서 DOCTYPE의 유일한 목적은 full standards mode를 활성화하는것이다. 세부 설명 옛날에는 웹 페이지가 Netscape Navigator, Microsoft Internet Explorer로 두 가지 버전이 있었다. W3C에서 웹 표준이 만들어졌을 때, 기존 웹 브라우저와의 호환이 안되어서 바로 사용할 수가 없었다. 따라서, 브라우저는 새로운 표준 준수 사이트를 이전 레거시 사이트와 다르게 처리하기 위해 두 가지 모드를 도입했다. 현재는 quir.. 2021. 8. 2.
HTMLElement 문서 객체 모델(Document Object Model, DOM)은 자바스크립트 Node 객체의 계층화된 트리이다. HTMLElement 모든 요소들은 HTMLElement의 자식이다. HTMLElement는 Element의 자식이고, Element는 Node의 자식이다. ex1 document.getElementById의 반환 값: HTMLLIElement document.getElementsByTagName의 반환 값: HTMLCollection HTML CSS JavaScript 반환 값이 하나면 HTMLLIElement를 반환하고, 여러 개면 HTMLCollection을 반환한다. ex2 HTMLElement는 여러 가지 종류가 있다. Google HTML CSS JavaScript 표준 문서 H.. 2021. 8. 2.
React Element vs Component Element React에서 Element는 React 애플리케이션을 가장 작은 단위의 구성 요소이다. React DOM은 React 엘리먼트와 일치하도록 DOM을 업데이트한다. Element는 immutable하다. 보통 Component에서 Element를 반환한다. Component React에서 Component는 function혹은 class이며, props와 state를 가질 수 있다. 즉, Component는 props를 전달받아 Element를 출력하는 함수이다. https://reactjs.org/docs/rendering-elements.html Rendering Elements – React A JavaScript library for building user interfaces re.. 2021. 8. 1.
DOMString DOMString은 UTF-16 문자열을 위한 독립적으로 구현된 DOM 인터페이스이다. JavaScript 문자열은 이미 UTF-16 문자열이므로 JavaScript의 모든 인스턴스 String는 자동으로 DOMString 인스턴스이기도 하다. DOMString 허용하는 특정 Web API의 경우, ToString으로 문자열화한다. DOMString 허용하는 특정 Web API의 경우, null일 때, "null" 대신 빈문자열을 전달하는 레거시 동작이 있다. 오.. 충격적 사실. 참고 https://www.w3.org/TR/DOM-Level-3-Core/core.html#DOMString Document Object Model Core 1.1.1 The DOM Structure Model The DOM.. 2021. 7. 31.

티스토리툴바