DOM의 사이즈를 구하는 방법에는 여러가지가 있습니다. 하지만 사이즈를 구하면서도 발생할 수 있는 여러가지 경우의 수가 있어서 사이즈를 구할때 내가 어떤 사이즈를 구하려고 하는지 신중하게 잘 판단하셔서 코드를 사용하셔야 합니다. 자바스크립트로 사이즈를 구하는 방법 자바스크립트에는 사이즈를 구할 수 있도록 도와주는 메소드와 프로퍼티들이 존재합니다. 그리고 자바스크립트

자바스크립트에서는 DOM에 대하여 여러가지 마우스 이벤트를 지원해줍니다. 그 중에서 이벤트 이름만 보면 동일한 동작을 하는 거처럼 보이는 이벤트도 있고, 특정 이벤트를 사용할 때는 조심해야 되는 이벤트도 있습니다. 그래서 이번에는 마우스 이벤트에 대해서 조금 더 관심을 가지고 보려고 합니다. 이벤트 명발생시기 mouseoverDOM과 하위DOM 에 마우스를

HTML의 쓰임은 과학자들이 논문의 내용을 서로에게 공유하는 용도로 만들어지기 시작했습니다. HTML로 작성한 문서는 다른 컴퓨터에서도 쉽게 볼 수 있었고, HTML은 텍스트 뿐만 아니라 이미지를 보여주기도 하고 하이퍼링크를 타고 다른 페이지로 이동하는 기능도 생겨 났습니다. 그 이후 넷스케이프는 HTML에 움직이는 효과를 주기 위해 HTML에서 실행될 수

비동기로 처리해야 할 상황은 서버에서도 그렇고 프론트에서도 그렇고 상당히 많습니다. 그리고 async과 await가 나왔음에도 불구하고 비동기함수 안에서 다른 함수 스코드를 생성하고 그 스코프 내부에서 비동기로 값을 전달해주기 위해서는 Promise를 사용해야 합니다. function sleep(delay){ return new Promise((res, rej)

자바스크립트는 비동기IO(입출력) 모델을 이용해서 여러개의 이벤트를 처리할 수 있습니다. 비동기IO 모델은 사용자가 이벤트가 발생했을때 기다리게 하지 않고 이벤트가 끝났을 때 알려줄 수 있는 경로만 제공해주는 것입니다. 그래서 이벤트가 발생 후 다른 이벤트를 또 발생시킬 수 있습니다. 내부에서는 여러개의 쓰레드와 프로세스가 병렬적으로 일을 처리하며, 내부에

리액트를 제대로 사용하기 위해서는 babel과 webpack을 설정해서 사용해야 합니다. 바벨로는 문법을 변환해주고 webpack으로는 파일을 하나로 패키징 해줌으로써 수십개가 넘는 파일을 일일이 html에 넣을 필요가 없어집니다. 바벨과 웹팩에 대해 잘 모르시는 분들은 바벨이란?과 웹팩이란? 글을 읽고서 오시는 것을 추천해드립니다. jsx에 대한 이해 jsx는

웹팩은 웹에서 사용되는 모든 자원(assets)을 번들링 해주는 도구입니다. 번들링의 개념은 여러개의 파일 중에 종속성이 존재하는 파일을 하나의 파일로 묶어 패키징을 시키는 과정을 의미합니다. 1번 파일에서 2번 파일에 있는 함수를 호출해야 할 경우 스크립트를 불러오는 순서를 2번 파일을 제일 상단에 올려놓고 1번 파일을 그 다음에 불러와지도록 선언을 했는데

바벨 공식 문서에는 Babel is a JavaScript compiler. Use next generation JavaScript, today. 라는 문장이 적혀있습니다. 바벨은 다음 버전의 자바스크립트 문법을 현재 사용가능한 문법으로 변환 시켜주는 역할을 하는데 여기서 현재와 다음은 조금 더 깁니다. 현재의 시점은 과거가 될 수 있고, 다음의 시점은 미래가