크롬 개발자도구 객체와 콘솔 분리 방법

퍼블리싱(코딩)을 하는 분은 크롬의 개발자도구를 많이 사용한다. 마이크로소프트의 엣지 브라우저에도 있지만 보통 퍼블리셔 & 개발자는 크롬 개발자 도구를 많이 사용한다. 

예전 글에서는 크롬 창과 개발자 도구를 분리하는 글을 쓴적이 있는데, 오늘은 크롬 개발자 도구에서 Element(객체)와  console(콘솔) 창을 분리하는 방법을 소개한다. 

 

 

이미지와 같이 크롬 개발자 도구에서 라이브코딩을 위해 콘솔 창을 분리한 모습이다. 기존에는 객체 옆에 콘솔창이 있다.

 

 

이렇게 Elements 옆에 Console 창이 있다.

 

 

 

개발자도구 초기 모습이다. 닫기 버튼 옆 이미지 표시에 있는 점점점을 클릭하면 Show console drawer옵션을 선택하면 크롬 개발자 도구에서 콘솔창을 분리할 수 있다. 자바스크립트를 공부하는 분에게 중요한 팁일 것이다. 

 

화이팅.