Chrome DevTools
1. 개발자 도구란 무엇이며 왜 사용하나?
- 개발자 도구는 브라우저에서 제공하는 도구(tool) 이다. (브라우저마다 개발자 도구가 있다)
- 웹 사이트 디버깅을 빠르게 할 수 있도록 도와준다. 디버깅이란, 문제를 캐치하고 문제의 원인을 파악하여 수정하는 것을 말한다.
- 프론트엔드 개발을 할 때 개발자 도구를 계속 켜 놓고 작업하는 경우가 많다.
2. 개발자 도구 열기
- 운영체제의 종류마다 개발자 도구를 여는 방법이 다르다.
- 윈도우는 F12 키를 누르면 된다.
3. 패널
- 개발자 도구에는 여러 패널들이 존재한다.
- 그 중에서 가장 많이 쓰이는 5개의 패널은 elements, console, source, network, application 이다.
- 적절한 상황에 적절한 패널을 사용하면 생산성을 높일 수 있다.