개발자 도구

개발자 도구 실행하기: 브라우저를 열고 F12를 누른다. 빨간색 요소 검사(Inspect) 및 디바이스 툴바(Device Toolbar) 주황색 기능을 선택하는 패널. Elements: 페이지를 구성하는 HTML 검사 Console: 자바 스크립트를 실행하고 결과를 확인할 수 있음 Sources: HTML, CSS, JS 등 페이지를 구성하는 리소스를 확인하고 디버깅할 수 있음 Network: 서버와 오가는 데이터를 확인할 수 있음 Performancd Memory Application: 쿠키를 포함하여 웹 어플리케이션과 관련된 데이터를 확인할 수 있음 Security Lighthouse 노란색 현재 페이지에서 발생한 에러 및 경고 메시지 초록색 개발자 도구 설정 Elements에서 HTML 수정하기: 코드를 선택한 상태로 단축키 F2를 누르거나 더블 클릭. Console: 프론트엔드의 자바스크립트 코드에서 발생한 각종 메시지를 출력하고, 이용자가 입력한 자바스크립트 코드를 실행해주...

원문링크 : 개발자 도구