[Chrome] 개발자 도구 console clear 방법 및 꿀팁!

From Pixabay deepanker70's Image

웹 개발을 하다 보면, Javascript에서 debugger;를 통해 콘솔 창에서 작업을 하는 경우가 많습니다. 이때, console 창이 지저분해지는 경우가 있는데, 싹 지워버리는 방법을 알아보겠습니다. 또한, 듀얼 모니터를 사용하시는 분은 개발자 도구창을 따로 창으로 띄워서 보면 좁게 보지않아 매우 편리한데요 이 방법 역시 알아보겠습니다.

 

Contents

---

​

Console Clear 방법

1. JavaScript 사용

console.clear()

 

2. Windows 단축키

Ctrl + L

 

3. Mac 단축키

Command + K

 

Console창 따로 띄우는 방법

Console창 따로띄우는 방법

윈도우라면 F12를 눌러서, Mac이라면 option + command + i를 눌러 개발자 도구를 켭니다. 위 그림의 빨간 박스 부분처럼, 오른쪽 위에 점 3개 아이콘을 누르고, 창모양을 누르게 되면 개발자 도구가 별도의 창으로 분리됩니다. 아래 그림은 개발자 도구 콘솔 창이 디폴트로 내부에 있는 경우와 따로 창으로 빼내어 듀얼 모니터로 함께 보는 결과 화면입니다. 이렇게 하면 웹 개발 시 원래 창에서 자유롭게 콘솔 창을 다룰 수 있으며, 화면을 넓게 사용할 수 있다는 이점이 있습니다.

 

Console창 따로 띄우기 전

Console창 따로 띄우기 전

Console창 따로 띄운 후

Console창 따로 띄운 후

 

읽어주셔서 감사합니다.

오늘도 유익하셨길 바랍니다. 

다음에 더 유익하고 재미있는 포스팅으로 찾아오겠습니다.

 

Reference)
1. https://velog.io/@leyuri/chrome-%EA%B0%9C%EB%B0%9C%EC%9E%90-%EB%8F%84%EA%B5%AC-console-tab-clear-%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95