Study/JavaScript

JavaScript Deep Dive - 03장 - 자바스크립트 개발 환경과 실행 방법

pmh 2023. 7. 31. 23:29

 

자바스크립트 실행 환경

모든 브라우저는 자바스크립트를 해석, 실행할 수 있는 자바스크립트 엔진이 있다.
Node.js 또한 자바스크립트 엔진을 내장하고 있다.

  • 브라우저의 목표는 HTML, CSS, Javascript를 실행하여 화면을 렌더링하는 것.
  • Node.js 는 브라우저 환경이 아닌 곳에서 Javascript 개발 환경을 제공하는것이 목적이라, 브라우저의 Javascript와는 다르게 DOM Api를 제공하지 않는다. 대신 파일을 생성하고 수정할 수 있는 파일 시스템을 제공한다.
  • 브라우저는 이러한 파일 시스템을 제공하지 않는다. 제공하면 브라우저의 Javascript가 사용자의 컴퓨터에 있는 파일들을 삭제하거나 수정하게 될 수 있으니까.

웹 브라우저

다양한 웹 브라우저들이 있다. 구글 크롬, 파이어폭스, 엣지, 웨일, 사파리 등등, 이 중에서도 단연코 사용량이 가장 높은 브라우저는 구글 크롬(Google Chrome)이다.

 

그리고 이번 글에서 잘 알아봐야할 부분은 이 웹브라우저에 있는 개발자 도구다.

 

개발자 도구

크롬을 사용중이라면 F12 또는 Ctrl + Shift  + I 버튼, 맥을 사용중이라면 ⌘(Command) + ⌥ (Option) + I  를 누르면 나오게 되는 화면이다. 그중에서 일단 우리가 주로 보게되는 기능은 다음이 있다.

Elements, Console, Sources, Network, Application

 

그리고 해당 기능에 대한 심층적인 내용은 다음 포스팅에서 다뤄볼 예정이다.