마이크로소프트는 새로운 Microsoft Edge를 위해 오픈소스인 크로미움(Chromium) 프로젝트를 채택하며 기존 브라우저를 완전히 새롭게 탈바꿈시켰습니다. 이제 Edge는 인기 있는 구글 크롬과 동일한 엔진으로 작동하며, 그에 따라 다양하고 매력적인 기능들을 제공합니다. 이러한 뛰어난 기능 덕분에 새롭게 돌아온 Microsoft Edge는 많은 사용자들의 마음을 사로잡았습니다. 크로미움 기반의 이 브라우저는 구버전 Windows는 물론 ARM64 기기까지 폭넓게 지원한다는 점도 큰 장점입니다.
Edge는 일반 사용자부터 개발자까지 모두에게 유용한 기능을 갖추고 있습니다. 특히 Edge의 개발자 도구(DevTools)는 웹페이지의 HTML을 검사·수정하거나 코드를 확인하고 디버깅할 수 있는 강력한 공간입니다. Windows에서는 F12 키를 눌러 Edge의 개발자 도구를 열 수 있지만, 상황에 따라 이 단축키를 비활성화해야 할 필요가 있을 수 있습니다. 이번 글에서는 F12 키로 개발자 도구가 열리지 않도록 설정하는 방법을 알아보기 전에, 먼저 개발자 도구가 어떤 기능을 제공하는지 살펴보겠습니다.
Microsoft Edge 개발자 도구에서 사용할 수 있는 기능
개발자 도구는 고급 사용자들이 가장 자주 찾는 영역으로, 그만큼 유용한 기능이 가득합니다. DevTools에서 사용할 수 있는 주요 패널은 다음과 같습니다.
- 요소(Elements): 접근성 속성 검사, CSS 및 HTML 코드 편집, 이벤트 리스너 확인, DOM 중단점 수정
- 성능(Performance): 웹사이트에 필요한 시스템 리소스 확인
- 소스(Sources): JavaScript 코드로 웹사이트 상태 확인, 코드 단계별 실행, 중단점 설정, 웹페이지 코드 수정
- 콘솔(Console): DOM 노드 및 JavaScript 객체 검사, window 객체용 JavaScript 실행, 로그 메시지 확인
- 메모리(Memory): 메모리 리소스 관찰 및 코드 실행 시점의 스냅샷 비교
- 네트워크(Network): 요청 모니터링 및 응답 검사
- 보안(Security): 보안 취약점 디버깅 및 HTTPS 연결 문제 해결
- Lighthouse: 웹사이트 감사 실행을 통한 전반적 성능 개선, PWA 구축, 버그 발견 및 오류 수정
- 애플리케이션(Application): 서비스 워커와 캐시, 웹 앱 매니페스트 검사·편집·디버깅, 데이터베이스·스토리지·캐시 검사 및 관리
Edge에서 개발자 도구 F12 키 비활성화하기
개발자 도구 관련 옵션은 Edge Canary에 처음 등장한 이후 지금까지 꾸준히 제공되고 있으며, 곧 Edge 안정(Stable) 버전에도 적용될 예정입니다.
그럼 이 단축키를 비활성화하는 방법을 단계별로 살펴보겠습니다.
먼저 Microsoft Edge를 실행한 후 ALT + F 키를 누릅니다. 나타난 메뉴에서 설정(Settings)을 선택하세요.
왼쪽 패널에서 시스템(System)을 클릭한 뒤 개발자 도구(Developer Tools) 영역으로 이동합니다.
이곳에서 F12 키를 누를 때 DevTools 열기(Open the DevTools when the F12 key is pressed) 옵션을 켜거나 끌 수 있습니다.
해당 옵션을 끄면(Toggle off) F12 단축키가 비활성화됩니다.
마지막으로 Microsoft Edge 브라우저를 재시작하여 변경 사항을 적용합니다.
브라우저를 다시 시작한 후 F12 키를 눌러보세요. 더 이상 개발자 도구 화면으로 이동하지 않는 것을 확인할 수 있습니다.
이 글이 도움이 되기를 바랍니다.
