등장배경 웹 어플리케이션이 점점 더 방대해지는 패러다임속에서 살아가면서 코드의 양도 동시에 많아지고 있다. 이로 인해 작성하는 코드들에 대한 정리가 필요해졌고, 클린 코드라는 용어가 나올정도로 코드의 가독성은 개발자들 사이에 중요한 요소로 자리잡게 되었다. 코드가 읽기 쉬워지면 더 효율적으로 일을 하는데 도움이 되고, 개발자끼리의 코드 해석 또한 빠르게 공유할 수 있는 전제를 만들어 내기 때문에, 여러가지 방법론들이 등장하게 되었다. BEM(Block Element Modifier) CSS 구조를 개선시키기 위한 CSS 개발 방법론 중에 하나인 방법론이다. 이는 문제의 요소에 대한 근거하는 클래스의 이름을 짓는데 구조적인 방법을 제시하는데, 오직 클래스명에만 활용할 수 있다는 점을 명심해야 한다. 클래스..
Language & Framework & Library
등장 배경 Virtual DOM을 이해하기 위해서는 브라우저가 동작하는 원리에 대해서 아는 것이 중요하다. 관련 자료는 밑에 첨부를 해두었으니, 한번 보고 오는 것도 나쁘지 않은 선택인 것 같다. https://sangcho.tistory.com/entry/ES5-Intro2-Browers-%EB%8F%99%EC%9E%91-%EC%9B%90%EB%A6%AC ES5 .Intro(3) - Browser 동작 원리 브라우저는 아마도 가장 많이 사용되는 소프트웨어일 것이다. 이 기록은 브라우저가 어떻게 동작하는지 간략하게 알아볼 것이다. 현재를 기준으로 상당히 많이 브라우저들이 존재하는데, 대표적인 브라우저로는.. sangcho.tistory.com HTML DOM은 HTML document의 구조와 같은 트리..
DOM: 프로그래밍 언어가 웹사이트의 내용, 구조 그리고 스타일을 조작 수 있게 만들어주는 인터페이스 javaScript: 인터넷 브라우저 상의 DOM과 연결해주는 클라이언트 사이드 스크립팅 언어 조금 더 깊숙하게 DOM에 대해서 알아보자. DOM DOM에 대해서 알아보기 전에 DOM을 다루는 브라우저에 대해 잠시 짚고 넘어가자. 브라우저(browser): HTML과 CSS를 해석하는 프로그램이기 때문에 내용(contents), 스타일(style), 구조(structure)를 우리가 보는 페이지에 렌더링 하는 역할 브라우저는 서버로부터 파일(HTML, CSS, JavaScript, 이미지 파일 등)을 응답받아 렌더링 엔진의 HTML 파서와 CSS 파서에 의해 파싱되어 DOM, CSSOM 트리로 변환되고,..
함수를 당장 실행하지 않고 정확히 몇 초의 딜레이 후에 실행하고 싶을 쓰는 함수가 있다. 이것을 "Scheduling a call" 이라고 하는데 이것을 구현하기 위해 2가지의 메소드가 존재한다. 1. setTimeout 2. setInterval 이 두 메소드는 JavaScript 스펙의 일부가 아닌 Node js, 브라우저에서 제공되는 메소드들이라는 것을 꼭 명심하기 바란다. setTimeout, clearTimeout setTimeout: 일정 시간 간격 이후에 함수가 한번 실행 func|code: 실행을 위한 함수나 문자열, 주로 함수를 받는다. delay: 실행하기 전의 딜레이, ms단위로 이루어져 있다, (1000ms == 1 second), default 값은 0ms이다. arg1, arg2..