[Chrome] 크롬 개발자도구 실행과 한국어 변경 방법

Author:jarvis Hours 등록일 Hours 업데이트

구글에서 만든 크롬 브라우저는 개발을 도와주는 ‘크롬 개발자도구’가 있습니다. 개발자 도구(Developer tools)를 이용해서 HTML, CSS, JavaScript의 생산성을 높일 수 있습니다. 개발자를 위한 도구이지만 글자 크기, 색, 간격과 같은 값을 확인할 수도 있고 웹사이트의 속도를 PC뿐만 아닌 모바일 버전으로도 확인할 수 있는 장점이 있습니다.

1. 개발자모드 실행 방법

실행 방법은 2가지가 있습니다. 검수하려는 웹사이트에 접속 후 맥에서 [command+option+I], 윈도우에서는 [ctrl+shift+I]를 눌러 실행하면 됩니다. 제일 많이 사용하는 단축키는 [F12]이겠죠. 직접 접속 할 때는 크롬 앱의 우측 상단 [더보기] > [도구 더보기] > [개발자 도구]를 클릭하면 확인할 수 있습니다.

크롬 개발자도구-더보기 메뉴에서 실행하기

2. 크롬 개발자도구 한국어 변경 및 다크모드 설정

개발자도구를 한국어로 변경 후 사용할 수 있습니다. 개발자도구의 기본 인터페이스입니다.

크롬 개발자도구-기본 인터페이스(영어)

크롬 개발자도구 실행 후 우측 상단 톱니바퀴 모양 [설정] 버튼을 클릭합니다.

크롬 개발자도구-우측 상단 설정 버튼

개발자 도구 설정 화면의 기본 인터페이스입니다.

크롬 개발자도구-설정 기본 인터페이스(영어)

Language를 클릭해서 한국어 변경 및 크롬 개발자도구 테마를 다크모드로 변경할 수 있습니다. 설정 변경 후 창을 닫아 주면 됩니다.

크롬 개발자도구 설정-한국어 변경 및 다크모드 설정

3. 동기화 설정하기

PC에서 설정한 것을 집에 가서 노트북 등으로 작업을 해야 하는데 재 설정을 해야 한다면 번거로울 수 있습니다. 동기화 설정이 가능합니다. 기본 환경설정 하단에 보면 [설정 동기화 사용]을 체크해서 사용할 수 있습니다.

크롬 개발자도구 환경설정-동기화 사용하기

개발자도구의 가장 기본적인 설정 법에 대해 알아 봤습니다.

GA4 설치 방법

Similar Posts

  • [MS 365] 아웃룩 검색 방법 및 검색 오류 해결

    Published:jarvis

    아웃룩 검색 기능은 메일을 보낸 사람, 내용, 아웃룩 작업과 일정 등 다양한 항목을 찾을 수 있는 기능입니다. 아웃룩 검색 방법은 [Ctrl+E] 단축키로 키워드를 입력하면 관련 항목을 찾을 수 있습니다. 검색하는 키워드는 단어 외에도 문구를 입력할 수 있습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기1. 아웃룩 검색 방법…

  • [Windows] 윈도우 자음 한자 특수문자 조합 모음

    Published:macbeth

    윈도우 자음 한자 특수문자 조합 모음표입니다. 자음에서 한자를 사용한 특수 기호는 아래와 같습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 1. 윈도우 자음 한자 특수문자 조합 모음 입력 특수 기호 [ ㄱ ] + [ 한자 ] 　 ！ ＇ ， ． ／ ： ； ？ ＾ ＿…

  • Awin Affiliate 회원가입

    Published:jarvis

    Awin Affiliate에 회원 가입을 진행했습니다. 순서에 대해 확인 해 보겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기1. Awin Affiliate란? 아마존 어필리에이트와 같이 해외에서 인지도 있는 광고대행 회사입니다. Awin Affiliate (이전 명칭: Affiliate Window)은 온라인 마케팅 분야에서 선도적인 국제적인 CPA (Cost-Per-Action) 네트워크 중 하나입니다. 전 세계의 다양한 판매자와…

  • 아마존 어소시에이트란?

    Published:macbeth

    해외 직구가 활성화되어 아이허브 및 아마존에서 직구를 많은 소비자들이 하고 있습니다. Amazon Associates는 아마존의 의 제휴 마케팅 프로그램입니다. 아마존 어소시에이트 가입 방법에 대해 간단히 알아 보겠습니다. 아마존 어필리에이트(어소시에이트) 메인 페이지로 접속 후 회원 가입을 먼저 해야 합니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 1. 아마존 어소시에이트…

  • |

    내 아이피 주소 확인(103.226..Click Here!) | IP란 무엇인가?

    Published:jarvis

    웹과 관련된 업무를 하게 되면 내가 위치한 PC 또는 모바일에서 내 아이피 주소 확인이 필요한 경우가 있을 수 있습니다. 이 페이지는 IP 주소 확인 사이트입니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기내 아이피 주소 확인 ▼ IP 주소란 무엇인가? IP는 인터넷 프로토콜(Internet Protocol)의 약자이며, 인터넷이 연결된 네트워크에서…

  • [Chrome] 크롬 개발자도구 기능 개요

    Published:jarvis

    크롬 개발자도구의 주요 기능은 웹 개발자가 웹사이트의 코드 테스트 및 디버그 작업을 할 수 있습니다. 파이어폭스, 마이크로소프트 엣지, 크롬 등 웹 브라우저에는 크롬처럼 ‘웹 개발 도구(Web development tools)’가 포함되어 있습니다. 크롬 개발자도구 기능은 개발자에게 유용한 도구임이 분명합니다. ‘devtools‘이라는 줄임말로 많이 사용되고 있습니다. ※디버그(debug) 디버깅 or 디버그는 컴퓨터 프래그램 개발 중 발생하는 시스템의 버그를…